Color Swatch Setting

Color Swatch Setting

This feature allows you to display color swatches (visual representations of colors) for products with color options, instead of just displaying the color names as text.
product-with-color-options
Configuring Color Swatches:
  1. Go to Theme Settings > Color Swatches.
  2. For each color option you want to display as a swatch:
    1. In the Label field, enter the exact name of the color option as it appears in your product variants (e.g., "Color," "Colour").
    2. In the Swatches field, enter the corresponding color code (e.g., #FF0000 for red).
Note:
  1. Label: The "Label" must match the option name in your product's variant.
  2. Swatches: The "Swatches" are the different values for that color option in your product's variant (e.g., "Red", "Blue", "Green").
    • Related Articles

    • Menu Setting

      Optimize your store’s navigation with Tapita’s advanced menu options, including a customizable multi-column dropdown (mega menu). This guide provides step-by-step instructions for creating and configuring menus to enhance the user experience. ...
    • Header Setting

      The header is a crucial element of your online store, serving as the primary navigation point and brand identifier. This guide will walk you through the various settings available to customize your header and create a seamless shopping experience. ...
    • Azzel Theme Setting

      On the customization page, click on the second icon to access the theme settings. Now, let’s explore each component in the theme settings one by one! Color With the Colors setting, you can create and customize unique color palettes for different ...
    • Video with Text

      This section allows users to display information, products, or collections alongside a video. First, configure the video as follows: Section Body: Video Ratio: Select the video ratio. Choose a video to display. Video Information: Color Scheme: Choose ...
    • Marquee Text

      This section allows you to display featured titles in a sliding format, highlighting key information or promotions on your page. General Settings: Select font display size: Choose the desired font size for the featured titles. Select number of ...