Only two colors power the overall look and feel of your Event Engagement site page: a Primary and Secondary color.
What do these colors control?
Let's look at two Home page examples to illustrate the impact changing these two colors has on the page.
Up first, an example of the default Primary (orange) and Secondary (dark gray) colors:
Now, here's an example of custom Primary (pink) and Secondary (light gray) colors:
As you can see, these colors impact the entire aesthetic of the page; the best part is they can be updated with just a few clicks.
NOTE: The Secondary Color also controls your site's footer background.
Watch the video
- Click the gear icon > themes.
TIP: Right click and open this page in a new tab so you can quickly switch back to your Home page to check your work.
- You're now on the Theme Editor tab in the Site Admin interface. Click the Edit button associated to your Event Engagement theme.
- While dozens of options are available, the only two you need to update are on the Color Picker > Main Colors tab, which you'll be on by default.
- Click the menu for Primary Color and choose your organization's main brand color. You can choose a standard web color or click the Custom Color button at the top to input a hex color code, RGB, or HSB value. When finished, click OK to close the color menu.
- Repeat this process for Secondary Color.
NOTE: Depending on your chosen colors, you may also need to adjust the Text on Primary and Text on Secondary options to ensure text is readable across your site. For example, if your Primary Color is red, white text will not be readable.
- Scroll to the bottom of the page and click Save to apply your changes.
TIP: Switch back to your Home page browser tab and refresh the page to see how your colors look. Switching between these two tabs makes it easy to make and verify adjustments. Be sure to verify text is readable with your new colors; if not, adjust the Text on Primary and Text on Secondary options. You can also adjust the other options, such as your link colors and site footer background color, if desired.