Оцените статью: 5 1 1 1 1 1 Рейтинг 5.00 (1 Оценка)

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

Нужно прийти на сайт www.share42.com. Это сервис, который генерирует такие блоки. И какие здесь есть настройки? Во-первых, это уменьшение и увеличение размера иконок.

Установка блока социальных кнопок Share42 на сайт joomla

Я советую ставить самый максимальный. Далее выбираем сами кнопки, которые вы хотите, чтобы были - социальные сети, социальные закладки. Вы можете сами выбрать, какие использовать. Я рекомендую самые популярные. Если вы хотите менять их расположение, это уже на ваше усмотрение.

Здесь основные две настройки.

share42 как вставить joomla

  1. Типа панели - вертикальный «плавающий», и горизонтальная.
  2. И во-вторых, здесь будет галочка по умолчанию - добавить иконку с сайта. Вы ее убираете тоже. Вот и все.

Также можно посмотреть, как это будет выглядеть и потом скачать скрипт.

Дальше скачиваем готовый скрипт. Внизу есть инструкция, что делать дальше.

  1. Сначала надо распаковать скрипт.
  2. Загрузить его на сервер, указать путь, куда именно мы его загрузили.
  3. Выбрать тип сайта, у нас Joomla будет сайт, поэтому мы выбираем «Статистический» (потом я покажу, как это все настроить)
  4. Вставляем код и затем подправим css стили.

Итак, приступим делать то, что показано в этой инструкции. Для начала распаковываем архив. Потом переходим на рабочий стол и распаковываем текущую папку.

социальные кнопки share42

Теперь его нужно перенести на сервер. Для этих целей я использую ftp-сервер, который встроен в Total Commander. Подключаюсь к ftp, соединение с сервером. Здесь можете создать новое соединение, подключить свои ftp-данные и таким же образом переносить разные файлы на сервер.

Для начала нужно выбрать, куда поставить нашу папку Share42. Я рекомендую поставить в папку Templаtes, а там в и папку своего шаблона. Первый этап мы сделали.

Дальше мы прописываем этот путь: Templates/yoo_level именно эта папка, как вы только что видели.

кнопки социальных сетей для сайта joomla

Оставляем «Статический сайт» и видим, что код изменился относительно нашего пути. 

Теперь нужно css-код в соответствующий файл. Нужно зайти по ftp - Templates/yoo_ level/css. У меня это файл layout.css. Я его открываю и вставляю этот код то в конец код:

#share42 {
  display: inline-block;
  padding: 6px 0 0 6px;
  background: #FFF;
  border: 1px solid #E9E9E9;
  border-radius: 4px;
}
#share42:hover {
  background: #F6F6F6;
  border: 1px solid #D4D4D4;
  box-shadow: 0 0 5px #DDD;
}
#share42 a {opacity: 0.5;}
#share42:hover a {opacity: 0.7}
#share42 a:hover {opacity: 1}

А код:

<div class="share42init"></div>
<script type="text/javascript" src="/http://www.homichenko.ru/templates/yoo_level/share42.js"></script>
<script type="text/javascript">share42('http://www.homichenko.ru/templates/yoo_level/')</script>

Мы вставляем в конец каждой страницы. Для этого нужно, чтобы был установлен компонент Sourcerer. Для каждой статьи нужно будет добавлять этот код. Но, я думаю, что вам этот метод не понравится, поэтому не спешите его скачивать Sourcerer. Я научу Вас Как можно сделать так, чтобы не нужно было этого делать.

Если у вас установлен компонент Jcomments, то можно прописать код, что там, где есть этот компонент, тоесть там, где есть комментарии, будет показываться блок социальных кнопок. Как это реализовать на практике?

Подключаемся по ftp к серверу, и переходим по пути components/com_jcomments/tpl/default и здесь есть файл tpl_index_php. Открываем файл и находим строку № 44 и после нее вставляем код, что нам дает программа и сохраняем.

Теперь, если мы перейдем, например, страницу любой другой статьи, то ты также увидим наш блок социальных кнопок.

Теперь вам не нужно вставлять в каждую статью этот код. И везде, где у вас есть в конце статьи комментарии, будет показываться социальные кнопки

Подписывайтесь на наш канал YouTube

 

Похожие статьи

Интересные статьи

Самые читаемые статьи



Рекомендуем хостинг

BeGet

 30 дней бесплатно!

Домены на .ru в подарок