Want to create a Text Hyperlink on a .png image that is in the header

By Tiffany-2 on 28 May 2009 at 18:13 UTC

I have changed the image of "top_header.png" and I would like to add a hyperlink from it. In other words when someone clicks on it they will be taken to an external site.

I assume I need to edit the overall header for my template?

Anyone know how to do this?

Comments

Add Text link on my header background image???

Tiffany-2 commented 29 May 2009 at 16:45

Anyone know how to do this? I figured out how to make the enitre .png hyperling by adding some code. But what about JUST the text???

_

WorldFallz commented 29 May 2009 at 18:52

What text-- you're talking about a png?

text on an image

Tiffany-2 commented 29 May 2009 at 22:52

Ok here is my site if u want to see what i am trying to explain... (www.irrigationdirect.ca)

The background joomla image is of grass and clouds. In the top right hand side (In Photoshop) I added the text (Go to the US Store)

I want the text to hyperlink to the US store and not the enitre image to become the hyperlink.

This is the code I added to (I think it was) the index or template.php page...

This code makes the entire header link to the US store and not just the (Go to the US Store) TEXT. I only want the Go to US Store text to hyperlink.

Any ideas?

_

WorldFallz commented 30 May 2009 at 14:23

Ah ok. Text in an image is not text. The browser simply sees pixels in an image-- there is no actual 'text' to turn into a link with the anchor element. In order to do what you want you'll have to use an image map.

Image map Coding

Tiffany-2 commented 31 May 2009 at 02:26

Ok, I totally know how to do image maps in Dreamweaver.
Would I create the image map in dreamweaver and copy the code into the index.php?

Here is the code I added to the index.php:
div id="header_bg" onclick="location.href='http://www.irrigationdirect.com/';" style="cursor: pointer;"> ?php echo $mainframe->getCfg('sitename') ;?
/a /div

Here is the code for the image map:
img src="images/header_bg.jpg" width="902" height="177" border="0" usemap="#Map"
map name="Map"
area shape="rect" coords="756,14,892,32" href="http://www.irrigationdirect.com/" target="_blank"
/map

Where do I add that in the index.php code? Once I get that I think I have it! I am just afraid to add it, in-case I kill the site or something....

Thanks for responding!!