WordPress.org

Ready to get started?Download WordPress

Forums

How to Edit Link Colour Within Posts Only (17 posts)

  1. Just Football
    Member
    Posted 4 years ago #

    Hi all,

    I am trying to edit the link colour on my site so that it is underlined and the text is a different colour to the main body text.

    However when I change the css file it changes links for every part of the site, which is not what I would like to happen. I need it to be within post content only.

    Is there a way to do this and how?

    Thanks in advance

  2. Micah Cooksey

    Posted 4 years ago #

    Can you get the element that the post content is contained in, for instance <div class="entry-content"> and then put something in your stylesheet specific to those links? For instance, if the post content is contained in <div class="entry-content">, you would put: .entry-content a {}. Does that work for you?

  3. Just Football
    Member
    Posted 4 years ago #

    Sorry but I am not the most WordPress savvy of characters yet...I recently switched from Blogger - could you explain that in a little more depth? :-)

    Thanks.

  4. Micah Cooksey

    Posted 4 years ago #

    That's okay. Either looking at your single.php file or using the "view source" feature in your browser, find what the div is called that contains the post content. Then you can style the links as described above.

  5. Just Football
    Member
    Posted 4 years ago #

    Isn't the information required in the .css stylesheet?

    I can send you a link to the site if needs be to take a closer look, or if anything else you need let me know.

    Thankyou.

  6. Micah Cooksey

    Posted 4 years ago #

    Isn't the information required in the .css stylesheet?

    Yes. You get the name of the div from your source code, then style it in your css.

  7. Just Football
    Member
    Posted 4 years ago #

    Ok I had a look and I think its this:

    <div class ="post-wrapper post-page">

    Does that make sense? What next?

  8. Micah Cooksey

    Posted 4 years ago #

    Perfect. Now put this in your CSS:
    .post-wrapper a { color: #hexadecimal-color-code; }

  9. Just Football
    Member
    Posted 4 years ago #

    In the style.css file?

    Will that change the link colour? I take it you replace the 'hexadecimal-color-code' bit with the colour you want your link to show as?

  10. Micah Cooksey

    Posted 4 years ago #

    Yes to all three. It will change the link unless something overrides it. If you don't see your changes, try adding !important after the color and before the semicolon, like this: .post-wrapper a { color: #hexadecimal-color-code !important; } That will ensure it overrides any other link color styles that may be an issue.

    Just a note as well, a is for just plain links, a:hover is for when you hover over the link with your mouse, a:active is when you click on it, and a:visited is for links that are visited.

  11. Just Football
    Member
    Posted 4 years ago #

    Great thanks for all your help! I will let you know how I get on.

    In the meantime what if I want to change the visited link colour as well?

    At the moment I'm happy with the link hover colour, but would like to underline links within posts and also have the colour change once the link is visited.

  12. alchymyth
    The Sweeper & Moderator
    Posted 4 years ago #

    it is great that you are starting to learn css:
    http://www.w3schools.com/css/css_link.asp

    just make it a habit to look things up everytime you have a question or a problem.

    the w3school.com site, for instance, is a good reference.

  13. Just Football
    Member
    Posted 4 years ago #

    Hi,

    micah - sorry, where do I paste that code into the css stylesheet? (i.e. which line?)

    Can you just input it anywhere, or is there an order that need obeying?

    Thanks again.

  14. Just Football
    Member
    Posted 4 years ago #

    Hi,

    Sorry all but.. any advice on the above question?

    Thanks again.

  15. Just Football
    Member
    Posted 4 years ago #

    Hi all,

    I have tried to get this to work but still have problems. When I input the code you stated it still changes the link colours of articles not within the text, which doesn't look great. Here's an example:

    http://www.just-football.com/2010/04/new-chelsea-home-kit-2010-2011/

    I want to change links within articles to red. Like so:

    .post-wrapper a { color: #FF0000; }

    But within the post wrapper, the related posts, authors, tags etc all change to red as well, which looks poor.

    Is there a way to edit it so it lies specifically within the body of the content only?

    It shouldn't be that hard, but I can't seem to figure it out!

    Anyone know their stuff? Please advise.

  16. Amit_k
    Member
    Posted 3 years ago #

    Hey,

    Did you tried this - .post-wrapper p a { color: #FF0000; }

    This will change the link color within your post.

  17. JimHalpert
    Member
    Posted 3 years ago #

    I too am having the same problem. I want to change the link color for the product name in my shopping cart but leave the categories links the same color. It appears that nobody knows the answer to my question. I posted this very same question in the stylesheet forum and I haven't received an answer that's solved it. I don't think you and I are the only people to have run into this so there must be a fix. At this moment I can recomment you custom essay service with the highest quality.

Topic Closed

This topic has been closed to new replies.

About this Topic