Website: One picture needs 2 links, how?

blue_monkey_2

This sounds a bit odd but I am trying to get things together for my website.

I have made a picture for my website using 2 pictures in Picasa3 and will post this as one picture on my website. However, is it possible that I can have 2 links on this picture?

At the moment I click on it and the picture highlights and I can add a link, but I can only add one. So is there any way I can 'split' the picture in 2 and add 2 links, one on each side over each picture.

Is it easier if I put the picture on the site so someone can advise me if I can do anything with it?

I am really trying to get myself organised and sort my home page as it looks dismal at the moment and Picasa will let me make so great pictures but I want to know how I can make it better in the future.

Thanks

Luis_Torres

yes there is a way. add the picture in background and add two div on that with transparent image and add link to those images.

blue_monkey_2

Ah, yes. You see this is what I thought I could do but I cannot find anything on Picasa to make a transparant image so I thought I would not be able to do that. Is there a way or am I using the wrong program for that?

Luis_Torres

blue_monkey wrote: »

Ah, yes. You see this is what I thought I could do but I cannot find anything on Picasa to make a transparant image so I thought I would not be able to do that. Is there a way or am I using the wrong program for that?

may be you are using a wrong program. use photoshop or gimp to make the image transparent by reducing the opacity.

martin8_2

blue_monkey wrote: »

I have made a picture for my website using 2 pictures in Picasa3 and will post this as one picture on my website. However, is it possible that I can have 2 links on this picture?

At the moment I click on it and the picture highlights and I can add a link, but I can only add one. So is there any way I can 'split' the picture in 2 and add 2 links, one on each side over each picture...

let me get this straight.... one picture (which is really two joined together) many links within that one picture file so someone clicks on either photo and it goes to a different link? If so, you should google "html image maps"

john_s_2

One other way is this. Although it uses tables which are the devil's spawn in some people's books. There may be a way of doing this with CSS (I'm sure there is) but I don't know any CSS.

Split image in two using your image editor. Doesn't have to be half but use a clean cut either vertically or horizontally.

Insert a two cell table in your document (either two horizontal cells or two vertical depending which way you cut your image). This should have zero padding, border and spacing.

Insert the two images into the appropriate cells. These will appear as one picture in your browser (and wysiwyg webpage editor). Insert links into both images as applicable.

There is a way of mapping a image and creating different links for different parts of it, but I don't know how to do that. (EDIT: What Martin8 said!)

Luis_Torres

there is also one more way if you are good in style sheets, by adjusting the position style of the image.

fuzzball172

image map is a simple html solution google w3schools and look up image map

Luis_Torres

fuzzball172 wrote: »

image map is a simple html solution google w3schools and look up image map

what is that, do you have any web url for that tutorial?

isofa

Try this: http://www.elated.com/articles/creating-image-maps/

or

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

Luis_Torres

thanks for sharing.. I'll check it out int he site.