Why My Body Hyperlink Colors Are Not Changing?

One of the most frustrating problems for new Headway Themes users is after you have made all the changes and set the desired hyperlink colors but nothing happened; it still remained the same! You might think that changing the hyperlinks colors should be trivial but ended up hours of doing it. How agonizing!

The most common mistake is users could be changing on the wrong element (selector), or instances as Headway Themes offers the option to change hyperlink color not for only for the content block but post title, widget and comment block separately. On top of that, each instance of the content block and widget can be changed individually. Similarly, this applies for different layouts so adding more confusion to new users.

The current Headway Themes version 3.4.11 only allow changing the body hyperlink color for unvisited link (aka normal link) but not hover and clicked link (aka active link). There is no visited link in Headway Themes, if you need visited hyperlink then you have to use the CSS code to do it. In addition, Headway Themes has no shortcut to change all the hyperlink colors globally which means you have to change the 3 stages of hyperlinks for content block body hyperlinks, content block title and widget individually.

Despite the limitation, it is still quite easy to change the hyperlink colors if you do it right.

Change Body Hyperlinks Colors in Content Block

1. Go to Visual Editor > Design mode.
2. Click on the down arrow at the bottom right screen to bring out the Option Panel.
3. Under “Editor > Blocks”, click on “Content > Body Hyperlinks” & click on “Fonts”.
4. Before changing the fonts, make sure the second box is at “—States— “ so that the color you are changing will apply to all non-visited body hyperlinks.

5. Move your mouse back to “Fonts”.
6. Click on “Customize” and select a color you want.
7. Once the color is selected, do a save by clicking on the top right hand corner green “Save” button.
8. If you want another color when you hover over body hyperlinks, change the “—States— “ to “Hover”.
9. Then repeat step 5-6 to change the color.
10. Similarly, if you want a different color when you click on the hyperlink, change the state to “Clicked”  and repeat step 5-6 to change the color.
11. Once it is done, do a save.

Revert the Hyperlink Color to Default

If for any reason, you want to revert the hyperlink color after you changed the color. You can go to back to the Font Color and click on the little [ x ] besides the “Color” to revert to default color.

Change Widget Colors

For widget block, not only its hyperlink has the same three stages as body hyperlink but it has additional stage – selected stage. However, the selected stage only works for Pages & Menu widgets as it is meant to tell visitors which specific page they are located at.

1. Click on the down arrow at the bottom right screen to bring out the Option Panel.
2. You will see that “Widget Area > Widget Links” is highlighted, if not click on the Option Panel and manually click to achieve the path as follow:

 “Editors > Blocks > Widget Area > Widget Links”

3. To change the colors for the widget hyperlink, make sure the second box is at “—States— “ and repeat the above steps 5-6 as mentioned.
4. You can also change the color for “Hover” and “Clicked” state.
5. Once it is done, do a save.

Change Title Colors
Last, to change the hyperlink colors for Title, simply follow the same steps as above but make sure you are selecting the right selector when you are changing. It should be “Editors > Blocks > Content > Title”.

 If, however, after you have changed the color and you do not see the new color applies, quit the Visual editor and re-enter the Visual editor from your WordPress dashboard, sometimes it could be due to caching problem.