I have created an image map for the banner for a site but don't know how to get the bits of the image etc to upload to the theme.

OK I don't know what I'm doing ... I need to make the email part of the banner on smcsolar.co.uk open up an email programme ... I tried creating an image map but now have 6 bits of image and a HTML page and no idea what to do with them!

I tried adding the following to the Overlay Header Image box in the hope I could maybe make it transparent but still clickable but it doesn't show at all:

<div id="email_link">
<a href="mailto:info@smcsolar.co.uk">Email us now</a>
</div>

Could someone please help me work out how to add a link to the far right of the banner so when people click on the email address they can send an email?

Thanks

I would NOT use the built in image, I would add a new widget area to the 'Configure Header Area' then add a text widget to the new widget area and put your code in it.

Ah thats a good idea ... how can I position the widget so it's roughly where the email bit on the banner is though?

Just use separate hyperlinked images and position with CSS.

or, edit your image and cut out the email portion. Put just the your image in the 'atahualpa/images/header' folder. Now add your code to the "Image overlay' option

<div id="email_link">
<a href="mailto:info@smcsolar.co.uk">Email us now</a>
</div>

but change the 'v' to an <img...> that points to the little email section you cut out of the image and then position it with CSS

Really struggling to get this to work. The original banner is there but I've done a second version where I've cut out the area with the email and phone number, uploaded that graphic (email.png) to wp-content/my-images and then put the following code in the Overlay Header area (I kept the format exactly as the example on there, just changed the details)

<div id="header_image_sociable">
<ul>
<li><a href="mailto:theemailaddress@iwanttouse.co.uk">
<img src="/wp-content/my-images/email.png" alt="Email" /></a></li>
</ul>
</div>

And in CSS Inserts I added the following (as in the sample, so I could see where the image appeared and play around with it to get the image position right)

#header_image_sociable {position: absolute; right:40px; top: 20px;}
#header_image_sociable ul {list-style-type: none;}

But the image doesn't appear at all. (Please note that the banner on display now has the email/phone bit on there - because I can' leave it on display without - but the code above should ahve added a second identical graphic somewhere!)