Product page
Overview:
The Main Product Section serves as the primary area for showcasing individual products on a Shopify product page. This section provides various settings and block options for customizing product presentation, including media displays, pricing, reviews, and action buttons.
Section Configuration:
General Settings
| Setting |
Description |
| Show Breadcrumb |
Toggles the display of the breadcrumb navigation. Default: Enabled. |
| Show Top Border |
Adds a border at the top of the section. Default: Disabled. |
| Show Bottom Border |
Adds a border at the bottom of the section. Default: Enabled. |
| Breadcrumb Color Scheme |
Select a color scheme for the breadcrumb navigation. Default: Scheme 2. |
| Section Color Scheme |
Select a color scheme for the entire section. Default: Scheme 1. |
| Setting |
Description |
| Product Media Size |
Adjusts the size of product images. Options: Adapt, Square, Portrait, Landscape. Default: Adapt. |
| Product Gallery View |
Determines the layout of product media. Options: Slider with Thumbnails, Slider Only, Thumbnails Only. Default: Slider with Thumbnails. |
| Auto Play |
Enables automatic slideshow for product images. Default: Disabled. |
| Show Navigation |
Displays navigation arrows for the product gallery. Default: Enabled. |
| Change Slides Every |
Sets the interval for automatic slide changes. Range: 2–9 seconds. Default: 5 seconds. |
Spacing Settings
| Setting |
Description |
| Top Padding |
Adjusts the padding at the top of the section. Range: 0–100px. Default: 50px. |
| Bottom Padding |
Adjusts the padding at the bottom of the section. Range: 0–100px. Default: 50px. |
Blocks Configuration
Review Block
| Setting |
Description |
| Author Name |
The title for the review, usually the author’s name. |
| Heading Size |
Adjusts the size of the review heading. Options: Small, Medium. Default: Small. |
| Heading Weight |
Adjusts the font weight of the heading. Options: Bold, Semi-Bold, Medium, Normal, Light. Default: Normal. |
| Review Text |
Add the review content. |
| Review Text Size |
Adjusts the size of the review text. Options: Small, Medium, Large. Default: Large. |
| Review Text Weight |
Adjusts the font weight of the review text. Options: Bold, Semi-Bold, Medium, Normal, Light. Default: Light. |
| Rating Stars |
Displays a star rating. Options: None, 1-5 Stars. Default: 5 Stars. |
| Color Scheme |
Sets a specific color scheme for the review block. Default: Scheme 2. |
| Bottom Margin |
Adjusts the spacing below the block. Range: 0–50px. Default: 0px. |
Title Block
| Setting |
Description |
| Heading Size |
Adjusts the size of the product title. Options: H1, H2, H3. Default: H3. |
| Heading Weight |
Adjusts the font weight of the title. Options: Bold, Semi-Bold, Medium, Normal, Light. Default: Bold. |
| Bottom Margin |
Adjusts the spacing below the title block. Range: 0–50px. Default: 8px. |
Price Block
| Setting |
Description |
| Text Size |
Adjusts the size of the price text. Options: Small, Medium, Large. Default: Large. |
| Text Weight |
Adjusts the font weight of the price text. Options: Bold, Semi-Bold, Medium, Normal, Light. Default: Normal. |
| Bottom Margin |
Adjusts the spacing below the price block. Range: 0–50px. Default: 10px. |
Statistics Block
| Setting |
Description |
| Show SKU |
Displays the product SKU. Default: Enabled. |
| Show Stock Status |
Displays the stock availability. Default: Enabled. |
| Show Vendor |
Displays the product vendor. Default: Enabled. |
| Text Weight |
Adjusts the font weight of the statistics text. Options: Bold, Semi-Bold, Medium, Normal, Light. Default: Light. |
| Bottom Margin |
Adjusts the spacing below the block. Range: 0–50px. Default: 16px. |
Variants Chart Block
| Setting |
Description |
| Style |
Determines the display style for variants. Options: Dropdown, Pills. Default: Dropdown. |
| Show Size Chart |
Toggles the display of a size chart. Default: Enabled. |
| Size Chart Image |
Upload an image for the size chart. |
| Bottom Margin |
Adjusts the spacing below the block. Range: 0–50px. Default: 22px. |
| Setting |
Description |
| Enable Question Button |
Toggles a button for customer inquiries. Default: Enabled. |
| Enable Share Button |
Toggles a button for sharing the product. Default: Enabled. |
| Bottom Margin |
Adjusts the spacing below the block. Range: 0–50px. Default: 0px. |
Product recommendations:
General Settings
| Setting |
Description |
| Section Caption |
Text displayed above the heading. Use this to introduce the section. |
| Caption Size |
Size of the caption text. Options: Small, Medium, Large. Default: Small. |
| Caption Weight |
Font weight for the caption text. Options: Bold, Semi-Bold, Medium, Normal. Default: Medium. |
| Section Heading |
Main heading of the section. |
| Heading Size |
Size of the heading text. Options: H1, H2, H3, H4. Default: H3. |
| Heading Weight |
Font weight for the heading text. Options: Bold, Semi-Bold, Medium, Normal. Default: Bold. |
| Max Header Size |
Limits the width of the heading for better responsiveness. Range: 50–100%. Default: 100%. |
Slideshow Settings
| Setting |
Description |
| Auto Play |
Enables automatic scrolling of the product slider. Default: Disabled. |
| Show Navigation |
Displays navigation arrows for the slider. Default: Enabled. |
| Show Pagination |
Displays pagination indicators for the slider. Default: Disabled. |
| Change Slides Every |
Adjusts the time interval for automatic slide changes. Range: 2–9 seconds. Default: 5 seconds. |
Grid Layout Settings
| Setting |
Description |
| Number of Columns on Desktop |
Set the number of columns for desktop view. Range: 2–4. Default: 4. |
| Products to Show |
Specify the total number of products displayed. Range: 2–16. Default: 12. |
| Number of Columns on Mobile |
Choose between 1 or 2 columns for mobile view. Default: 2. |
Product Card Settings
| Setting |
Description |
| Media Size |
Set the product media layout. Options: Adapt, Square, Portrait, Landscape. Default: Adapt. |
| Heading Size |
Size of the product title. Options: Small, Medium, Large. Default: Small. |
| Heading Weight |
Font weight for product titles. Options: Bold, Semi-Bold, Medium, Normal, Light. Default: Normal. |
| Buttons Position |
Position of action buttons. Options: Top, Bottom. Default: Top. |
| Enable Add-to-Cart |
Displays an Add-to-Cart button for products. Default: Enabled. |
| Enable Quick View |
Allows customers to preview products quickly. Default: Enabled. |
| Show Swatches |
Displays product swatches if available. Default: Enabled. |
| Show Price |
Displays product prices. Default: Enabled. |
| Show Vendor |
Displays product vendors. Default: Enabled. |
| Show Stock Tags |
Displays product availability. Default: Enabled. |
| Show Sale Tags |
Displays sale indicators for discounted products. Default: Enabled. |
Layout Settings
| Setting |
Description |
| Thumbnail Layout |
Choose between Scroll, Thumbnail, or Slider view for products. Default: Slider. |
| Desktop Text Alignment |
Adjust text alignment for desktop view. Options: Left, Center, Right. Default: Center. |
| Mobile Text Alignment |
Adjust text alignment for mobile view. Options: Left, Center, Right. Default: Center. |
| Color Scheme |
Apply a color scheme to the section. Default: Scheme 1. |
Spacing Settings
| Setting |
Description |
| Top Padding |
Adjust the padding at the top of the section. Range: 0–100px. Default: 50px. |
| Bottom Padding |
Adjust the padding at the bottom of the section. Range: 0–100px. Default: 50px. |