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
  • Guide
  • 1. Setup style for variant option is color swatch
  • 2. Change display style to swatch
  • 3. Custom image
  • Demo
  1. Choose type variant swatch

Upload custom image for variant option value

PreviousSet color for variant option valueNextSetup automate image variant product

Last updated 1 month ago

Guide

1. Setup style for variant option is color swatch

  • Go to admin app GLOBO Color Swatch Dashboard -> Options list

  • Select your product variations to display as swatches

2. Change display style to swatch

  • Choose one of 4 style

Types variant support setup color hex:

✅ Swatch

✅ Pill swatch

✅ Custom swatch with price

✅ Swatch dropdown

  • Click save button

3. Custom image

  • After change style -> click config button

  • In config page, you can upload image or use link image as swatch

When you use a custom image, the image will be shown first, and the color code won't be displayed.

Demo

Swatch
Pill swatch
Custom swatch with price
Swatch dropdown