Share buttons. Красивые кнопки соц. сетей.
Всем привет. У вас есть кнопки соц. сетей на сайте? Хотите, чтобы они стали красивыми? Тогда читайте эту статью.
Это ну очень простой скрипт, но он позволяет сделать неплохой эффект. Зайдите по ссылке: https://github.com/carrot/share-button Найдите справа кнопку Download ZIP. Нажмите на нее. Вы скачаете .zip архив, где будет много чего, но нам важен файл share.min.js Найти вы его можете в папке build. Теперь создайте html страничку со следующим содержанием:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Share Buttons</title>
<script src="share.min.js"></script>
<style>
.share {
margin: 100px auto;
}
</style>
</head>
<body>
<div class="share"></div>
<script>
new Share(".share", {
networks: {
facebook: {
app_id: "abc123"
}
}
});
</script>
</body>
</html>
Как видите, у нас есть просто пустой div с классом .share. Для него я применил стили, чтобы просто отодвинуть его от края страницы. Чтобы скрипт заработал, его нужно в теге head подключить, а затем в теге script создать объект Share, передав ему название класса для нашего блока. Вы также можете передать какие-то настройки для любой соц. сети, как показано в примере, если вам это нужно.
Вот такой, казалось бы, простой скрипт но он может украсить ваш сайт и сделать его более интересным.
На этом все, спасибо за внимание.
-
- Михаил Русаков
Комментарии (3):
Не работает
Ответить
Все работает. Перед тем как писать статью, все проверяется самим автором. Какие сложности у Вас возникли?
Ответить
Кнопки "и не думают появлятся".
Ответить
Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.