Globo Docs
GLO Color Swatch
GLO Color Swatch
  • Getting started
  • Product variants swatch
    • Variant swatch style
    • Display on product page
      • Show only images related to the selected variant
      • Required select swatch options before add to cart
      • Inventory variations on product page
  • Display on collection page, home page, other pages
    • Show add to cart button on slider, grid, list products
    • Clean up variant option in collection page
    • Display real-time product data as variations change
  • Choose type variant swatch
    • Set color for variant option value
    • Upload custom image for variant option value
    • Setup automate image variant product
  • Advanced setting variants swatch
    • Show/hide variant name
    • Show/hide tooltip
    • Out of stock style
  • Image swatch ratio
  • Bulk export & import variant options
  • Group products as variants
    • Group product style
  • Bundles
    • Setting up product bundles
    • Setting up quantity breaks
  • App integrations
    • PageFly Landing Page Builder
    • Gempage
    • Smart Product Filter & Search
  • FAQs
    • Why can’t I see the swatches for my new product?
    • My theme doesn’t support app blocks — how can I show or move the swatches?
    • Why does the app work on collection pages but not on the homepage or other pages?
    • Why don’t the images change when I pick a different swatch?
    • Why doesn’t the main product image update when I click a color swatch?
    • Why is the wrong product variant added to the cart?
    • Why do swatches disappear when I switch to another language?
Powered by GitBook
On this page
  • Here are some functions you can clean up your collection page.
  • Turn off some variation options on collection page
  • Show carousel for variant option in collection page
  • Limit the maximum number of options displayed on a product in the collection page
  1. Display on collection page, home page, other pages

Clean up variant option in collection page

If you have a product has too many variant options, if you show all of them on the collection, the overall layout will not be clearn. We provide a solution to limit the maximum number

PreviousShow add to cart button on slider, grid, list productsNextDisplay real-time product data as variations change

Last updated 1 month ago

Here are some functions you can clean up your collection page.


Turn off some variation options on collection page

It's easy to manage which variants are enabled on the collection page, which variants are not visible with this configuration.

  • Suppose you have too many options but only want to display color/image options on the collection

  • In admin app GLOBO Color Swatch, Naginate to page Options list

  • Disable the options you don't want to display on the collection page.

E.g: We have variant size and color


Show carousel for variant option in collection page

If you have a variation with too many options, use carousel mode when collecting, it will shorten your list of options to just one row.

1

Naginate to page "appearance"

In admin app GLOBO Color Swatch naviagtion, click to Appearance

2

Click to "set up" button

On Appearance page, you can choose any style swatch and click to setup button this setting apply for all option on collection page.

Except dropdown style, because dropdown style does not need to use carousel

3

Click tab "on collection page"

4

Enable "carousel" and save

E.g: Carousel on collection page


Limit the maximum number of options displayed on a product in the collection page

If you have a variation with too many options, in addition to using carousel you can use limit number options show.

  1. In admin app GLOBO Color Swatch naviagtion, click to Setting page

  2. Enable setting limit swatch on collection.

  3. Enter the maximum number of options that can be displayed on the desktop.

  4. Enter the maximum number of options that can be displayed on the mobile.

  5. Click to Save

E.g: Limit maximun number swatch

Turn off some variation options on collection page
Before turn off variant size
After turn off variant size
Click to set up button
Click tab "On collection page"
Enable "Carousel" and save
Before enable carousel on collection page
After enable carousel on collection page
Setting limit
Demo limit maximun number swatch