Styling links on a WordPress site is easy, right!? Just add custom CSS for the “a” link class. Not so fast!

Customizing the “a” link class changes all links on a site, including links in the site admin, header, navigation menus, and footer that you don’t want changed.

Fortunately the fix for sites using the Divi Theme is simple and straightforward.  Use the ID #content-area tag to exclude header and footer link styles.
Directions:
  1. Login to your Divi site and go to Divi/Theme Options.
  2. Place the custom CSS code into the “Custom CSS” window (bottom).
  3. Ta-da! You’ve successfully customized all the link styles on your site, including Sidebar Widgets.
Below are some CSS code samples you can use.
/*--------------------------------------------------------------
LINKS 1 - Basic
--------------------------------------------------------------*/
#content-area a { color: #000 !important; }
#content-area a:hover { color: blue !important; text-decoration: underline !important; }
/*--------------------------------------------------------------
LINKS 2 - With styling for “Visited” links.
--------------------------------------------------------------*/
#content-area a { color: #000 !important; }
#content-area a:hover { color: blue !important; text-decoration: underline !important; }
#content-area a:visited { color: #666 !important; }
Get 50% Off The
1-Hour Marketing Plan
Special Launch Offer

Register and Get 50% Off The 1-Hour Marketing Plan (for a limited time).

Share This