Как часть картинки сделать ссылкой?

[leolegas]

Уважаемые форумчане! Нужна Ваша помощь. Столкнулся с одной проблемой, никак не могу найти решение. Возможно это уже обсуждалось на форуме, но поиск не дал результатов, скорее всего был неправильно сформулирован мной вопрос. Прошу за это прощения. Проблема вот в чём. Смастерил я на Joomla свой первый сайт (www.boatshop.ie), заказчику вроде как <ок>, но потом захотелось ему добавить в header небольшой рекламный баннер и чтоб когда на него нажимаешь, переходишь на другую страницу. Но вся фишка в том, что header был весь создан в фотошопе и висит на сайте в виде header.png и баннер, который надо сделать ссылкой, нарисован на хедере. Сижу, ломаю голову, как часть (не весь хедер) картинки сделать ссылкой? Если зайти на сайт, то будет все понятно. Нашёл в интернете статью, про навигационные карты, тэги <map> и т.д. Вот набросал такой код:

<img src="Header.png" width="986" height="100" border="0" usemap="#karta1">
<map name="karta1">
<area href="topmeniusale.html" shape="rect" coords="600,5,975,95">
</map>

Закинул его в /templates/название_шаблона/index.php  но ничего не работает. Помогите дельным советом, что я делаю нетак?

[Poznakomlus]

Нашёл в интернете статью, про навигационные карты, тэги <map> и т.д. Вот набросал такой код:

<img src="Header.png" width="986" height="100" border="0" usemap="#karta1">
<map name="karta1">
<area href="topmeniusale.html" shape="rect" coords="600,5,975,95">
</map>

Закинул его в /templates/название_шаблона/index.php  но ничего не работает. Помогите дельным советом, что я делаю нетак?

То, что Вы нашли не для Вашего случая. Для Вас так пойдет. <a id="baner" href="ваша ссылка" title="текст при наведении на ссылку"> Текст ссылки</a> Далее  правите размер и положение с помощью CSS

[leolegas]

То, что Вы нашли не для Вашего случая. Для Вас так пойдет. <a id="baner" href="ваша ссылка" title="текст при наведении на ссылку"> Текст ссылки</a> Далее  правите размер и положение с помощью CSS

Получается совсем не там копал, теперь понятно. К сожалению у меня пока недостаточно знаний, только учусь, если несложно, можете набросать, как выглядит правка размера и положение с помощью CSS. И какой файл в итоге корректировать? куда вносить изменения? template.css?

[Poznakomlus]

#baner {
text-indent: -9999px;  //Прячем текст ссылки
....
}
Вставляете в boatshop.ie/templates/ultramarine4/css/template.css
ДАЛЕЕ учимся http://htmlbook.ru

[leolegas]

Прошу прощения, но мне кажется, что мы опять не там копаем, или я чего то не недопонимаю. У меня на сайте хедер с баннером - это одно целое (header.png). На этой картинке необходимо выделить только ту часть, где нарисован "типа баннер" и сделать её линком. Черпал инфу я от сюда http://www.postroika.ru/html/17step2.html, так как решил, что вариант описанный в этой статье мне очень подойдёт, но к сожалению на практике он мне не удался.

[Poznakomlus]

Поясняю логику! У вас див с оформлением фона header.png. Внутри этого дива вы создаете ссылку. Размеры этой ссылки и ее расположение настраиваете как Вам угодно.