Link colours

  • Hi
    Im trying to change the link colors so they are seen as links (so not black text) mostly in the right sidebar but also throughout the site. but dont seem to be able to find the right code, Ive tried using Customising Colours but nothing changes.
    then I tried

    a:link {color:#0000ff;} /* unvisited link */
a:visited {color:#ff4040;} /* visited link */
a:hover {color:#8b2323;} /* mouse over link *

    in Customising Additional CSS but nogo ??
    any ideas?
    thanks

    • This topic was modified 4 years, 8 months ago by andrewgj.

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)

  • Hi andrewgj,

    To change the link colors in the sidebar widges use
    #secondary .widget a:link {{color:#0000ff;} /* unvisited link */
    #secondary .widget a:visited {color:#ff4040;} /* visited link */
    #secondary .widget a:hover {color:#8b2323;} /* mouse over link */

    If you want to address the titles of your posts as well extend this to

    .entry-hearder .entry-title a:link
    , #secondary .widget a:link {{color:#0000ff;} /* unvisited link */
    .entry-hearder .entry-title a:visited
    , #secondary .widget a:visited {color:#ff4040;} /* visited link */
    .entry-hearder .entry-title a:hover
    , #secondary .widget a:hover {color:#8b2323;} /* mouse over link */

    So basically you need the more specific targets defined so that the general a is not overwritten by more specific code in the themes CSS.

    Good luck

    Lille Ulven

    Thread Starter andrewgj

    (@andrewgj)

    cheers @lilleulven
    but it doesn’t seem to change anything and getting an error Expected RBRACE at line… in the Additional CSS and the style.css

    The expected RBRACE error is due to a typo in the first line of each example. Change the double {{ to a single { and it should work ??

    #secondary .widget a:link {color:#0000ff;} /* unvisited link */
    #secondary .widget a:visited {color:#ff4040;} /* visited link */
    #secondary .widget a:hover {color:#8b2323;} /* mouse over link */

    or

    .entry-hearder .entry-title a:link
    , #secondary .widget a:link {color:#0000ff;} /* unvisited link */
    .entry-hearder .entry-title a:visited
    , #secondary .widget a:visited {color:#ff4040;} /* visited link */
    .entry-hearder .entry-title a:hover
    , #secondary .widget a:hover {color:#8b2323;} /* mouse over link */

    Thread Starter andrewgj

    (@andrewgj)

    yay that worked
    thanks @lilleulven for helping out an old newby ??

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Link colours’ is closed to new replies.