GeneratePress Customizing Color Navigation

If you are using the GeneratePress Theme and have uploaded the Add-OnsĀ plugin and activated all of theĀ options, the Colors option is the fourth section you’ll see when you click on the Customize link from a page or post.

The Navigation sub-option is the third in the list of this section.

The ‘Navigation’ section lets you adjust the color for the Background, Text, Background Hover, Text Hover, Background Current and Text Current within the navigation content of the website.

Background

This setting will set the background color of the navigation or main menu of your website.

Click on the Select Color button to the right of the color box and paste a Hex Code in the box, click on the color spectrum box and dial, or choose from the preset color boxes at the bottom.

The color box will change as you adjust the settings.

Once the color is what you would like, click anywhere else on the customize menu. The options box will disappear and the color box will update with your new color.

Text

This setting will set the text color of the navigation or main menu of your website.

Click on the Select Color button to the right of the color box and paste a Hex Code in the box, click on the color spectrum box and dial, or choose from the preset color boxes at the bottom.

The color box will change as you adjust the settings.

Once the color is what you would like, click anywhere else on the customize menu. The options box will disappear and the color box will update with your new color.

Background Hover

This setting will set the background color of the navigation or main menu option if someone moves their cursor over the option.

Click on the Select Color button to the right of the color box and paste a Hex Code in the box, click on the color spectrum box and dial, or choose from the preset color boxes at the bottom.

The color box will change as you adjust the settings.

Once the color is what you would like, click anywhere else on the customize menu. The options box will disappear and the color box will update with your new color.

Text Hover

This setting will set the text color of the navigation or main menu option if someone moves their cursor over the option.

Click on the Select Color button to the right of the color box and paste a Hex Code in the box, click on the color spectrum box and dial, or choose from the preset color boxes at the bottom.

The color box will change as you adjust the settings.

Once the color is what you would like, click anywhere else on the customize menu. The options box will disappear and the color box will update with your new color.

Background Current

This setting will set the background color of the navigation or main menu option if someone has clicked on it and is on the page corresponding with the menu option.

Click on the Select Color button to the right of the color box and paste a Hex Code in the box, click on the color spectrum box and dial, or choose from the preset color boxes at the bottom.

The color box will change as you adjust the settings.

Once the color is what you would like, click anywhere else on the customize menu. The options box will disappear and the color box will update with your new color.

Text Current

This setting will set the text color of the navigation or main menu option if someone has clicked on it and is on the page corresponding with the menu option.

Click on the Select Color button to the right of the color box and paste a Hex Code in the box, click on the color spectrum box and dial, or choose from the preset color boxes at the bottom.

The color box will change as you adjust the settings.

Once the color is what you would like, click anywhere else on the customize menu. The options box will disappear and the color box will update with your new color.

Save Changes

Once you are done making your changes, click on the Save & Publish button at the top of the Customizing sidebar.

If you change any of these options while you are in the Customize mode you will be able to see how the change affects the look of your website.

Congratulations! You just set the Colors Navigation options for your website using the Customizing feature in WordPress.