Блок «Поделиться»

Если разместить блок на вашем сайте, посетители смогут быстро публиковать в своих социальных сетях ссылки на понравившиеся им страницы сайта.

С чего начать

Ознакомиться с Yandex API

Установка

Установите данный код на все страницы сайта.

<script src="https://yastatic.net/es5-shims/0.0.2/es5-shims.min.js"><<>/script>;
<script src="https://yastatic.net/share2/share.js"></script>
<div class="ya-share2" data-curtain data-shape="round" data-services="vkontakte,odnoklassniki,telegram,viber,whatsapp"></div>

Настройка

`data-bare`	Признак того, что загрузка стилей отключена. Если добавить атрибут, соцсети будут отображаться в виде текстового вертикального списка.	Наличие или отсутствие атрибута.
`data-color-scheme`	Цветовая схема кнопок соцсетей.	`blackwhite` — белые иконки на черном фоне `whiteblack` — черные иконки на белом фоне `normal` — белые иконки на индивидуальном фоне Значение по умолчанию: `normal`.
`data-copy`	Позиция кнопки Скопировать ссылку. Кнопка может отображаться в pop-up по нажатии , если используется атрибут `data-limit`, или в основном списке соцсетей.	`first` — кнопка вверху списка в pop-up; `last` — кнопка внизу списка в pop-up; `hidden` — кнопка не отображается в pop-up; `extraItem` — кнопка в основном списке. Значение по умолчанию: `last`.
`data-curtain`	Указание на мобильных устройствах вместо pop-up выводить окно, похожее на нативный инструмент Поделиться. В шапке окна отображается превью сайта. Источники данных для превью Контент в превью может не совпадать с контентом для соцсети. Картинка и описание для превью берутся из атрибутов `image` и `description`. Если атрибуты `image` и `description` не указаны, данные подтягиваются из разметки Open Graph. Если описание не найдено в разметке Open Graph, оно подставляется из мета-тега `description` страницы. Если описания нет и там, берется текущий URL страницы. Кнопка Другие для вызова нативного инструмента Поделиться и кнопка Скопировать ссылку присутствуют в окне, если такая возможность предусмотрена браузером.	Наличие или отсутствие атрибута.
`data-description`	Текст, которым нужно поделиться.	Строка. Некоторые соцсети могут обрабатывать большие строки некорректно. Вы можете сразу указывать значения параметров контента с учетом этого или указать значения для таких соцсетей отдельно.
`data-direction`	Направление списка кнопок.	`horizontal` — горизонтальное; `vertical` — вертикальное. Значение по умолчанию: `horizontal`.
`data-image`	Изображение, которым нужно поделиться.	URL изображения. Некоторые соцсети могут обрабатывать большие строки некорректно. Вы можете сразу указывать значения параметров контента с учетом этого или указать значения для таких соцсетей отдельно.
`data-lang`	Язык блока. Локализуются подписи кнопок соцсетей и кнопка Скопировать ссылку.	`az` — азербайджанский; `be` — белорусский; `en` — английский; `hy` — армянский; `ka` — грузинский; `kk` — казахский; `ro` — румынский; `ru` — русский; `tr` — турецкий; `tt` — татарский; `uk` — украинский; `uz` — узбекский. Значение по умолчанию: `ru`.
`data-limit`	Количество соцсетей, отображаемых в виде кнопок. Используется если нужно встроить в блок много соцсетей, а также чтобы блок занимал мало места на странице. Не вошедшие в лимит соцсети будут отображаться в pop-up по нажатии кнопки .	Натуральное число или отсутствие атрибута.
`data-more-button-type`	Вид кнопки открытия pop-up, если значение `data-limit` равно `0`.	`long` — с надписью `short` — без надписи значение не задано — стандартный вид
`data-popup-direction`	Направление открытия pop-up.	`bottom` — вниз; `top` — вверх; `auto` — по умолчанию вниз; если не вмещается вниз, то вверх; если не вмещается ни вниз, ни вверх, то вниз. Значение по умолчанию: `bottom`.
`data-popup-position`	Расположение pop-up относительно контейнера блока. Значение `outer` может понадобиться в том случае, если из-за специфики верстки вашего сайта pop-up обрезается соседними элементами страницы.	`inner` — внутри контейнера; `outer` — снаружи контейнера. Значение по умолчанию: `inner`.
`data-services`	Список идентификаторов социальных сетей, отображаемых в блоке.	`blogger` — Blogger; `delicious` — Delicious; `digg` — Digg; `evernote` — Evernote; `messenger` — Яндекс Мессенджер; `linkedin` — LinkedIn; `lj` — Живой Журнал; `moimir` — Мой Мир; `odnoklassniki` — Одноклассники.ru; `pinterest` — Pinterest (требуется указать атрибут `data-image` из таблицы поддерживаемых атрибутов); `pocket` — Pocket; `qzone` — Qzone; `reddit` — Reddit; `renren` — Renren; `sinaWeibo` — Sina Weibo; `skype` — Skype; `surfingbird` — Surfingbird; `telegram` — Telegram; `tumblr` — Tumblr; `twitter` — Twitter; `viber` — Viber; `vkontakte` — ВКонтакте; `whatsapp` — WhatsApp.
`data-shape`	Форма кнопок соцсетей.	`round` — круглая `normal` — прямоугольная со скругленными углами Значение по умолчанию: `normal`.
`data-size`	Размер кнопок соцсетей.	`l` — большой `m` — средний `s` — маленький Значение по умолчанию: `m`.
`data-title`	Заголовок, которым нужно поделиться.	Строка. По умолчанию указывается заголовок страницы, на которой размещен блок. Некоторые соцсети могут обрабатывать большие строки некорректно. Вы можете сразу указывать значения параметров контента с учетом этого или указать значения для таких соцсетей отдельно.
`data-url`	Ссылка, которой нужно поделиться.	Любой URL. По умолчанию указывается URL страницы, на которой размещен блок. Некоторые соцсети могут обрабатывать большие строки некорректно. Вы можете сразу указывать значения параметров контента с учетом этого или указать значения для таких соцсетей отдельно.