FavePersonal Documentation

Colors

Personalize Colors

FavePersonal gives you the ability to easily control and customize the look of your site with new colors. To start playing with the colors navigate to the Colors settings in the WordPress Dashboard.

FavePersonal_Colors 1


Color Settings Page

Let’s take a look at the color settings page:

FavePersonal_Colors 2

  • My Colors: The top section shows your currently applied color setting.
  • Browse Colors: Below your current color setting you’ll find a variety of other color settings created by the Adobe Kuler community.

Here you can browse thousands of available color themes created by the Adobe Kuler community, arranged by Most Popular, Highest Rated, Newest, or Random.


Preview and Select Color Schemes

Choose a color scheme and Preview for a quick look at the site layout.

FavePersonal_Colors 3

Then Select to apply that color set to your current Color Settings at the top.

FavePersonal_Colors 4

From here simply Save Settings to apply the theme to your site or continue customizing your color palette.


Customize Colors

Click any color in your current color scheme to manually change it. You’ll notice the original theme colors down below the color palette.

FavePersonal_Colors 5

Notice in the above example that the center color applies to the large sidebar box, the Bio Widget, and we’ve changed the color from red to green. This same concept applies to all five color attributes. If you ever want to go back to one of the original palette colors (like the red) just click the swatch below.

If you like all the colors in your palette, but want to use them in different areas of your site, simple drag any color swatch to another location:

FavePersonal_Colors 6

Then you can Preview your layout to see how the move will affect your site’s style.


Save Your Changes

Once you’ve picked a palette, customized the colors to fit your style, and previewed the layout it’s time to click Save Settings.

Once you save, the colors are reflected immediately on your live site. This works so easily because FavePersonal will output the CSS styles at the top of every page. This allows you to continue to tweak your colors on-the-fly.

FavePersonal_Colors 7

And there you have it! A personal color scheme for your FavePersonal site…


Restoring the Default Colors

If you decide you’d like to get back to the default FavePersonal color palette, no problem. Use the search box and look for “favepersonal”, then follow the steps above to choose that palette and save.


Pro Tip: If you’re a developer and know your way around WordPress, you can move the styles into your own child theme stylesheet and remove the filter that inserts the styles at the top of every page.

See also: