Gel Pack Documentation

Pack Template

To use the Pack product template, the product must have the theme template set to ‘pack’. There should not be an inventory restriction set on the product. Only one variant is allowed for a pack product.

The featured product image is used as the image on the left of the page header, while the product title and the product description are used in the text block at the right side of the page header.

In the theme customizer, you can edit this pack product template. To update the products per row, click on the Pack Product Template, and you will see a product per row slider. You can choose how many products you want to display in the rows. It goes up to 8.

Tags

Pack::## - the number of items to be ordered per pack; replace the ## in the tag with the number of items

Metafields

Option Collection – the Shopify handle of the collection where the components of the pack are located; this will be fetched when the page loads to display the available options

When you create the collection that is going to be used for the pack template, at the bottom of the collection in the admin where it says EDIT WEBSITE SEO

You need to click there. Then copy the handle after the last / - so in this example it is choose-your-12-colors-evo

Copy that handle. Then, go back to the gel pack in the admin and paste that handle in this metafield

Swatch Images

Swatch images for the color selector in the floating bottom bar are loaded from the assets folder of the theme. The format of the filename is swatch--color handle.png. The style will fallback to the color name if no image exists. For example, the swatch for Metallic would be called swatch--metallic.png.

Component Products

Component products need to be tagged with a specific color group name to be categorized correctly on the pack product page. The tag is in the format of color::Color Name. For example, to categorize a color as Blue, the tag should be color::Blue. The color name portion after the :: can be formatted however you would like.