Создаем кнопку Вернуться назад

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

Есть несколько вариантов, как можно добавить кнопку, но я лично использовал только один способ. А именно третий вариант из предложенных мною трех. Чуть далее расскажу, почему именно он. 

Какие вообще есть у нас варианты:

  1. Отредактировать файлы шаблона Jooml-ы.
  2. Просто вставить код кнопки в нужное место.
  3. Создать модуль "HTML-код", вставить туда код кнопки, и потом выводить этот модуль в нужном месте.

Плюс в третьем варианте в том, что если надо будет отредактировать текст на кнопке или изменить/добавить класс стиля, то нужно будет всего поправить сам модуль, а не исправлять кнопку во всех местах, где она стоит.

Так вот, на одном из своих сайтах я и использовал третий вариант:

Вернуться назад

Был создан модуль «HTML-код» и туда с помощью расширения "Sourcerer", которое дает возможность добавлять любой код в материал, был вставлен код кнопки.

Код

Далее стандартными возможностями Джумлы, потом уже раскидал кнопку в нужные мне места.

Мой рабочий код кнопки:

<div id="return-back"> <a href="javascript:history.back();"> <span class="glyphicon glyphicon-circle-arrow-left"></span> Вернуться назад </a> </div>

Текст немного украшен стрелкой, с помощью компонентов из bootstrap 3, а самой кнопке заданы стили через CSS.

 

Всем удачи!

 

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

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

Я рекомендую


Челябинская область

Мебель на заказ от производителя

В этот блок попасть не так просто. Я проверяю социальные сети, сайт и отзывы о компании.

Если у вас имеются вопросы по поводу работы сайта, сотрудничества и предложений, Вы можете написать на почту info@alexfine.ru

Я создал первую версию блога и введу его с 2015 года.

Копирование материалов сайта возможно только с указанием активной ссылки "www.alexfine.ru" в качестве источника.

Изображение кнопки наверх

Вконтакте
Вконтакте
Вконтакте
Вконтакте
Вконтакте
+