Product Settings
Navigate to Theme Settings > Products to get started.
Frame
Frame allows you to create custom swatches for your products.
Swatches
Frame offers clickable color swatches for products. The default option names are Color and Colour. However, you can use other names like Material, Style, or any option you want by defining these options in your Theme Settings. Learn more about setting up color swatches here.
- In the Variant option for swatches field, you will see the default values 'Color, Colour'. To support different options please add them using commas (e.g. Fit, Material, Style).
- In the Variant option for swatches (plural) field, add the plural of each variant name. Use the same order. For example, if the values in the Variant option for swatches field are 'Color, Colour, Material', write 'Colors, Colours, Materials' in the plural field. This setting is necessary to show correct grammar.
Honey
Honey allows you to create custom swatches and checkboxes for your products, customize the information shown on your product cards, and change some aesthetic styles.
Swatches
Honey offers clickable color swatches for products. The default option names are Color and Colour. However, you can use other names like Material, Style, or any option you want by defining these options in your Theme Settings. Learn more about setting up color swatches here.
- In the Variant option for swatches field, you will see the default values 'Color, Colour'. To support different options please add them using commas (e.g. Fit, Material, Style).
- In the Variant option for swatches (plural) field, add the plural of each variant name. Use the same order. For example, if the values in the Variant option for swatches field are 'Color, Colour, Material', write 'Colors, Colours, Materials' in the plural field. This setting is necessary to show correct grammar.
Checkbox
Honey has the ability to display variants as a checkbox. The default option name is Engraving. However, you can use other names like Monogramming, Gift Wrapping, or any option you want by defining these options in your Theme Settings.
- In your Shopify Admin, go to the product you want to add a checkbox to and create a new variant. For example, you can add a variant called ‘Engraving’ with the options ‘Yes’ and ‘No’. If desired, you can set a higher price for the ‘Yes’ option.
- Open the Theme Editor and navigate to Theme Settings > Products.
- In the Variant option for checkboxes field, add the name of the variant you created. The name must match the name of the variant exactly. To support different options please add them using commas (e.g. Engraving, Monogramming).
- In the Checkbox labels field, add the description or instruction you want to show to the customer. This text will appear next to the checkbox. Use the same order. For example, if the values in the Variant option for checkboxes field are 'Engraving, Monogramming', write 'Add Engraving, Add Monogramming' in the field.
Product card
- Enable Show second image on hover to display the second product image upon hover. This feature is an excellent way to show customers a product in two different uses. For example, if you have a clothing store, you may want to show a garment laying flat and on a model.
- Please note that this feature will only work on desktop and laptop devices. Hover is not available on touch devices.
- Enable Show vendor to display the vendor or brand on each product card. This feature is perfect for multi-brand retailers that offer many brands to their customers.
- Please enter the vendor into each Shopify product page to ensure this feature works correctly.
- Enable Show rating to display the rating stars on each product.
- You must add a product rating app for this feature to work, Learn more.
- To display swatches on your product cards, click Show swatches.
- If your products use variant images, follow the instructions below. If not, skip to Step 6.
- In your Shopify admin, navigate to Settings > Custom data.
- Click the Products tab.
- Click Add definition in the top-right.
- Type Card swatch type in the Name field. You must use this exact name for the feature to work.
- In the Namespace and key field, replace the word 'custom' with 'theme.' The text should look exactly like this
theme.card_swatch_type
- Click (+) Select type.
- Under the Text group select Single line text.
- Click Save.
- Navigate to Products in your Shopify admin and select a product that uses variant images.
- Scroll down to the Metafields section.
- Click the Card swatch type metafield and type Variant images in the field. You must use this exact name for the feature to work.
- Repeat steps i - k for all products that use variant images. If you have many products, you can edit Metafields in bulk.
- Click Save.
- Select the Swatch shape you desire: Circle, Square or Rectangle.
- If desired, use the slider to change the Swatch size.
- Enable Show quickshop button to give your customers the tools they need to quickly view products, select variants, and add them to their cart directly from the product card. This option lets your customers to quickly and easily purchase a product without the need to visit the product page.
- On desktop devices, this button is only visible on hover to reduce visual clutter on the page. However, touch devices do not have a hover state and, therefore, the button always displays.
- The button text will say Add to Cart if the product does not have any variants. However, if the product has variants, such as Size or Color, the button text will change to Select Options.
- Enable Show countdown timer to display a countdown timer over the product image on the product card. This feature is ideal to create urgency around a sale, promotion, or limited edition product.
- The timer only displays on hover on desktop devices. It will not display on touch devices.
- You must first setup the timer for this feature to work. Please read Add a Countdown Timer to a Product.
Product style
- To change the style of your product titles, use Product title style. You can choose 'None,' which will render the product titles as you entered them, or 'All caps,' which will convert the product titles to all capital letters. This option is ideal to give balance to your store's design.
- Check Enable border on product gallery if you want to change the style of the product gallery by adding a border. This adds a frame to your product images.
- If this option is enabled, use the Border color selector to choose the border color you want.