Рекомендуем

продвижение сайтов

Как сделать картинку в статье или модуле HTML Joomla, что бы при наведении курсора она менялась?

Как сделать взаимозаменяемую картинку


При наведении курсора мыши. без всяких скриптов и кодов, в статьях или модуле.

А также наложить на неё ссылку, что бы получилась кнопка. Но сразу говорю, что в Joomla.

Для этого нам надо две одинаковых картинки, но с разным цветом, например:

наведите курсор на домик или на крестик cancel.

К примеру, надо создать статью, а в ней сделать кнопку как картинка. Выбираем место для картинки, загружаем первую картинку, делаем, так как указанно на рисунках.

 

1) Выбираем картинку. И вставляем в статью.

2) Теперь настраиваем картинку как нам надо.

3) Копируем ссылку картинки, она нам понадобиться потом. Делаем переход в Оформление.

4) Настраиваем картинку, 1) делаем по центру, (что бы текст был ровно посередине картинки), 2 указываем размер картинки. Переходим в Дополнительные.

5) Ставим галочку в Альтернативное изображение. При наведении курсора на картинку, указываем ссылку второй картинки, а в При отведении курсора от картинки, ставим ссылку первой картинки. Обновляем.

После всего вот что должно получится .

Если надо сделать что бы картинка была ссылкой, делаем так. Нажимаем на картинку, она должна быть выделенная.

После нажимаем на цепочку, та, что целая не разорванная.

Адрес ссылки: Указываем нужную ссылку. Цель: Выбираем какой переход будет ( открыть в новом окне страницу или в этом же).

Можно добавить имя или подсказку всплывающую.

Теперь должно - получится так: нажмите на домик, будет переход на эту статью.

Ну, вот и всё! Всё просто и я надеюсь что было понятно. Конечно картинка ( домик) не очень, но если посидеть не много в  Adobe Photoshop, думаю можно сделать хорошую кнопку, если не разберитесь в Adobe Photoshop напишите мне, я вам помогу оформить.

 

На этом всё, удачи!!!

 

Комментарии  

 
0 #6 Администратор 18.01.2014 11:05
Цитирую Елизавета64:
Добрый день! а как сделать картинку ссылкой в шаблоне главной страницы? с пхп плохо дружу и не знаю, какой код писать :sad:


Здравствуйте, в Вашем случае нужен скрипт.

Данный скрипт рабочий, ссылка на скрипт:
http://22ws.ru/images/s-images.txt
Цитировать
 
 
0 #5 Елизавета64 18.01.2014 07:33
Добрый день! а как сделать картинку ссылкой в шаблоне главной страницы? с пхп плохо дружу и не знаю, какой код писать :sad:
Цитировать
 
 
0 #4 Дмитрий 19.11.2013 11:39
Спасибо Администратор. Излазил интернет, тут нашел простое решение!!! С Уважением!!! Дмитрий.
Цитировать
 
 
0 #3 Сергей1 05.12.2012 00:44
Спасибо, хороший урок!!! =)
Цитировать
 
 
0 #2 Администратор 13.10.2012 05:50
Стандартный Редактор – TinyMCE.
Настройка: зайдите в >Менеджер плагинов> Редактор – TinyMCE откройте его, Режим редактора >Расширенный, сохраните, после этого у редактора появятся дополнительные возможности.
Цитировать
 
 
+1 #1 Александр 12.10.2012 21:45
Извините, а какой это редактор? В JoomlaCK таких возможностей нет.
Цитировать
 

Добавить комментарий


Защитный код
Обновить