WordPress.org

Ready to get started?Download WordPress

Forums

Highlighting A Link (30 posts)

  1. MrSFJFC
    Member
    Posted 4 years ago #

    I'd like to change the color (green) of a "Link" that appears on the right side of me HomePage. I thought there was a way to do that but I'm not quite sure. Maybe you can just change the color of text?

  2. alchymyth
    Forum Moderator
    Posted 4 years ago #

    you probably need to edit the style.css (in rare cases a different css file) of your theme and find the style that influences your link:
    http://www.w3schools.com/CSS/css_link.asp

    if you post a link to your site, where the green link can be seen, someone might be able to point you in the right direction.

  3. MrSFJFC
    Member
    Posted 4 years ago #

    I actually want to turn the link to green which is currently black. Just that one link though. Wondering if that was possible since the other links will be remaining in black?

  4. alchymyth
    Forum Moderator
    Posted 4 years ago #

    if the link is in an element with a unique class, that might well be possible.

    btw:
    if you intend to do more of style tweaking, firefox web developer add-on is a good tool to investigate these css issues of your blog, online in your browser.

  5. MrSFJFC
    Member
    Posted 4 years ago #

    I used that link that you suppied me (above) to change the color and this is what I came up with. The thing is, it doesn't show it as a clickable link, but the color did change. Is there a certain spot to put it within the style.css?

    http://www.w3schools.com/CSS/tryit.asp?filename=trycss_color

    This it it for now. Thank you, Alchymyth.

  6. alchymyth
    Forum Moderator
    Posted 4 years ago #

    as you could see from the link to 'styling links' there a a few different states of alink, and to be able to see it as a link, usually either the :link state or the :hover state would be styled different from the other states.
    to make the link visible in the text, it would need to be styled either in a different color from the surrounding text, or maybe with 'text-decoration:underline'.

    as i can't at all see what you have changed and what effect it had on the design of your link, this is only general information.

    if you try to impose a different new style, it is best to overwrite the exact one you want to change, or to add a more specific one to style.css, or to put them towards the end of style.css to overwrite other ones you may have missed.

    one last thought:
    if you are entering the link manually into the post, you could try and use an inline style:
    <a href="linkurl" title="" style="color:green;">linktext</a>

  7. MrSFJFC
    Member
    Posted 4 years ago #

    Is there a way I can change the color and underline the verbage as a link within one code or do I have to do that separately?

  8. alchymyth
    Forum Moderator
    Posted 4 years ago #

    if you refer to inline styles, you can have as many styles in that one line as you need:
    <a href="linkurl" title="" style="color:green; text-decoration:underline;">linktext</a>

  9. MrSFJFC
    Member
    Posted 4 years ago #

    The inline style looks easier and I'm gonna try using the color green and decoration:underline style to see how that works. I'll let you know. Thx.

  10. MrSFJFC
    Member
    Posted 4 years ago #

    Does the inline style link go where it says "Web Address" when editing the link?

    What do I use where it says "Name" when editing the link?

  11. MrSFJFC
    Member
    Posted 4 years ago #

    I tried bit it's not happening. I did notice that when I hover over the link it turns to a green color. Will that have any effect?

  12. alchymyth
    Forum Moderator
    Posted 4 years ago #

    the 'turning green' could be a sign that you are on the right track.

    could you post the code of that link, plus e few lines before and after, so someone could check it?

    but without a link to your site where the link could be seen in action, that is basically all i can help from here.

  13. MrSFJFC
    Member
    Posted 4 years ago #

    I should've said that the links were already set up that way (green when hoved) with all the the links on the Home pAge.

    http://dustinkeller81.com

    Where would I find this code that I'm referring to, above?

    Is there a certain way I need to post it here too?

  14. alchymyth
    Forum Moderator
    Posted 4 years ago #

    simply name the word that you want to style as a link, and point roughly to the place where it can be found - the rest is easily to retrieve from your site, after you posted the link.

  15. MrSFJFC
    Member
    Posted 4 years ago #

    Sorry but I don't understand at all. Can you give me better directions? Thank you!

  16. alchymyth
    Forum Moderator
    Posted 4 years ago #

    now, after you posted a link to your site, could you describe which link you want to style green -

    for instance: the links in the right sidebar?
    or: the 'no comments' link?
    or: the tag and category links under the posts?

  17. MrSFJFC
    Member
    Posted 4 years ago #

    Yes, the link on the right side. Receive 10% off Dustin Keller jerseys...............

    When I say style green, I mean I would like it to be green all the time so it distinguishes itself from the rest of the links in black.

  18. alchymyth
    Forum Moderator
    Posted 4 years ago #

    unfortunately, there is no unique identifier to just style this one link;

    the closest you could get, is to style the whole block differently:

    in style.css at the end, you could add:

    #linkcat-2 ul li a:link {color:#a0c330;}
    #linkcat-2 ul li a:hover {color:#033f2d;}
  19. MrSFJFC
    Member
    Posted 4 years ago #

    Just to make sure and I might want to try it, all I have to do is change color to green in either format and add the whole style all the way at the botton of style.css?

    Thanks for all of your help. At least I have this information for future use!

  20. alchymyth
    Forum Moderator
    Posted 4 years ago #

    these are two shades of green; inverted from the other links on the sidebar.
    (for color codes see for instance:
    http://en.wikipedia.org/wiki/Web_colors)
    you could simply copy/paste this css code into style.css at the bottom.

  21. MrSFJFC
    Member
    Posted 4 years ago #

    Which code are you referring too? That's a Wiki page that you gave me (right above this post).

  22. Rev. Voodoo
    Volunteer Moderator
    Posted 4 years ago #

    delete the closing parenthesi from the url
    http://en.wikipedia.org/wiki/Web_colors

  23. alchymyth
    Forum Moderator
    Posted 4 years ago #

    @RVoodoo:
    thanks, got tricked by the auto-linker :-(

  24. Rev. Voodoo
    Volunteer Moderator
    Posted 4 years ago #

    @alchymyth
    Yup...it just happened to me a bit ago, that's how I caught it

  25. MrSFJFC
    Member
    Posted 4 years ago #

    That didn't do anything. I might be missing something here but I'm just trying to follow instructions and now I'm totally lost. For some reason, I knew that last instruction didn't look right to me. Where do I go now to even to try to have all the links one solid color?

    here?

    #linkcat-2 ul li a:link {color:#a0c330;}
    #linkcat-2 ul li a:hover {color:#033f2d;}

  26. MrSFJFC
    Member
    Posted 4 years ago #


  27. alchymyth
    Forum Moderator
    Posted 4 years ago #

    how did you manage?
    did you use the theme editor in 'admin' 'appearance' 'editor'?
    and edited style.css of the theme?
    did it save the changes alright?

    did it have any negative effect somewhere else?

    if anything changed in way that you don't want, see if you have backup files which you can then restore.

    or retrace the steps that you have done.

    I knew that last instruction didn't look right to me.

    and follow your gut feelings.

  28. MrSFJFC
    Member
    Posted 4 years ago #

    Yes, I used the theme editor in 'admin' 'appearance' 'editor and added the last URL that you gave me to style.css of the theme. Nothing changed and didn't have an effect on other parts of the Site though.

    I'd still like to try to see if any type of changes can be made in reference to what I asked; change color of the links.

  29. alchymyth
    Forum Moderator
    Posted 4 years ago #

    well, i am at the end of my suggestions.
    what i tried seemed to work in my test environment.
    maybe you can restart this question in a new thread and see if one of the other volunteers can come up with a solution and some explanation that will work for you.

  30. MrSFJFC
    Member
    Posted 4 years ago #

    Based on what you saw, which one is the easiest and the best. Please explain? Appreciate your efforts.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.