The Products and Product grid portions of the Theme settings control how customers view and interact with products across your entire store. Display details such as vendor, sale badges, and review badges by adjusting these settings.
Products theme settings
Open the PRODUCTS portion of the Theme settings to access the following settings.
Sale badges
Select Enable sale badges to activate the labels indicating that an item is marked down from its regular price. Empire includes three different sale badge styles, allowing merchants to display a percentage off, a dollar amount, or a simple, classic “sale” badge. You can customize the look of these sale badges from the Sale badge style dropdown below.
Variant selection
Select an Option style to display your product variants in a dropdown menu (Dropdown) or as individual radio buttons (Selectable boxes).
Consider using Empire's swatch feature for another variant style option: Using swatches for product variants
Sold out options
Use the Sold out options portion of your product page template settings to control how sold-out products are presented in the product form.
The options are:
- Selectable
- Disabled
- Hidden
Selectable keeps out-of-stock variants visible and allows customers to select them, however, they cannot be added to the cart.
Disabled will keep out-of-stock variants visible, but not selectable by the customer.
Hidden excludes out-of-stock variants altogether from the product form.
Automatically select the first available variant
By default, the Auto-select first available variant setting is enabled. This allows customers to either add the default selection or select another variant before adding it to their cart.
Dynamic checkout buttons
Include an additional add-to-cart button that also directs customers straight to the Checkout page, enable Show dynamic checkout button.
Working with dynamic checkout buttons
Redirect customers to the cart
Enable cart redirection to direct your customers to the cart page after adding an item to the cart.
Some apps require disabling AJAX, which is precisely what Enable cart direction allows. To disable AJAX, simply Enable cart direction.
Product reviews
Activate Enable product reviews and ratings to add star ratings to your products (requires Shopify's Product Reviews app).
Review badges
Star ratings are displayed in badges to show the average rating for a product. Select Product grid and product pages to include these badges on both the product page and the product grid (Collection page, Featured collection section, Search results page, etc.). To limit the badge to the product page, select Product pages only.
Color swatches
A Color swatch is a thumbnail image used to indicate a particular color, pattern, or shade for a product variant. Empire provides swatches as a variant display option for the Product page, as well as the product card and tag filters on the collection page.
Using Empire's color swatches for product variants
Product grid theme settings
Open the PRODUCT GRID portion of the Theme settings to access the following settings.
Show vendor
This will display the brand or supplier beneath the product title. Add a vendor to each product through the Products portion of your Shopify admin.
Emphasize price
Draw more attention to the price by enabling Emphasize price. This will swap the position of the price and product title, as well as expand the font size for the price.
Show "Add to cart" button
Enable Show "Add to cart" button to include an add-to-cart (ATC) button for the product cards. Disable to exclude this from the product grid.
Select an option from the Add to cart button dropdown to Show on desktop and mobile or Show on desktop only.
Product images
Activate Show second product image on hover to swap between the first and second product image when a customer's cursor hovers over the area.
Use the Aspect ratio dropdown to select Natural, Short (4:3), Square, or Tall. This setting controls how images fit within the gallery container.
Activate Enable image crop to avoid including white space in the image container.
Quick shop
The quick shop feature allows customers to view product information, explore options, and add the product to their cart—all without leaving the product grid.
Under Quick shop, select Enable quick shop.
Customize the content of the Quick shop by customizing its template.
Customize the Quick shop template
Use the "Quick shop" button setting to Show on desktop and mobile or Show on desktop only.