Working with EverWeb’s Document Colors

One of the best features when using EverWeb 4.0, or higher, is the ability to use, and apply, Paragraph Styles to the text of the pages of your site. This feature was introduced alongside a redesigned and expanded Default Styles… window that’s accessible from the Format menu. Along with the ability to set up your own Paragraph Styles, you can now also define the colors that you want to use in your website using the new Document Colors feature!

Colors, Color Swatches and the Color Wheel
When you want to change a color of an object or text in EverWeb, you will usually click on a color swatch or the color wheel in EverWeb’s Inspector Window or in a widget’s Widget Settings. Typically, you’ll use the color swatch to access 30 predefined colors, as well as accessing 10 of your most recently selected colors.

If you use the color wheel, you can choose the color you want in a variety of different ways. Choose between the Color Wheel, Color Sliders, Color Palettes, Image Palettes and Pencils tabs. These tabs help you precisely define the color you want, for example, by using a colours Hex Code, or by using the pipette to ‘sample’ a color that you want to use.

Redefining the Color Swatch’s Colors
If you’re using EverWeb 4.0, or higher, you’re now able to redefine the 30 default colors of the Color Swatch panel. To change these swatches to suit your website’s own color palette, you can either click on the ellipses (…) in the op right hand corner of the Color Swatch dialog box, or go to the Format-> Default Styles menu option. In the top right hand corner of the screen you will see a list of colors presented vertically in the Document Colors column. These colors correspond to those you see when you click on a color swatch. The vertical list corresponds to the swatches running left to right, row by row from top to bottom.

You can easily change the color of the color swatches as you want. Just double click on the color that you’re wanting to change. This will present you with the Color Picker. Select the new color that you want using the Color Picker. Once done, select the next color in the Document Colors list that you want to change, and repeat the process. Once you have finished changing all of the colors that you want, click on Save.

The Effect of Changing Document Colors
The important thing to note when changing Document Colors, is that your changes will affect any object that uses the color swatch you have changed in your website. So, Document Colors work in the same way as Paragraph Styles do. The advantage here is that if you decide to update your website’s color scheme, if you’ve been using color swatches, you can make global changes all at one time!

Good To Know…
When working with Document Colors, be careful as there is no ‘return to default color palette’ available. Once you update and save your color changes there’s no way back. If you do want to reset your Document Colors back to the original default, the best thing to do is to create a new blank website project file and copy the Hex Codes from its Document Colors over to your own site. Hopefully this is something you’re not likely to need to do.

About Document Colors, Blog Posts and the Styled Text Editor
Whilst the Document Colors settings apply to using colors on your site’s pages, note that you cannot change the default colors for either the Styled Text Editor or the colors swatch panel of the Blog Post Editor. Hopefully this will come at a later date!

EverWeb’s Document Colors is a great addition to the product allowing you to easily define the color palette that you want to use in your website, as well as providing an easy way to globally update your site’s color scheme if you want to at a later time!