Open Store Free
  • Buy Themes
  • Documentation
    • Kalles Shopify Theme
    • Kalles WordPress Theme
    • Gecko Shopify Theme
    • Elessi Shopify Theme
  • License FAQs
  • Open Ticket
  • Buy Themes
  • Documentation
    • Kalles Shopify Theme
    • Kalles WordPress Theme
    • Gecko Shopify Theme
    • Elessi Shopify Theme
  • License FAQs
  • Open Ticket

Kalles Shopify Theme

home/Documentation/Kalles Shopify Theme
Popular Search:Import demo, Update theme, Custom color
  • 1. GREETING
  • 2. CHANGELOGS
  • 3. INSTALLATION
    • How to get Instagram Access Token
    • How to update the theme?
    • Import Demo
    • Recommend Shopify App
    • Some Basic Before Using Theme
    • Upload Theme
  • 4. RECOMMEND APPS
    • Facebook Messenger - Live Chat
    • Flash Search
    • Growave
    • LayoutHub
    • Loox
    • ReCharge
    • Ryviu
    • Slider Revolution 6
  • 5. UPDATE THEME
    • How to update the theme between versions 3.x.x
    • What is new in version 3.0
  • 6. PRODUCT PAGE
    • Advance Product Type
    • Back in stock notification (Notify me form)
    • Brand Image (Vendor Image)
    • Configure Metafield on Kalles 3.x - supported OS 2.0
    • Configure Product 3D, AR models
    • Configure Size Guides for Products on Kalles ver 3.x.x
    • Configure Submenu Labels and Custom Product Labels
    • Configure the notice: "Will not ship until..." for Pre-order product
    • Configure variant images for product in Shopify dashboard
    • Configure variant on the Product page
    • Frequently Bought Together
    • Product Description sidebar with Collapsible tabs
    • Product Summary option
      • Configure Product Summary - Blocks Content
      • Configure Product Summary - Settings
    • Use the Custom HTML with Metafields in the Description Product tab
  • 7. COLLECTION PAGE
    • Filter by Product Options
    • Filter by Tags
  • 8. THEME SETTINGS
    • Cart & Search Widgets
    • Checkout
    • Collection Page
    • Custom CSS, JS
    • Favicon
    • General Settings
    • Group Variants Image
    • Header
    • Header Configuration
    • Language, Currency
    • Layout
    • Logo Header
    • Other settings
    • Product Item Settings
    • Product Page Settings
    • Recommendation Pop-up Add to Cart
    • Social Media
    • Style and color
    • Typography
  • 9. THEME SECTIONS
    • About us
    • Banner
    • Banner Custom
    • Banner Custom 2
    • Collection Banner
    • Collection Grid
    • Collection List
    • Collection list
    • Collection List Manual
    • Collection List Packery
    • Collection Slider
    • Custom HTML
    • Custom Liquid
    • Custom Section
    • Custom Section 2
    • Daily Deal Of The Day
    • Gallery
    • Image with text
    • Image With Text Overlay
    • Packery Collection
    • Packery Collection Manually
    • Promo Text
    • Rich text
    • Search Section
    • Shipping Text Simple
    • Store Information
    • Tab Collection
    • Tab Collection Slider
    • Testimonials
    • Text Columns with Images
  • 10. SECTIONS
    • Age verification popup
    • Blog Manual
    • Blog Posts
    • Brand List
    • Configure Product Quickview
    • Cookie Law Info
    • Exit Product Popup
    • Footer bottom
    • Footer top
    • Mobile menu & Mobile Categories
    • Newsletter popup
    • Sales popup
    • Shopping Cart Widget
    • Sticky Toolbar Mobile
    • Text Columns with Images 2
  • 11. BLOG
    • Default Blog
    • Filter by Tag for Blog
    • Portfolio Configuration
  • 12. THEME FAQs
    • Change currency format on Checkout Page
    • Countdown timer & Design images option for all sections
    • Custom HTML code for Size Guide page
    • How to change title "Product" to other words on "Collections/All" page?
    • How to configure custom colors swatch for your store?
    • How to enable/ disable Terms & Condition checkbox on Cart sidebar/ Cart Page?
    • How to enable/disable "Shipping calculated at checkout"?
    • Trick, Helpful Custom CSS
  • 13. MAIN NAVIGATION
    • Configure Megamenu on Kalles 3.x (New Type block)
  • 14. VARIANT CONFIGURATION
    • Configure different ID for Product Variants
    • Configure product Grouped
    • Configure Variant on loop & Collection page
  • 15. PAGES
    • About us

