Приветствую всех на моем блоге, с вами Денис Чернятинский, и сегодня я расскажу об универсальном сервисе позволяющем добавить кнопки социальных сетей для сайта. Он поможет добавить к себе на сайт или блог красивые социальные кнопки и легко их менять.
Скрипт социальных кнопок
Скрипт кнопок социальных закладок и сетей разработал российский веб-мастер Dimox. Он реализовал свою задумку в виде веб-сервиса, где каждый пользователь может совершенно бесплатно выбрать, настроить и интегрировать социальную составляющую в свои проекты.
Как установить кнопки социальных сетей для сайта
Теперь приступим к обзору возможностей сервиса. Сервис поддерживает русский и английский интерфейсы. На момент написания статьи скрипт поддерживает 45 социальных сервисов. Попав на главную страницу, вашему взгляду откроется пошаговый конструктор, генератор социальной составляющей, разделенный на 6 шагов:
Первый шаг
На первом шаге определяются иконки сервисов, которые вы хотите задействовать на своем сайте. Задается их размер от 16 до 32 пикселей. Порядок иконок можно изменять простым перетаскиванием. У некоторых поддерживаемых сервисов рядом с иконкой присутствует оранжевая точка, что означает наличие у этого сервиса поддержки счетчика.
Второй шаг
Второй шаг нам позволяет выбрать горизонтальную или вертикальную панели с иконками. Замечу, что вертикальный тип панели плавающий, то есть при скроллинге панель остается на месте, а не движется вместе со страницей. Есть возможность задать тип кодировки UTF-8 либо Windows-1251 (ANSI). Советую поставить две последние галочки, они позволят вам увидеть счетчик рядом с кнопкой.
Третий шаг
Третий шаг совсем простой, он представляет собой кнопку просмотра, позволяющую увидеть итоговый вариант и кнопку загрузки готового скрипта к себе на компьютер для дальнейшей интеграции с сайтом.
Четвертый шаг
Четвертый шаг помогает установить скачанный скрипт на своем сайте или блоге. Если описать вкратце: распаковка скачанного архива со скриптом, загрузка папки на свой сервер в любую директорию сайта, указать путь к папке со скриптом, выбрать тип вашего сайта из популярных CMS или просто опцию «Любой сайт».
Пятый шаг
Пятым шагом идет вставка приведенного ниже кода в шаблон вашего сайта. Вы сами выбираете место для вставки кода и соответственно отображения социальных кнопок. Если у вас горизонтальное расположение, я советую ставить код сразу после текста статьи. Если вертикальное, то перед началом статьи.
<div class="share42init"></div> <script type="text/javascript" src="https://site.name/share42/share42.js"></script>
Еще существуют специальные параметры, которые я представлю на скриншоте ниже.
Шестой шаг
Значение шестого шага заключается в проверке полученного результата от своей работы. Вы заходите на свой сайт или блог и проверяете, как выводятся кнопки.
После создания и публикации на сайте данных социальных кнопок, не составит большого труда их изменять под себя, к примеру, вы можете видеть, как я реализовал данный функционал на своем блоге. Если перейдете к моим статьям, после каждой статьи есть блок»Поделиться». Для этого нужно уметь пользоваться инспектором в Firefox и немного знать, что такое CSS.
Надеюсь, информация, полученная в статье была для вас полезна и вы научились добавлять кнопки социальных сетей для сайта. Пишите в комментариях о своем опыте добавления социальных кнопок на свой сайт или блог. Все ли у вас получилось или возникли какие-то трудности. С радостью отвечу в комментариях.
Подписывайтесь на обновления моего блога, впереди будет много нового и интересного. Желаю всем удачи с реализацией социального функционала на своих проектах, пока!
Спасибо за подробное объяснение процесса, кнопочки мной успешно установлены и не возникло никаких сложностей, хотя я не специалист в этой области.