Crafted Pour Cocktail Gallery Plugin

Shopify Crafted Pour Gallery Instructions

Rev June 9, 2023

Please start by reviewing the Initial Steps page. Once complete, return here to complete the setup on your Shopify site.

Integration to Shopify:

There are two procedures to integrate CraftedPour Cocktail Gallery plugin into a Shopify site:

1.. If you want to add a general cocktail gallery page to your site, follow the “Cocktail Gallery Page” instructions below.

2. If you want to add recipes to the middle of your product pages, follow the “Product Page Recipes” instructions further down on this page.

Cocktail Gallery Page

Instructions to create a dedicated Cocktail Gallery Page:

1. Go to the Admin panel of the Shopify site and click on Pages section

Image 1

2. Click on the Add Page button on the top right:

You should see the following screen:

Image 2

Image 3

3. Now switch the Content editor to HTML by clicking the “<>” button:

4. To generate a gallery for an entire brand, paste the following script into the Content box:

<script id="crafted-pour-recipe-plugin-script" type="text/javascript" src="https://plugin.craftedpour.com/scripts/crafted-pour-recipe-plugin.js?brand=<brand_id>&color=<color_hex>">

Alternatively, you can generate a gallery for a single product by replacing “brand=” with “product=” and using a product id supplied by Crafted Pour.

<script id="crafted-pour-recipe-plugin-script" type="text/javascript" src="https://plugin.craftedpour.com/scripts/crafted-pour-recipe-plugin.js?product=<product_id>&color=<color_hex>">

You can also optionally add &rows= followed by an integer. This will cause the plugin to display up to that many rows with arrows to flip pages rather than an infinite number of recipes on the same page.

Replace the brand_id, product_id, and color_id in the above script as follows:

brand_id and product_id: As provided by Crafted Pour.

color_hex: This can be any color in the form of a hex value with six digits (without “#”), e.g., FF01ED.

For help finding Hex codes, you can use a hex color tool such as found here: https://htmlcolorcodes.com

Chose a page title in the Title box. (e.g., Cocktail Recipes)

You should have the following screen now: 

Click Save, and the page is ready. 

You should see cocktails loaded into the page you created:

Image 4

Product Recipe Pages

Instructions to add the cocktail gallery to individual product pages:

Adding the plugin to individual product pages is more complex but fully supported. Please refer to this document for detailed instructions:

https://docs.google.com/document/d/1xcpx-4NW9IrWKEEi7GSse4E0osbEpOG3fc3C99RTwnI/edit?usp=sharing

Contact support@craftedpour.com with any questions or issues.

Enjoy your new cocktail gallery

Contact support@craftedpour.com with any questions or issues