Product Page Section

Modified on Mon, 28 Feb 2022 at 04:28 PM


Modify Product Page Section

I. General Settings

- Show Zoom image: when clicking on the image, it will show you the bigger version 

- Show Gallery sticky: the image will be sticky when scrolling up or down the product content


- Main image height: Choose an option to decide your favorite ratio for the image

- Main image manual height: you can set the height for the banner manually if you don't satisfy with the default height. (Eg: 350px,470px,600px - Mobile,Tablet,Desktop respectively)

Image cropped: tick to crop the image. It will be auto focused on the center element of the image

- Thumbnail position: choose a position to display the thumbnail (Available for Desktop)

- How many thumbnail images to be show: drag to define the amount of thumbnails 

Thumbnail image height: Choose an option to decide your favorite ratio for the  


- Bundle list metafield: click on the Insert dynamic source icon next to the title to choose a bundle product to attach to the product page

>>> In case you don't know how to create the bundle product field to add a bundle product list, let's check out this guidance on how to do it.

When you've already known how to create it, one more step you need to do is Add definition of this metafield

  • Go to the Settings in Shopify Admin 

  • At the menu list on the left column, scroll down and select the Metafields section > Choose Product 

  • Then go to the Metafieldswithout a definition area 
  • Choose the metafields (bundle product) you created to click on the Add definition button 

  • You'll see a list of its settings, at the Sample metafield for ... will display all the products including on this bundle
  • At Name field: you can give it a name to easily identify it later

  • Select Content Type: choose a type for this bundle product Eg: Text

  • Clicking on SAVE button at the very right corner of the screen and SAVE Definition after that 
After done all this steps, back to your theme editor to insert the dynamic source to the product. Bundle product helps you to display several products in a bundle and customers can buy all of this at once by clicking on the Add to cart button under its section


- Boxed layout: to has a padding around the main wrapper

- Breadcrumb layout: Box or Wide


- Spacing: add values in pixel to adjust spacing between items (Eg: 20px, 40px - Mobile, Desktop respectively)

Tick to show these icons

  • Share on Facebook
  • Share on Twitter
  • Share on Pinterest

II. Block Settings

1. Text

- Text: Insert the content into the box to display on the product page 

- Liquid content: or you can use liquid format to display this text instead of normal text (Learn about Liquid)

2. Promotion

3. Vendor + Social Share

Tick to Show the social share (If you don't tick to show but the social shares still show on the product page, then you have to delete or hide the Social share block)

4. Buy button

  • Show Dynamic Checkout button (Let customers check out directly using a familiar payment method)

  • Show variant stock (If variant's inventory is lower than 10, a message will be shown)

  • Show Preorder button (Allow customer preorder when variant has been sold out)

5. Countdown

- Date countdown: insert with the format (DD/MM/YYYY HH:MM)

- Tick to show Show Date label

Was this article helpful?

That’s Great!

Thank you for your feedback

Sorry! We couldn't be helpful

Thank you for your feedback

Let us know how can we improve this article!

Select atleast one of the reasons

Feedback sent

We appreciate your effort and will try to fix the article