How do I create an underlined hyperlink for all my hyperlinks in my blog?

[melissamal]

I am wondering how to get all my hyperlinks to be underlined and with a color I'd like to use throughout my blog. Right now it just changes the link to blue and no underline.

I found this code while searching , but where exactly does it go? And is this the correct code?

change underline color

TIA!

http://www.integrativenutritionaltherapies.com/sea-salt-dark-chocolate-bark/

[anotherusername]

Don't put underlines under your links. It will take your very attractive page copy and will make it look worse.

Having said that...

I clicked on the change underline color link you posted but it appears to be broken.

Go to line 1805 of you style sheet and where you see this part:

{
    color: #F2A561;
}

change it to this:

{
    color: #F2A561;
    text-decoration: underline;
}

Hope this helps, but again, I would kindly suggest that you DON'T use underlines, as they tend to be pretty obnoxious looking.

If you want a more subtle way to highlight the links, you could always change the color from color: #F2A561; to some other hex color. You could also try this instead:

{
    color: #F2A561;
    font-weight: 600;
}

[melissamal]

Thank you so much, I'm going to try this. But, how do I go directly to "line 1805" or any specific line? There's a lot of code.

[melissamal]

Or what section in the table of contents is this under?

[anotherusername]

Ok, firstly, I don't know how you are trying to edit your CSS file.

But here is what I would do:

If you are on a PC, then download notepad++

(I don't know if there is something like notepad++ for mac users).

Do you know how to edit the css through the built in editor in wordpress? If so, go to that CSS sheet, Which would be under Appearance -> Editor and then copy the code from that style sheet and paste it into Notepad++

Really, what you need is a text editor that has line numbers, and then you can find that line 1805 in your style sheet.

Make the changes in notepad++ and then copy and paste them back into the wordpress editor.

Then hit update.

~~~~~

Alternatively, if you just search for this:

{
color: #F2A561;
}

I think you will be able to find it. I think there is only one instance of:

{
color: #F2A561;
}

but best to double check first.

Hope this helps.

[melissamal]

Ok, great, I'm getting there! I have the underline. Now, I want a little more space between the word and the underline, can you get me there?

I want it to look exactly like her hyperlink and underline, a very clean look and a little gap under the word: http://wellnessmama.com/3610/magnesium-deficiency/

Would you know what to do next?

[melissamal]

Figured it out! Thank you so much!!

[Author]

Posts