Product Main
1. Configure Product Main option
In Theme Customize, go to Product page (Default product) > Product Main option to configure the product summary settings on the Single Product page.
1.1. Product Layout
Product Layout option: You can choose a layout for the Product page here. We have 3 layouts for you to choo: Width 1600px (Default layout) and Fullwidth layout.
Enable sticky product information on large screens checkbox: Tick on this checkbox to enable sticky product information on large screens.
You can view some images below to check the product page layouts:
1.2. Media
Media layout: Please choose a layout for the Product page here. We have total 7 layouts for you to choose.
You can check the product layout in the video below:
Media size: Choose a size for the Product featured image here. We have 3 sizes for you to choose: Large, Medium and Small.
Thumbnail left/right size: Choose a size for the Product thumbnail images here. We have 3 sizes for you to choose: Large, Medium and Small.
Media ratio: Choose a ratio for the Product featured image here. We have total of 14 ratios for you to choose.
Media ratio size: Choose a ratio size for the product's main image here, we have total of 2 sizes for you to choose. This setting applies only if the media ratio is not set to 'Adapt to media'.
Media position: Choose a position for the product's main image here, we have total 10 positions for you to choose.
Image click action: Choose an action for the image when you click on it here, we have 2 actions for you to choose: PhotoSwipe popup and Zoom. You can choose None if you don't wanna use action.
Zoom type: Choose a zoom type for the product main image (when you choose action Zoom) here. We have 3 types for you to choose.
Enable 'zoom image' icon: Tick on this checkbox to enable the Zoom icon.
Enable click image show zoom popup: Tick on this checkbox to enable show a popup when clicking on the image.
Enable video looping: Tick on this checkbox to enable video looping (when your product media has a video).
1.3. Product Slider
Configure the styles for Product slider in the options below:
Use prev/next button checkbox: Tick on this checkbox to show the pre/ next buttons on the product image.
Visible: Choose to show the pre/ next buttons always or only when hovering here.
Button style: choose a style for the pre/ next buttons here. We have 3 styles for you to choose.
Button shape: configure the shape for the pre/ next buttons here. We have 3 shape styles for you to choose.
Button color: configure the color for the pre/ next buttons here.
Button size: Choose a size for the pre/ next buttons here.
Hidden buttons on mobile checkbox: Tick on this checkbox to hide the pre/ next buttons on the image on mobile device.
From Unsen version 1.2 updated style Pre Next for Product Image with number:
1.4. Product Tabs
Product tabs design: Choose a design for the product tabs here. We have 2 designs for you to choose: Tab and Accordion.
Product tabs design mobile: Choose a design for the product tabs on mobile devices here.
Choose a position for the product tabs here.
Enable auto-open first tab checkbox: Tick on this checkbox to enable auto-open first product tabs.
Product tabs layout: Choose a layout for the product tabs here.
Background Color: configure the background color for the product tabs here. This option also supports configuring Metafield, so you can change the background color of Description option for every single product title.
Background Color (mobile): configure the background color for the product tabs on mobile devices here. This option also supports configuring Metafield, so you can change the background color of Description on Mobile devices for every single product title.
(Frequently Bought Together) Products: Choose products for the Frequently Bought Together option here. You can read more in this article.
1.5. Sticky Add To Cart
Sticky mode: You can choose a mode for the Sticky Add To Cart button here. We have 3 modes: Visible on desktop, mobile, Only visible on desktop and Disable.
Show sticky add to cart after: We have 2 types for you to choose: Show when scrolls outside the scope of the form and Always show. If you choose Always show, the Add to Cart button will always show at the bottom of the page.
Button animation: Choose an animation styles for the Add to Cart button here. We have total of 7 animation styles for you to choose here.
Loop time (seconds): Configure the time that you wanna loop the animation here.
2. Blocks in the Product Main option
The Product Main option has total of 24 blocks for you to add to the sidebar:
Product Title
Product Price, review
Description
Live view
Product Form
Size chart, Delivery, Ask
Product meta
Tab Description
Tab Additional Infor
Tab Custom HTML
Tab Review
Pickup availability
Product social
Trust Badge
Brand Image
Inventory Quantity
Trust Badge
Total Sold Flash
Delivery Time
Text
Custom HTML
Custom Liquid
Tab Custom HTML
Tab Custom Liquid
With Image, Custom HTML and Text block, you guys can add more than 1 time to the Product Main option.
When you add each block to the Product main option, the right settings sidebar (of that block) will show, and allow you to configure those blocks to follow what you want. You can see some example images below:
[Private offer] Unsen Partner Plan
Exclusively for Unsen users, you can get EComposer - Theme Partner Plan for ZERO and start making beautiful, high-converting store pages today:
FREE 100% EComposer Standard plan for 6 months (save you $114)
Build ANY Shopify pages: Landing page, Sales Funnel page, Lead pages, & other custom pages tailored for your marketing campaigns.
Create advanced sections & add to Unsen with ease
Save up to 50 pages/sections
100+ professional, stunning pre-designed templates
Anyone can build pages with live drag-drop editor
How to claim offer: Install EComposer HERE. Then open chatbox icon in EComposer dashboard and leave a message with subject “Unsen+EComposer” to upgrade for free.
Cheers, The4.
Last updated
