Need help? Check out our Support site, then

Hyperlink Color?

  1. annehelenpetersen

    I would like to change the color of the hyperlinks -- it's currently gray; I'd like it to be red.

    Instructions on how to do so using CSS? Thanks!

    The blog I need help with is

  2. marianojmiguel

    Check your styles.css file on line 1753. You should find something like this:

    <br /> a {<br /> color: #bbb;<br /> }<br /> a:hover {<br /> color: #ededed;<br /> }<br />

    #bbb is the color for your links, while #ededed is the color of your links when the mouse is over them. So the only thing you have to do is replace those colors with the ones you like. Try this one:

    <br /> a {<br /> color: #DA3B3B;<br /> }<br /> a:hover {<br /> color: #991717;<br /> }<br />

    Guess that's it :)

  3. @annehelenpetersen, here on, you can add CSS to the Appearance → Custom Design → CSS page in your blog dashboard. You can preview changes any time, but in order to apply them, you need to purchase the Custom Design upgrade:

    @marianojmiguel, CSS on is concatenated, so the line numbers aren't easy to go by. Code examples like you've posted above are COMPLETELY AWESOME though. :)

  4. marianojmiguel

    @designsimply Thank you :)

  5. annehelenpetersen

    I apologize ahead of time for the obviousness of this question.

    When I go to Custom CSS (which I have paid for/enabled), all I see is:

    Welcome to Custom CSS!

    CSS (Cascading Style Sheets) is a kind of code that tells the browser how
    to render a web page. You may delete these comments and get started with
    your customizations.

    By default, your stylesheet will be loaded after the theme stylesheets,
    which means that your rules can take precedence and override the theme CSS
    rules. Just write here what you want to change, you don't need to copy all
    your theme's stylesheet content.

    If you need any further help, ask in the CSS Customization forum.

    When I've worked with CSS in the past, it's been visible to me -- I can find exactly what you suggest and change it. But I can't seem to *see* the actual CSS -- help?

  6. marianojmiguel

    My mistake. I thought you could go through the style.css file and just edit what you wanted. works quite differently, as the code you write on the CSS editor overwrites the original theme's CSS. For further information, check

    Now, to solve your issue, simply remove the message and paste this:

    <br /> a {<br /> color: #DA3B3B;<br /> }<br /> a:hover {<br /> color: #991717;<br /> }<br />

    Your links should now be red :)

  7. annehelenpetersen

    So helpful!

    But now my "Links" are red -- the Blogroll on the side of the page, for example -- but the actual hyperlinks embedded within individual posts are not. Is there a separate fix?

    Thank you so much!

  8. marianojmiguel

    Oops, sorry for that one. This should do the trick:

    <br /> #primary a,<br /> #primary a span {<br /> color: #DA3B3B;<br /> }</p> <p>#primary a:hover,<br /> #primary a:hover span {<br /> color: #991717;<br /> }<br />

  9. annehelenpetersen

    One last question: the actual links within posts are still not red (for example, on our "Alumni" page, I've hyperlinked all of the names of alumni -- they're still white). Thoughts?

  10. marianojmiguel

    Forgot about a little detail. Try with this :)

    <br /> #primary a,<br /> #primary a span {<br /> color: #DA3B3B !important;<br /> }<br /> #primary a:hover,<br /> #primary a:hover span {<br /> color: #991717 !important;<br /> }<br />

  11. annehelenpetersen

    Perfect -- thanks again!

Topic Closed

This topic has been closed to new replies.

About this Topic