Adding a Link to My Header Image

madisunanne · Member · Dec 3, 2011 at 1:59 am
Copy link

Add topic to favorites
Hello.

Just started a blog less than a week ago, & I am LOVING blogging already!
An Inch of Hope

So, I just designed a header graphic for my site.
I have researched quite a bit on this forum & the Internet on how to add a link to the header image,
but b/c I do not know CSS at all, I am having trouble.

I have the Licorice theme on my site, & I would love it if you could specify how to edit the CSS/HTML to make this happen.

Please HELP!
madisunanne.
<3

The blog I need help with is: (visible only to logged in users)
timethief · Member · Dec 3, 2011 at 2:06 am
Copy link
All CSS editing is theme specific. The blog linked to your username is wearing Twenty Eleven. Please post an active link starting with http:// to the blog wearing the Licorice theme.
timethief · Member · Dec 3, 2011 at 2:07 am
Copy link
Oh dear. I do apologize as I just spotted the link in the OP. :(
thesacredpath · Member · Dec 3, 2011 at 2:53 am
Copy link
This can be done, but it is a little involved. You have to make a transparent PNG image with no background color the exact size of your header image, upload that to your media library, get the URL and insert it into a text widget linked to your home page in the bottom sidebar. Once you have done that, then we would use absolute positioning to move that text widget up and over the top of your header image thus making it clickable.

If you want to get the image created and into a text widget linked to your main page, we can help move it up there for you.
thesacredpath · Member · Dec 3, 2011 at 2:55 am
Copy link
Oh and one other thing, please go to settings > general and temporarily turn off the snow. It generally messes me up when I’m trying to use Firebug to do these sorts of things and can even kill firefox before I get done.
thesacredpath · Member · Dec 3, 2011 at 3:01 am
Copy link
And if you need the HTML code for an image link.

<a href="LINK URL"><img src="IMAGE URL" title="" alt="" /></a>
madisunanne · Member · Dec 3, 2011 at 3:42 am
Copy link
@sacredpath, thank you for your quick & detailed response.
snow is now off, & i will get to work on the transparent PNG image.

will let you know when i am done.

thank you.
madisunanne.
madisunanne · Member · Dec 3, 2011 at 3:54 am
Copy link
DONE: You have to make a transparent PNG image with no background color the exact size of your header image

DONE: upload that to your media library,

I THINK THIS IS DONE, IS IT?: get the URL and insert it into a text widget linked to your home page in the bottom sidebar.

I don’t have a bottom sidebar that I am aware of,… only a sidebar on the right.

Let me know what to do next!

Thank you,
madisunanne.
thesacredpath · Member · Dec 3, 2011 at 5:13 am
Copy link
Here you go. Add this to your custom CSS.
```
#canvas {
position: relative;
}

#text-5 {
left: 50px;
position: absolute;
top: 100px;
}
```
madisunanne · Member · Dec 3, 2011 at 5:31 am
Copy link
DONE!

Thank you for all your help!
madisunanne.
<3
thesacredpath · Member · Dec 3, 2011 at 6:18 am
Copy link
You are welcome.
imanaturaldisaster · Member · Dec 3, 2011 at 1:33 pm
Copy link
Hi, I’m trying to follow along and so far I’ve got my image uploaded to my media library. I’ve tried to carry on and I’ve ended up with this; http://www.rhianna.info.

I’m really struggling to get it moved into the right position and I’m a complete beginner with no idea what I’m doing.

Does the last piece of code you provided go into the style.css somewhere?

Thank you!
Rhianna
thesacredpath · Member · Dec 3, 2011 at 6:30 pm
Copy link
imanaturaldisaster was taken care of in their other thread (wrong forum): https://en.forums.wordpress.com/topic/removing-title-in-liquorice-theme?replies=5 .

No items found.