Лайкли
Лайкли — социокнопки, которые не стыдно поставить:
Две расцветки, три размера, десять соцсетей, любой текст на кнопках, поддержка ретины.
Установка и использование
Добавьте в элемент <head> на странице:
<script src="/путь/к/likely.js"></script>
<link rel="stylesheet" href="/путь/к/likely.css">
Вставьте кнопки в нужное место, расположите в любом порядке, уберите лишние, подпишите как нравится:
<div class="likely">
<div class="twitter">
<div class="facebook">
<div class="vkontakte">
<div class="telegram">
<div class="odnoklassniki">
<div class="linkedin">
<div class="whatsapp">
<div class="pinterest" data-media="i/pinnable.jpg">
</div>
Настройка
Классы, меняющие внешний вид (все примеры выше):
class="likely likely-light"
Скин, который хорошо смотрится на тёмном и фотографическом фоне. Если фотография слишком светлая, лучше использовать обычный скин.
class="likely likely-small"
Маленькие кнопки.
class="likely likely-big"
Большие кнопки.
Параметры у основного элемента:
data-url="..."
Какая ссылка должна попасть в соцсети. По умолчанию — адрес страницы, на которой стоят кнопки, поэтому обычно можно не указывать.
data-title="Лайкли: социокнопки, которые не стыдно поставить"
Название страницы, которое должно попасть в соцсети. По умолчанию — тайтл страницы.
У элемента Твиттера:
data-via="ilyabirman"
Какой акаунт упомянуть в твите. Поменяйте мой на свой :-)
У элемента Телеграма:
data-text="Зацени-ка"
Какой текст отправить вместе со ссылкой в Телеграм.
У элемента Пинтереса:
data-media="i/pinnable.jpg"
Картинка, которая должна попасть в Пинтерес.
Для того, чтобы в Фейсбук попадала конкретная, а не случайная картинка, используйте такой тег внутри элемента <head>:
<meta property="og:image" content="path/to/image" />
Кто использует
Издания
Образовательные проекты
Счастливая жизнь после расставания
Сайты
Карта метро Парижа Кости Коновалова
Велосипедизация Санкт-Петербурга
Компьютерная помощь в Санкт-Петербурге
Крымский военно-исторический фестиваль
Конференция Творческое лето
Подкаст Паник-саундс
Дизайнерские компании
Офис проектирования взаимодействия
Недизайнерские компании
Ненком: альтернативная энергия для дома и бизнеса
Вандер-хостелс: хостелы в Питере
Мопарт: ремонт мототехники
Топрайт: агенство интернет-маркетинга
Продукты
Эгея: движок интересных блогов
Чатра: чат для сайтов
Скрапп: коллекционирование дизайнерских решений
Кешер: кожаные портмоне ручной работы
Мой фотопоток: распечатай свой инстаграм
Зона: фильмы онлайн
В кармане: менеджер документов
Пайп: дешёвые звонки
Метромап.фр: схема метро Парижа
Люди
И авторы многих блогов на Эгее