Социальные кнопки в одну строку для uCoz
Увы, шаблон недоступен для скачивания или покупки, в связи с обращением правообладателя!
По всем вопросам обращайтесь к Администратору.
По всем вопросам обращайтесь к Администратору.
Как я сразу понял по их внешнему виду - это были не оригинальные кнопки, то есть не те которые можно получить путем регистрации в инструментах разработчиков в каждой социальной сети, что очень долго и неудобно. Тут они были сделаны с помощью скрипта, небольшого html-кода, и собственного оформления. При этом как и у оригинальных, у них был счетчик поделившихся, в общем все как надо.
Поэтому я решил адаптировать их, поскольку это очень полезная вещь для любого сайта. А теперь еще и удобная и доступная. Для начала, предлагаю взглянуть на демо.
Установка социальных кнопок для uCoz
1. Скачайте архив и папки css, img, js со всем содержимым залейте в корень сайта. *Если такие папки у вас в файловом менеджере уже есть, то просто перекиньте все файлы из указанных папок архива - в соответствующие папки файлового менеджера.
2. Укажите в основных настройках значение тега DOCTYPE так:
Код
<!DOCTYPE html>
3. Далее поместите эти скрипты и стили в <head>:
Код
<link rel="stylesheet" href="/css/social-likes.css" type="text/css">
<script type="text/javascript" src="/js/jquery.js"></script>
<script type="text/javascript" src="/js/social-likes.js"></script>
<script type="text/javascript" src="/js/jquery.js"></script>
<script type="text/javascript" src="/js/social-likes.js"></script>
3. И последнее - сам код кнопок, ставьте по месту:
Код
<ul class="social-likes">
<li class="vkontakte" title="Поделиться ссылкой во Вконтакте">Поделиться</li>
<li class="facebook" title="Поделиться ссылкой на Фейсбуке">Нравится</li>
<li class="twitter" title="Поделиться ссылкой в Твиттере">Твитнуть</li>
<li class="odnoklassniki" title="Поделиться ссылкой в Одноклассниках">Класс!</li>
<li class="mailru" title="Поделиться ссылкой в Моём мире">Нравится</li>
<li class="plusone" title="Поделиться ссылкой в Google+">Google+</li>
<li class="livejournal" title="Поделиться ссылкой в LiveJournal">LiveJournal</li>
<li class="pinterest" title="Поделиться ссылкой в Pinterest">Pinterest</li>
</ul>
<li class="vkontakte" title="Поделиться ссылкой во Вконтакте">Поделиться</li>
<li class="facebook" title="Поделиться ссылкой на Фейсбуке">Нравится</li>
<li class="twitter" title="Поделиться ссылкой в Твиттере">Твитнуть</li>
<li class="odnoklassniki" title="Поделиться ссылкой в Одноклассниках">Класс!</li>
<li class="mailru" title="Поделиться ссылкой в Моём мире">Нравится</li>
<li class="plusone" title="Поделиться ссылкой в Google+">Google+</li>
<li class="livejournal" title="Поделиться ссылкой в LiveJournal">LiveJournal</li>
<li class="pinterest" title="Поделиться ссылкой в Pinterest">Pinterest</li>
</ul>
Ну вот и все! Надеюсь вам понравится. Если да, то ставьте лайк, комментируйте и подписывайтесь сукабля, хыыы!
Теги:
0 Комментариев