Product Page

1154 views September 11, 2019 hyun-dung 0

Go to Theme Settings >> Select Product Page section.

*** Single Product Sidebar:

      • Result:

+ Full Width:

+ Sidebar:

How to config the sidebar on product page? Please go here

*** Sidebar size:

      • + Small: Tick on option to show sidebar small.
      • + Medium: Tick on option to show sidebar medium.
      • + Large: If you want show sidebar larger then tick on option.

*** Product page design:

      • + Product Detail Layout 1:
      • + Product Detail Layout 2:
      • + Product Detail Layout 3:
      • + Product Detail Layout 4:
      • + Product Detail Layout 5:
      • + Product with thumb at bottom:
      • + Product with thumb on right:
      • + Product with thumb outside:

*** Product description design:

      • + Product Tab Description:
      • + Product Tab Accordions:

*** Main image click action & ‘Zoom Image’ icon:

      • + Zoom:

      • + Photoswipe popup: You need click on the image, system will show image larger.
      • + None: When click on the image, system not show anything.


When you choose one of Pages, It show a link with name: Delivery & Return.

When you click to this link, it redirect to Page

When you click to Delivery and return


*** Add to Cart Style:

      • Result:
      • + 2D:
      • + 3D:

*** Upload Image Size Chart:

*** Product Trust Seal:

      • + Show ‘Trust seal’ img?: Tick on option to show trust seal image.
      • + Trust seal image: Select image from libraries.

*** Product Real Time Visitor:

      • + Show fake real time Visitor:
      • + Max fake real time Visitor:
      • + Interval time: Time to change “Max fake real time Visitor” onceExample: After 4 section, Real time visitor change once and it changing random from 1 to Max fake real time visitor
      • + Text Real time: Enter text for real time.
      • + Text Visitor: Enter text for visitor.

*** Total show flash


*** Promo shipping

*** Shipping tab

Delivery Start Date: enter a number of date in the month

Delivery End Date: enter a number of days you spend for shipping, eg: within 15 days

If you want to change the date format follow your language, please do these steps:

*** Share Buttons:

        • + Show share buttons: Tick on option to show share button on product page.
        • + Share buttons type: You can review on the ‘Social’ section.

*** Product Features:

        • This is some function for product and you can disable it.

*** Product Swatch:

        • + Variants with circle – Layout swatch color:
        • + Variants with circle – Layout swatch image variant:
        • + Variant with rectangle:
        • + Variant simple:
        • + Variant simple with color:
        • + Swatch size for Design variants with circle: Choose size for circle.

*** Countdown timer:

        • + Show Countdown timer: Show timer for products that have scheduled date for the sale price.

*** Related Products:


        •  Show related products: Tick on option to show related products.
        •  Heading: Enter heading for related products.
        •  Sub Heading: Enter sub heading for related products.
        •  Style title: There 2 styles.

+ Style 1:

        •  Related Products: Choose the products to show on related products section. There 4 the way.

+ Remember that all the products must be in the same collection to can be related to each other.

1. By Collection: When you choose Collection type, you‘ll see all products of the collection which the main product into that collection

+ In collection

+ In Related Product

2. By Handle:

+ With handle, you can choose exactly which product you want to show as related product by adding handle name of mainproduct to related product.

+ You can see what is handle in here: Understand about the Handle.

+ Remember, the products must be into the same collection.

+ Let see with Gecko, I have product 1 with handle “hoodie-over-men” and I will adding this handle to tag list of product 2.


3. By Tag

I have 2 products

Product 1:

Product 2:

As you can see they have same tags: Clothing, Color Black, Color Blue, XS, XL….

So product 2 will be a related product from product 1.

4. By ID

It’s the same By Handle

+ Let see with Gecko, I have product 1 with ID “2322964283469” and I will enter it with tag to related product 2.

+ Get the ID product 1.

+ Paste it in the tag of product 2.


Note: You can go to this artical of knowledge base of Gecko to know more about Related Product:
How to use Related Product

***Show breadcrumb, Vendor, Availibity,…

Show Add to cart Full width + Additional checkout button. When click this button, customer go to checkout page promptly



*** Recently Viewed Products:

      • + Show recently viewed products: Tick on option to show recently viewed products.
      • + Heading: Enter heading for recently viewed products.
      • + Number of Products to display: Enter number of product to show per page.
      • + Products hover: Select style when hover over products.
      • + Use Sale countdown: Tick on option to show countdown.

Was this helpful?