Featured product displays a selected product in its own dedicated section, complete with product gallery, form, and customizable details. Enhance a template with this section so customers can explore the product's details, then add it to their cart—all without leaving the page.
Add this section to
Customize section settings
Click the Featured product section to open its general settings.
Select product
Click Select product to connect one of your products with the section.
Auto-select first available variant
By default the featured product section will display a preselected variant on page load. To disable this, deselect Auto-select first available variant to require customers to select a variant (e.g. Choose an option).
Product badges
Badges for your products highlight key qualities of a product, most notably Sale.
Add more badges by customizing the TAGS field in your Shopify admin, then adjust the Display badges setting to display Sale badges only, Custom badges only, Custom badges preferred, or Both sale and custom badges.
Gallery size
Select Small, Medium, or Large for the Gallery size.
Enable Show gallery thumbnails to display additional product media as thumbnail images.
Select Natural, Portrait (3:4), Landscape (4:3), or Square (1:1) from the Media aspect ratio dropdown to control the width-to-height proportions of the media container.
Adjust the Media crop mode to control how the media fits within the gallery. Select Fit to display the entire image within the container (minimal or no cropping). Select Fill to expand the image to prioritize the container (cropping).
Adjust the Mobile media width to limit the gallery width to 80% or 90%, or expand it to 100%.
Enable image zoom
Allow customers to get a closer look at high-quality product images by activating the image zoom settings.
Video autoplay and looping
For product videos, activate autoplay by selecting Enable video autoplay. Repeat the video automatically at its end by selecting Enable video looping.
Activate Enable video mute to disable the sound for the video.
Customize blocks
Click the toggle beside Featured product to reveal the blocks. Use these blocks to customize the layout and features for the section.
There are blocks for Title, Price, Text, Variant picker, Quantity, Description, Buy buttons, Vendor, SKU, Product rating, Inventory status, Size guide, Page, Collapsible tab, Product upsell, Share, Custom Liquid, Product badges, Product label, Spacer, and Product details.
Price block
Click the Price block to open its settings. Enable Show label to include the label (Price) above the price.
Text block
Click the Text block to open its settings.
Add text to the Text field, then adjust the Text style (Accent, Subheading, Body).
Variant picker block
Click the Variant picker block to open its settings.
Select Dropdown or Selectable boxes from the Option style dropdown.
Select one of three Sold out options (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.
Activate Enable color swatches (enable disable)
A Color swatch is a solid color or thumbnail image used to indicate a particular color, pattern, or shade for a product variant.
Use the Color option style setting to select Color swatch or Variant image.
Description block
Click the Description block to open its settings.
By default the description will be contained in an accordion-style tab. To disable this, click to deselect Show as tab.
If the former setting is activated, enable Show tabs as opened by default to have the description container expanded by default.
Add a Heading for the description with the provided field.
Buy buttons block
Click the Buy buttons block to open its settings.
Activate Show dynamic checkout buttons to add a secondary cart button offering customers an option to proceed directly to the Checkout page—bypassing the cart page entirely and completing the purchase with a preferred payment type.
Vendor block
Click the Vendor block to open its settings.
Enable Link to vendor collection to have the vendor label connect customers with a collection page containing more products with that vendor.
Select a Text style (Accent, Subheading, Body).
Spacer block
Click the Spacer block to open its settings.
Select Small, Medium, Large for the Spacing setting to control the space between the blocks before and after the Spacer block.
Inventory status block
Click the Inventory status block to open its settings.
Enable Show "In stock" status to display the status for stocked products.
Activate Show "out of stock" status to display the status of sold-out products.
Enable Show "Low stock" status to display a low-stock status for products with inventory below the set Low stock threshold.
Enable Show inventory transfer notice to display a notice indicating changes in inventory for a product.
Size chart block
Click the Size chart block to open its settings.
Add a Label using the provided field.
Connect a Single-line text metafield as a dynamic source to have separate content for different products Learn more
Select Coat hanger, Diagonal arrows, Ruler, Ruler (rotated), or T-shirt from the Icon dropdown.
Connect a Page by clicking Select page.
Page block
Click the Page block to open its settings.
Add a Label using the provided field.
Select a Button style. The options are Primary, Secondary, Tertiary, or Text. Select Small, Medium, or Large for the Button size.
Connect a Single-line text metafield as a dynamic source to have separate content for different products Learn more
Connect a Page by clicking Select page.
Collapsible tab
Click the Collapsible tab block to open its settings.
Also known as an accordion, use the Collapsible tab block to include a Heading, Link, and Page content in an interactive container.
Enable Show tabs as opened by default to have the tab expanded on page load.
Product label block
Click the Product label block to open its settings.
Add a Label using the provided field.
Connect a Single-line text metafield as a dynamic source to have separate content for different products Learn more
Click Select Image to connect an Icon for the label.
Customize the styling by adjusting the Label style and Label size.
Custom Liquid block
Add a Custom liquid block to inject custom code as a section block.
Use the Custom liquid field to include Liquid-formatted code.
Product details block
The Product details block provides a call-to-action link to direct customers to the product page for the product.
Share your experience with Tailor
Your feedback is crucial! Help make Tailor better by sharing your thoughts.
What to provide:
- Pain points: What's not working for you?
- Missing features: What should we add to Tailor?
- General feedback: Any other ideas?
How to provide feedback:
- Fill out our quick and easy form.
- Details help us improve, so the more specific, the better!