Кнопка для сайта

В разделе группы «Настройки» → «Кнопка для сайта» можно получить код кнопки для оформления подписки. Подписчики смогут оформить подписку прямо на Вашем сайте.

Код кнопки выглядит следующим образом:

<script>!window.jQuery && document.write('<script src="//code.jquery.com/jquery-3.2.1.min.js"><\/script>');</script><script src="//senler.ru/web/js/senler.js?2"></script><script type="text/javascript">try {Senler.ButtonSubscribe("senlerBtnID");} catch (e) {}</script><div id="senlerBtnID>" data-vk_group_id="111" data-subscription_id="" data-text="" data-alt_text=""></div>

где senlerBtnID - идентификатор кнопки, который должен быть уникальным для каждой кнопки в рамках страницы.

Уведомления и их использование

Кнопка поддерживает 4 уведомления:

Senler.ButtonSubscribe("senlerBtnID", {
completeCallback: function (el) {
console.log('Запрос пришел успешно');
},
cancelCallback: function (el) {
console.log('Пользователь отписался');
},
successCallback: function (el) {
console.log('Пользователь подписался');
},
errorCallback: function (el, jqXHR, textStatus, errorThrown) {
console.log('Ошибка при запросе');
}
});

Функции можно использовать для достижения целей различных метрик (Яндекс Метрика, Google Analytics и другие), например:

Senler.ButtonSubscribe("senlerBtnID", {
successCallback: function (el) {
// console.log('Пользователь подписался');
ga('send', 'event', 'Button', 'click', 'subscribe');
ym(YM_ID, 'reachGoal', 'subscribe');
}
});

где YM_ID — номер счетчика в Яндекс.Метрике, subscribe — идентификатор цели.

Собственный стиль кнопки

Определить собственный стиль кнопки подписки можно следующим образом на странице сайта:

<style>
.senler.senler-btn {
background-color: green; /* цвет фона */
font-size: 21px; /* размер шрифта */
color: #fff; /* цвет шрифта */
padding: 20px 10px; /* отступы */
}
.senler.senler-btn.senler-btn-alt {
background-color: yellow;
color: gray;
}
</style>

Полезные материалы