Insert a link in a graphic image

Yes it’s possible.

https://www.w3schools.com/TAGS/tag_map.asp

You have to map the image, basically.

I think I’ve mapped the image and coded the hot spots. (This question will give away what a newbie I am.) Where do I insert the code and how do I save it?

Thank you,
Ron

create a div with the full image background. set this div position to relative. then make an anchor for every cabinet, and set each anchor’s position to absolute, and mention the x,y position, and width and height for each of them. here is an example:

<div id=”fullImage”>
<*a class=”targetCabinet” id=”cabinetA”> </*a>
<*a class=”targetCabinet” id=”cabinetB”> </*a>
<*a class=”targetCabinet” id=”cabinetC”> </*a>
<*a class=”targetCabinet” id=”cabinetD”> </*a>
</div>

remove the “*” symbol. i used it just to be displayed as plain text

in your css file you should have something like this:
#fullImage{position:relative; background:url(‘your_image_source’) no-repeat top left; }
.targetCabinet{position:absolute; width:150px ; height:20px; }
#cabinetA{top:10px; left:20px; }
#cabinetB{top:300px; height:100px; }

2nd method is to use floats. create 1 div with with full cabinet image, then add 2 div’s with spans. float each spans and use margins to position them.

hope it will help you

Thank you very much. I won’t be able to try this until Wednesday, so I’ll update you on my progress then.

I appreciate your help.

Ron

I’m lost! I’ve mapped the hot spots on the image of the cabinet. I’ve written a div that makes sense (at least to me). I’ve figured out how to FTP into my site where I can view my directories and files. I cannot find anything that looks like the code I see when I view source from my web pages, nor anything that looks like the code you say I should see in my “css file.”

It’s apparent to me that I need training on what I’m seeing in my directories, what does what, and how do I use it. I’d appreciate any suggestions of where I might start.

Thank you.

Ron

Use the codex from WordPress to make an image about how pages are structured. It’s 100% helping

Luciaannn,

Do you have a URL? I’ve searched the Codex for structured pages and images with no luck.

Thanks,
Ron