Global Color

Global Color is a free feature updated in Woostify 2.0. With Global Color, it takes you one click to add the same color for different pages and all the parts throughout the entire website. This is a useful tool for optimizing the website design because it helps not only save a lot of time but also ensure the unification of website color.

How to use Global Color in your WooCommerce store

In your WooCommerce dashboard, you go to Appearance > Customize.

Customize the Color section of the Customizer

Then, you will be taken to the Customizer interface. Here you will find numerous customization options. Please select the Color section to set global colors for your site:

After accessing this section, you will have 5 customization options as in the image below.

• Theme Color: here you will set the theme color of the website. Once you change the color in this section, the color of the menu items is also changed.
• Text color: simply select any color you want to set for your text. This will change the text color in all your WooCommerce posts and pages.
• Link / Accent Color: go to this section to choose the color you want to set for all the links of the whole website.
• Extra Color 1 & Extra Color 2: besides the three default colors mentioned above, you have the two additional options.

Customize the Buttons section of the customizer

You also can use the global color feature to customize all the buttons of the website. You come back to the Customize interface and select Buttons. Then, there are two options for you to customize

• Text Color: here you can set the color of the text inside the button.
• Background Color: here you can set the color of the button.

How to use Global Color with Elementor page builder

If you choose to build a page with Elementor, then you can easily set global colors. It’s because Woostify 2.0 integrates Global theme color with Global Elementor color.

When you choose to Edit with Elementor, you will be taken to Elementor editor. Here you will find Text Editor. Drag and drop this widget to customize the text of the page.

Go to the Style section and select Text Color, then you will find various options to set global color as shown in the image below.