Как создать ссылку «Нажми, чтобы подписаться» для push-уведомлений

Ищете способ создать ссылку для подписки по клику и собирать подписчиков на push-уведомления?

Мы понимаем. Иногда гораздо удобнее иметь некоторую гибкость в способах привлечения подписчиков.

Не волнуйтесь. Мы позаботились об этом.

В этой статье мы пошагово покажем вам, как создать собственную кнопку или ссылку для подписки.

Мы будем использовать PushEngage, чтобы показать вам, как это сделать.

Но не волнуйтесь, даже если вы используете другого поставщика услуг. Процесс должен быть примерно таким же. Но если вы серьезно относитесь к увеличению числа подписчиков, вам стоит попробовать PushEngage. PushEngage — это программное обеспечение для push-уведомлений №1 в мире.

Так что, если вы еще этого не сделали, начните использовать PushEngage сегодня.

Готовы? Давайте начнем.

Как создать кнопку подписки по клику с помощью PushEngage

Если вы еще не настроили PushEngage, сейчас самое подходящее время сделать это.

Шаг №1: Начните работу с PushEngage

Перейдите на главную страницу PushEngage и нажмите кнопку Начать работу:

Затем выберите бесплатный план, чтобы попробовать PushEngage, или выберите платный план, если вы серьезно относитесь к развитию своего бизнеса. Платные планы включают больше опций для кампаний и возможность создавать еще большие списки подписчиков.

Шаг №2: Скопируйте фрагмент кода

В вашей панели управления PushEngage перейдите в раздел Настройки сайта » Детали сайта и нажмите кнопку Нажмите здесь для инструкций по настройке. В разделе Любой сайт вы получите код для установки:

ВНИМАНИЕ: Вам нужно скопировать код, который вы получите из вашей панели управления. Код уникален для каждого пользователя PushEngage. Вы не сможете скопировать код с изображения и собирать подписчиков на push-уведомления.

Как только у вас появится код в панели управления PushEngage, добавьте этот фрагмент кода в свой код:

<script> window._peq = window._peq || [];</script>

Ваш итоговый код должен выглядеть примерно так:

<script src="https://clientcdn.pushengage.com/core/02a6e92667ae2279fcba8932356c1d93.js" async></script>
<script> window._peq = window._peq || [];</script>

Шаг №3: Создайте кнопку или ссылку

Как создать кнопку подписки по клику в HTML

Теперь, когда у вас есть код, большая часть сложной работы сделана. Теперь вам нужно создать кнопку, которая будет запускать ваш код при нажатии. Это то, что мы называем «событием onclick».

Чтобы создать кнопку подписки по клику, используйте этот HTML-фрагмент:

<button onclick="subscribeOnClickButton()">Subscribe</button>

Кнопка подписки может быть отличным призывом к действию над сгибом.

Вот как это будет выглядеть без какой-либо стилизации:

Игнорируйте заголовок и абзац на скриншоте. Они просто показывают, как это может выглядеть на первом экране веб-сайта. HTML-фрагмент не будет генерировать заголовок и абзац.

Конечно, вам следует стилизовать вашу кнопку с помощью CSS после вставки кода. Если вы не знаете, как стилизовать HTML-элементы, вот хороший список примеров, на которые вы можете посмотреть.

Как создать ссылку подписки по клику в HTML

Вы также можете собирать подписчиков с помощью ссылки для подписки. В этом случае вот HTML-фрагмент:

<a onclick="subscribeOnClickButton();" href="javascript:void(0)">Subscribe</a>

Это для случая, когда вы создаете гиперссылку в тексте. Это может быть очень полезно, если вы хотите вставить предложение о подписке на push-уведомления в свои сообщения в блоге.

Это должно выглядеть примерно так:

Ваш HTML-фрагмент создаст только ссылку с надписью «Подписаться». Не стесняйтесь добавить остальное содержимое, как мы сделали на изображении. Таким образом, это будет выглядеть гораздо естественнее.

И это все! Ваша ссылка готова.

Шаг № 4: Встройте код в WordPress

Готово? Давайте перейдем к остальному коду.

Теперь, если вы хотите собирать подписчиков только при нажатии кнопки, вставьте этот код:

<script>
function subscribeOnClickButton() {
window._peq.push(['subscribe']);
}
</script>

Здесь нет никаких наворотов. Просто кнопка, которая собирает подписчиков при нажатии.

Но если вы хотите что-то более продвинутое, вы также можете вывести ответ, полученный от сервера PushEngage, в консоль:

function subscribeOnClickButton(){
window._peq.push(['subscribe',{}.pe,function(res){
if(res.statuscode==1)
{
// Code to return response
console.log(res);
}
}]);
}

Если вы хотите собирать подписчиков при нажатии кнопки и затем автоматически сегментировать этих подписчиков, вы можете использовать этот код вместо этого:

function subscribeOnClickButton(){
window._peq.push(['subscribe','segment_name',function(res){
if(res.statuscode==1)
{
// Code to return response
console.log(res);
}
}]);
}

И вы закончили. Выберите любой фрагмент кода, который вам больше всего подходит, и вставьте его в HTML-код вашего веб-сайта.

Теперь, чтобы кнопка или ссылка работали, вам нужно будет вставить еще немного Javascript-кода в конец вашей страницы.

Если у вас сайт на WordPress, то самый простой способ сделать это — использовать плагин. Лучший плагин для этой задачи — плагин Insert Headers and Footers. Установите плагин (он бесплатный) и перейдите в раздел Настройки » Вставить заголовки и нижние колонтитулы:

И поместите ваш полный код в поле Скрипты в нижнем колонтитуле. Вам следует вставить код, полученный из панели управления PushEngage, а также Javascript-код, который вам нужен для правильной работы кнопки или ссылки.

Шаг № 5: Вставьте HTML-код кнопки или ссылки на ваш сайт

Наконец, вам нужно будет вставить HTML-код вашей кнопки или ссылки на ваши страницы и записи.

Если вы используете WordPress, вы можете вставлять HTML-код непосредственно в статью.

Ничего страшного, если вы никогда раньше этого не делали.

Вот статья о том, как добавить HTML-код в WordPress, с пошаговыми инструкциями.

На данном этапе мы настоятельно рекомендуем вам протестировать ваши push-уведомления, чтобы проверить, все ли работает.

Если все прошло успешно, на вашем сайте появится кнопка или ссылка, которая собирает подписчиков при нажатии. А если что-то не работает, не стесняйтесь связаться с нашей командой поддержки клиентов. Мы будем рады помочь.

Заключение

На этом всё, друзья!

После того, как вы создали кнопку «Подписаться по клику» для вашего сайта, вам следует ознакомиться с нашими правилами расширенной сегментации.

Создание детальных сегментов может помочь вам в значительной степени персонализировать ваши push-уведомления. Это означает больше вовлеченности, больше кликов и больше продаж от ваших кампаний push-уведомлений.

А если вы новичок в push-уведомлениях, вам стоит попробовать PushEngage. PushEngage предлагает одни из самых мощных и гибких кампаний push-уведомлений. Так что, если вы серьезно относитесь к развитию своего бизнеса, начните работу с PushEngage сегодня!