Product page
Overview:
The Product page is one of the most important pages on any store. It’s where customers can access in-depth information and learn about other products they might be interested in. More importantly, it’s where purchases are most frequently made, and as such, an effective Product page is essential for any Shopify store.
Section Configuration:
| Setting |
Description |
| Media Size |
A select field for media size with options for adapt, square, portrait, and landscape, defaulting to square. |
Breadcrumb Settings
| Setting |
Description |
| Show Breadcrumb |
A checkbox to toggle the display of breadcrumbs, defaulting to true. |
| Show Top Border |
A checkbox to toggle the display of the top border, defaulting to false. |
| Show Bottom Border |
A checkbox to toggle the display of the bottom border, defaulting to true. |
| Color Scheme |
A color scheme selector for the breadcrumb with a default value of "scheme2". |
Slideshow settings
| Setting |
Description |
| Show Navigation |
A checkbox to toggle the display of navigation arrows in the slideshow, defaulting to true. |
Color Scheme Settings
| Setting |
Description |
| Color Scheme |
Choose a predefined color scheme to ensure consistency with the store’s branding. |
Spacing Settings
| Setting |
Description |
| Top Padding |
Adjust the space above the section content. |
| Bottom Padding |
Adjust the space below the section content. |
Blocks Configration:
Statistics Bar
| Setting |
Description |
| Show Stock |
Checkbox to show or hide stock information. |
| Show Saving Badge |
Checkbox to show or hide the saving badge |
| Enable Share and Compare |
Checkboxes to enable or disable share and compare buttons. |
| Bottom Margin |
Range field to set the margin below the block. |
Price
| Setting |
Description |
| Bottom Margin |
Range field to set the margin below the block. |
Separator
| Setting |
Description |
| Bottom Margin |
Range field to set the margin below the block. |
Variation and SKU
| Setting |
Description |
| Show Variation and SKU |
Checkboxes to show or hide variation and SKU. |
| Enable Chart |
Checkbox to enable the size chart. |
| Size Chart Image |
Image picker for the size chart image. |
| Bottom Margin |
Range field to set the margin below the block. |
| Setting |
Description |
| Show Subtotals |
Checkbox to show or hide subtotals. |
| Bottom Margin |
Range field to set the margin below the block. |
| Setting |
Description |
| Show Dynamic Checkout |
Checkbox to show or hide dynamic checkout buttons. |
| Show Gift Card Recipient |
Checkbox to show or hide the gift card recipient option. |
| Size Chart Image |
Image picker for the size chart image. |
| Bottom Margin |
Range field to set the margin below the block. |
WhatsApp Settings
| Setting |
Description |
| Show WhatsApp |
Checkbox to toggle the display of WhatsApp share button. |
| WhatsApp Number |
Text field for the WhatsApp number. |
| Custom Message |
Textarea for the custom WhatsApp message. |
Pickup Availability
| Setting |
Description |
| Bottom Margin |
Range field to set the margin below the block. |
Complementary Products
| Setting |
Description |
| Heading |
Text field for the complementary products heading. |
| Show Navigation |
Checkbox to show or hide navigation arrows. |
| Bottom Margin |
Range field to set the margin below the block. |
Message Box
| Setting |
Description |
| Heading |
Rich text field for the message box heading. |
| Text Size |
Select field for text size. |
| Bottom Margin |
Range field to set the margin below the block. |
Countdown Timer
| Setting |
Description |
| Heading |
Text field for the countdown timer heading. |
| End Date |
Text field for the countdown end date. |
| End Type |
Select field for the action on countdown end. |
| End Message |
Rich text field for the message to display on countdown end. |
| Bottom Margin |
Range field to set the margin below the block. |
Title
| Setting |
Description |
| Heading Size |
Select field for the heading size. |
| Bottom Margin |
Range field to set the margin below the block. |
Text
| Setting |
Description |
| Heading |
Rich text field for the text block heading. |
| Text Size |
Select field for text size. |
| Show Rating |
Checkbox to show or hide the product rating. |
| Bottom Margin |
Range field to set the margin below the block. |
Content
| Setting |
Description |
| Bottom Margin |
Range field to set the margin below the block. |
Specifications
| Setting |
Description |
| Feature Name and Details |
Text and rich text fields for specifying features and details. |
| Bottom Margin |
Range field to set the margin below the block. |
Collapsible Row
| Setting |
Description |
| Heading |
Rich text field for the collapsible row heading. |
| Description |
Rich text field for the collapsible row description. |
| Open by Default |
Checkbox to open the row by default. |
| Bottom Margin |
Range field to set the margin below the block. |
Icon Description
| Setting |
Description |
| Image |
Image picker for the icon. |
| Heading |
Rich text field for the heading. |
| Description |
Rich text field for the description. |
| Bottom Margin |
Range field to set the margin below the block. |
Product recommendations
If a customer redirects to a product page from your store, related products will be shown in the product recommendation. Based on the product currently being viewed, this section displays similar products, product with a similar description, or products that are frequently bought together with this product.
Note – The “ Product recommendations” section is only available on the default product and feature pages.
General Settings
| Setting |
Description |
| Heading |
Inline rich text field for the section heading. |
| Heading Size |
Select field for the heading size with options ranging from extra extra large to medium. |
| Description |
Inline rich text field for the section description |
| Text Size |
Select field for the text size with options for small, medium, and large. |
Grid Settings
| Setting |
Description |
| Number of Columns on Desktop |
Range field for the number of columns on desktop. |
| Number of Rows on Desktop |
Range field for the number of rows on desktop. |
| Number of Columns on Mobile |
Select field for the number of columns on mobile with options for 1 or 2 columns. |
Product Card Settings
| Setting |
Description |
| Media Size |
Select field for the media size with options for adapt, square, portrait, and landscape. |
| Show Rating |
Checkbox to toggle the display of product ratings. |
| Show Discount |
Checkbox to toggle the display of product discounts. |
| Show Vendor |
Checkbox to toggle the display of product vendors. |
| Show Compare |
Checkbox to toggle the display of compare buttons. |
| Thumbnails Layout |
Select field for thumbnails layout with options for none, media gallery, and variant gallery. |
| Button Layout |
Select field for button layout with options for none, enable add to cart, and show view details. |
| Number of Thumbnails |
Range field for the maximum number of thumbnails. |
| Show Available Only |
Checkbox to toggle the display of available products only. |
Layout Settings
| Setting |
Description |
| Section Text Alignment |
Text alignment selector for the section. |
| Color Scheme |
Color scheme selector for the section. |
Slideshow Settings
| Setting |
Description |
| Enable Slideshow |
Checkbox to enable the slideshow. |
| Show Navigation |
Checkbox to toggle the display of navigation arrows. |
| Show Pagination |
Checkbox to toggle the display of pagination controls. |
Spacing Settings
| Setting |
Description |
| Top Padding |
Adjust the space above the section content. |
| Bottom Padding |
Adjust the space below the section content. |