Кнопки социальных сетей на сайте

Информация, представленная на этой странице ориентирована в первую очередь для начинающих web-мастеров.

В результате стремительного развития компьютерных технологий, внедрения Интернета в нашу жизнь, мы получили замечательную возможность общаться друг с другом независимо от времени и расстояний. Очень многие отдают предпочтение виртуальному общению в социальных сетях. Миллионы людей регистрируются в них и каждый преследует свои цели.

Но, сейчас речь не сколько о значимости социальных сетей, а о том, как с их помощью привлечь дополнительное количество посетителей на свой сайт. Уверен, что представленный плагин поможет Вам, как владельцу сайта, добиться дополнительного трафика, благодаря расширению общения.

Установка на сайт

Распакуйте скачанный архив в текущую папку. В папке keepupmyinsocialnetworks Вы обнаружите папку с изображениями img, папку с файлом стилей css, папку со скриптами js, а также папку Иконки и НТML-файл demo.html. Откройте последний в вашем браузере и проверьте работу плагина.

Шаг 1: откройте папку Иконки, подберите необходимые изображения-иконки социальных сетей, в которых Вы зарегистрированы и разместите их в папке img. Содержимое папки img закачайте в одноименную папку (img) в корне сайта.

Шаг 2: содержимое файла style.css из папки css добавьте в свой файл стилей сайта или разместите в head там, где прописаны стили.

Шаг 3: закачайте ява-скрипты из папки js в одноименную папку (js) в корне сайта.

Шаг 4: вставьте следующий код в раздел head на вашей HTML-странице:

<script type="text/javascript" src="/js/jquery00.js"></script>
<script type="text/javascript" src="/js/jquery01.js"></script>

Шаг 5: вставьте коды элементов и скрипт вызова функции в раздел body вашей страницы:

<div class="soc_buttons" class="soc_buttons">
 <a title="Следите за мной по RSS" target="_blank"
 href="//feeds.feedburner.com/Dynamic-siteru">
 <img src="img/rss_news.png" border="0"></a> 
 
<a title="Общайтесь со мной в контакте" target="_blank"
 href="//vkontakte.ru">
 <img src="img/vkontakte.png" border="0"></a> 
 
<a title="Общайтесь со мной в twitter" target="_blank" 
href="//www.twitter.com">
<img src="img/twitter.png" border="0"></a>
 
<a title="Общайтесь со мной в facebook" target="_blank"
 href="//www.facebook.com">
 <img src="img/facebook.png" border="0"></a>
 
<a title="Я в YouTube" target="_blank" 
href="//www.youtube.com/">
<img src="img/youtube.png" border="0"></a>

</div>
<script type="text/javascript">
$(function(){
 $('#soc_buttons').socializer(
 {
 inittop: 180,
 scrolltop: 70,
 type: 'fixed',
 opacity: 0.4
 });
})
</script>

Пояснения:

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

          Файлы изображений-иконок социальных сетей.

          Выравнивание блока иконок по вертикали. В данном случае - 180 пикселов от верха.

          Допустимое перемещение при скроллинге.

          Этим значением задается прозрачность изображения до наведения курсора мыши.

Вот и всё. Общайтесь в социальных сетях! До новых уроков. Ваш Л.М.