Product Page Settings

494 views 1 January 14, 2022 Updated on January 24, 2022 Iris

From Theme Customize > Navigate to Theme Settings > Product Page.

1. Main image click action

You can choose among 3 styles, including Zoom, PhotoSwipe popup, None.

  • If you choose zoom type, you are allowed to choose three types: inner, external, inner #2.
  • If you choose PhotoSwipe, you are allowed to choose two type: Dark and Light.
  • Besides, you can enable/disable Show image icon (Click to open image in popup and swipe to zoom), and Zoom popup on mobile.

Please go here to get more information about Zoom action.

2. Product features

2.1. Product variants

 If you want to use this option, please make sure that you set variants for your products. From Shopify admin > Products > Search product that you want to add variants > Variants > Add size, color, etc. for the product.

  • Pick first variants: When your customers go to product page, the main product image will be shown as the first variants that you set.
  • Pick available variants: When your customers go to product page, the main product image will be shown automatically except sold out variants.
  • No pick: When your customers go to product page, they will have to choose variant themselves. The main product image will be the first pic that you added.

  • Show first image: Show first image until customers hand-pick a variant.
  • Use group variant image? This is an awesome feature that allows you to show a correct image for a variant. Go here to know how to see Group Variant Image
  • Use adapt to first swatch image variant? By default we show the variant image with square and fixed size, when this option is turned on, it will show the variant image the same size as the actual image. (this ratio is taken from the first product image).
  • Enter variant name you want has style color: As you can see, with the Color variant, it will display as a thumbnail. But in some countries there are different ways of writing colors, such as Color, Colors, Couleus … So you need to enter the name of the variant that you want to display as a thumbnail here. If you don’t add name, thumbnail images will show incorrectly. for example: 

Copy and paste variant option here:

 

  • Use Select variants by change image on slide (Only active on layout has slider in product page): Normally, variants are selected from a swatch. You might want your customers to be able to select a product variant by change a variant image.

2.2. Frequently Bought Together

  • Position Frequently Bought Together: You can choose outside or inside description. Read this document to get more information about Frequently bought together.

2.3. Sticky add to cart

This option allows you to enable/disable Sticky Add To Cart.

2.4. Show video loop

If you want to show video loop, you must set it on Product Page first. From Shopify admin > Products > Search a product that you want to add video > Add Media. Then, click on Show video loop to enable/disable video for product.

This option allows you to display IDs on URLs every time you switch between variants

  • Removing the variants that are sold out.

2.7. Use a back in stock notification form

When a customer submits the back in stock notification form for a sold out product, you will receive an email to the email address you have set up in the admin to be your Customer email. With a back in stock notification form, customers can let you know if they want to be informed when a sold out product becomes available again. When a customer uses the form to submit their email address, you will be sent information about the product that they are interested in. When more stock becomes available, you can let the customer know. Let watch this video to know more.

3. Product social sharing options

  • Share source: You can choose among three types, including Default, AddThis, Growave social sharing. Default: Use theme theme form, you can set on Theme settings > Other settings. Growave: Use app form. Growave is one of Kalles partners, click here to get discount now.

  • Countdown: If you want to use countdown for product page, please go here to get more information.

Was this helpful?

1 Yes  No
Copyright 2021 the4.co. All Rights Reserved.
Popular Search:Import demo, Update theme, Custom color