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

Configure Product Summary - Settings

264 views 0 December 14, 2021 Updated on December 16, 2021 Kate

1. Product Summary Settings

You can follow the GIF image below to know how to go to the Product Summary option (Product Page):

1.1. Product Image Layout

1.1.1. Product Page Layout

This option allows you to choose a layout for the Product Page. We have the Default layout, Width 1600px Layout and Fullwidth Layout. Please see my GIF image below to see the difference between those layouts.

1.1.2. Product Page Design

The Kalles theme has total 7 Product Page layouts. You can view my video below to check the layout of every single Product Page design and choose the layout that you wanna use for your store.

1.1.3. Product Main Image Size

The Kalles theme has total 3 layouts for the Product Main Image Size: Main Image – Small size, Medium size and Large size. You can view my video below to see the different layouts of the Product Page based on the Product Main Image Size.

1.1.4. Product Thumbnail Size

Same with the Product Main Image, the Thumbnail images also have total 3 size: Main Image – Small size, Medium size and Large size. You can view my video below to see the different layouts of the Product Page based on the Product Thumbnail Image Size.

1.1.5. Enable Sticky Product checkbox

Please tick on the “Use Sticky product?” to enable the Sticky layout for the Product Page. You can see the Sticky layout in the image below:

1.2. Design Main Image

This option allows you to configure the layout of the Product Main images on the Product Page.

  • Aspect Ratio Main: You can choose the Image ratio in some options below. Change the image ratio to see the image layout change.

Example: Product Main Image ratio 1:1

  • Main Image Size: This option allows you to choose to adjust the image size following the Image ratio. Image size Auto: The ratio will keep the height of the image and the Image size Full: the ratio will cut some parts of the image.

  • Main Image Position: This option allows you to configure the position of the product main image on the Product Page. The Kalles theme has 10 positions for you to choose, you can see in the image below:

1.2. Design Thumbnail Images

This option allows you to configure the layout of the Product Thumbnail images on the Product Page.

  • Aspect Ratio Thumbnail Images: You can choose the ratio for Thumbnail Images in some options below. Change the image ratio to see the image layout change.

Example: Image ratio 1:1

  • Thumbnail Images Size: This option allows you to choose adjust the thumbnail images size following the Image ratio. Image size Auto: The ratio will keep the height of the image and the Image size Full: the ratio will cut some parts of the image.

  • Thumbnail Images Position: This option allows you to configure the position of the product thumbnail images on the Product page. The Kalles theme has 10 positions for you to choose, you can see in the image below:

1.3. Product Sidebar

This option allows you to enable and configure the Sidebar for the Product Page:

  • Product Sidebar: You can choose None to disable Product Sidebar and choose Left Sidebar/ Right Sidebar to enable Sidebar on Product Page.
  • Sidebar Size: You can choose different sizes for the Product Sidebar here.

Example: Product Page with Left Sidebar – Sidebar Small Size:

1.4. Breadcrumb Option

  • Show Breadcrumb? checkbox:

  • Show back/next product links checkbox: Tick on this checkbox to enable the back/next buttons to go to another product.

1.5. Collapsible Tab

Please tick on the checkbox below to enable Collapsible

You guys can read more this link to know how to configure theCollapsible

2. Product Page Settings

You can click here to go to the Settings option of the Product Page:

  • Choose a placeholder for the product that has no image: This option allows you to choose an image for the product that does not have the images yet. It only works with the Product that does not have the images.

    • Zoom type: Our theme has a total of 3 Zoom types for the Zoom feature: Inner zoom 1, Inner zoom 2 and External zoom. You can view the layout of 3 Zoom types in the image below:

  • Main image click action: This option allows you to choose an action when you click on the Product Main image. Our theme has 3 actions for you to choose:
  • Position Frequently Bought Together: Our theme has 2 positions for you guys to choose to show the Frequently Bought Together option on the Product Page: Outside Description and Inside Description.

Example: Frequently Bought Together option Outside the Description:

Example: Frequently Bought Together option Inside the Description:

  • : With products that have variants, if you tick on this checkbox, the first image (that you added in Dashboard > Products) will show until customers pick a variant of the product, then the image of that variant will show replace for the first image.
  • Enable video looping?: tick on this checkbox to enable the  on the Product page.

  • Use New/ Sale Label checkbox: Tick on this checkbox to enable the New/ Sale label on the Product.
  • Pick product variant: You can choose the action for the Product variant here. We have No pick, Pick first variant and Pick first available variant.
  • Show incoming message
  • tick on this checkbox to enable  on the Product page.
  • Use a back-in-stock notification form? checkbox: You can tick on this checkbox to enable the back-in-stock notification form on the Product page.

Was this helpful?

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