Пропустить

Создайте свой список абонентов с Jetpack и Интерком

Divi: самая простая тема WordPress для использования

Divi: Лучшая тема WordPress всех времен!

Более Загрузка 701.000, Divi - самая популярная тема WordPress в мире. Он является полным, простым в использовании и поставляется с более чем бесплатными шаблонами 62. [Рекомендуется]

Jetpack - отличное решение для создания списка подписчиков, а Intercom - это решение, которое позволит вам управлять подписчиками и поддерживать с ними связь.

В этом уроке мы покажем вам, как увеличить список подписчиков с помощью Jetpack и Intercom.

Некоторые люди пришли спросить меня, можно ли разрешить пользователям подписываться и получать все свои статьи по электронной почте, а также сохранять свои адреса электронной почты в Интерком. Я сразу ответил положительно, особенно по API (Интерфейс прикладного программирования) прост в использовании.

Поэтому я подумал об использовании плагина подписки, который будет отправлять адреса электронной почты в Intercom через API. И это именно то, что я сделаю.

У нас уже был установлен Jetpack, поэтому все, что вам нужно, это активировать модуль " Подписки "... Однако это не так просто, что если вы хотите отобразить форму в произвольном месте (настраиваемая страница, например)? Мы также покажем вам, как настроить, где будет отображаться форма.

первые шаги

Начнем с базовой формы:

Легко создайте свой сайт с Elementor

Elementor позволяет легко создать любой дизайн сайта с профессиональным дизайном. Прекратите платить дорого за то, что вы можете сделать сами. [Free]

 Никогда не пропустите наши сообщения. Получайте обновления в свой почтовый ящик, как только они будут опубликованы. 

Для всех, кому может быть интересно, я добавил форму здесь, используя действие " genesis_after_entry Тема Genesis, но если вы не используете Genesis, вы можете использовать фильтр " the_content И связал ваш контент с содержанием статьи.

В нашем примере мы отобразим форму после 3e статья. Если вы используете фильтр, используйте функции " ob_start "А также" ob_get_clean Инициализировать буфер и использовать его содержимое.

Вы ищете лучшие темы и плагины WordPress?

Загрузите лучшие плагины и темы WordPress на Envato и легко создайте свой сайт. Уже больше, чем 49.720.000. [ЭКСКЛЮЗИВ]

Глобальный $ пост, $ WP_Query; 
if (is_home() && $ WP_Query->сообщений[3]->ID == $ пост->ID) {       
     включают(get_stylesheet_directory()."/includes/templates/snippets/blog-archive-signup.php"); 
}

Вот CSS для стилизации формы.

# Блог-архив-подключения { ширина:100% важно!; Очистить:и то и другое; } 
# Блог-архив-подключения { @include точки останова ($ Tablet) { фон:URL ( "изображения / низкий bg.png") нет-Повторяю 0 0; высота:200px; } } 
# Блог-архив-регистрация FIELDSET { граница:0; ширина:100%; обивка левый:50px; } 
# Блог-архив-регистрация FIELDSET { @include точки останова (макс ширина таблетки $) { обивка левый:0px } } 
# Блог-архив-легенда подключений { обивка-топ:20px; } 
# Блог-архив-Signup поля Container # { ширина:100% } 
# Вход Блог-архив-подключения [имя * = 'электронная почта'] { фон:URL ( "изображения / низкий field.png") нет-Повторяю 0 0; набивка:0; маржа:0; высота:44px; граница:0; ширина:560px; Высота строки:22px; плавать:оставил; } 
# Вход Блог-архив-подключения [имя * = 'электронная почта'] { @include точки останова (макс ширина таблетки $) { набивка:0; маржа:0; граница:0; ширина:50%; плавать:оставил; } } 
вход # Блог-архив-подключений [тип = «Отправить»] { фон:URL ( "изображения / низкий button.png") нет-Повторяю 0 0; набивка:0; маржа:0; высота:44px; граница:0; ширина:180px; цвет: #fff; выравнивания текста:центр }

Как добавить подписчиков

Теперь мы будем регистрировать пользователей на Jetpack, используя " jQuery.ajax .

$(«# Блог-архив-подключения»).отправить(функция(e) { e.preventDefault(); $("LoadingMessage #, # failMessage").скрывать().удаление(); 
      вар __button = $('# Блог-архив-подключений ввода [тип = „отправить“]).получить(0); $('# Блог-архив-подключений ввода [тип = „отправить“]).после(codeable_spinner); 
      вар __DATA = $(это).сериализации() + '& secure =' + codeableVars.безопасность + '& action = blog_archive_signup';   
      $.после(codeableVars.ajaxurl,__DATA,функция(ответ) { консоль.журнал(ответ); if (ответ.успех) { 
          $("#codeable_spinner").ReplaceWith(«Успех!»).задерживать(5000).Затухание(«Медленный»).удаление(); } еще { 
          $("#codeable_spinner").ReplaceWith(""+ответ.сообщение+"").задерживать(5000).Затухание(«Медленный»).удаление(); 
      } 
}) 
})

Теперь нам нужно сохранить пользователя в Jetpack и Intercom. Я углубился в код Jetpack, чтобы узнать, как он добавляет подписчиков, и нашел класс Jetpack_Subscriptions и статический метод, который принимает электронную почту в качестве параметра. А для Intercom достаточно простого запроса CURL.

add_action('Wp_ajax_landing_page_signup', 'Blog_archive_signup')); 
add_action('Wp_ajax_nopriv_landing_page_signup', 'Blog_archive_signup'); 
функция blog_archive_signup() { 
  $ Данных = массив( «Электронная почта» => $ _POST['Blog_archive_partition_email'], 'Custom_attributes' => массив('Subscribed_via' => 'Blog_archive_partition') ); 
  $ вызова = wswp_make_api_call($ Данных); 
  $ ответ = массив(«Успех»=>правда,«Сообщение» => "Bpa_signup"); 
  $ подписаться = Jetpack_Subscriptions::подписаться($ _REQUEST[префикс $.'_email']); 
  delete_transient('Wpcom_subscribers_total'); 
  stats_update_blog();  
  кол // обновляем подписчиков в Wp-администратора  
  wp_send_json($ ответ); 
  выход(); 
} 
функция wswp_make_api_call($ Данных) { 
   $ завиток = curl_init(); curl_setopt_array($ завиток, массив( CURLOPT_HTTPHEADER => массив('Content-Type: применение / JSON', 'Accept: приложения / JSON'), CURLOPT_RETURNTRANSFER => 1, CURLOPT_URL => 'Https://api.intercom.io/users', CURLOPT_POST => 1, CURLOPT_USERPWD => INTERCOM_APP_ID . «» . INTERCOM_API_KEY, CURLOPT_POSTFIELDS => json_encode($ Данных), CURLOPT_HEADER => ложный, )); 
   // Обратите внимание, что вам нужно будет установить константу для приложения идентификатор и ключ API для собственных значений  
  $ Вернуться = json_decode(curl_exec($ завиток), правда); 
  curl_close($ завиток); 
  возвращение $ Вернуться; 
}

Вот и все. Теперь, когда кто-то заполняет эту форму, они сразу получают электронное письмо с подтверждением на Jetpack, в котором говорится, что они подписались, и они будут получать электронные письма с вашими статьями, как только они будут опубликованы.

Незаметно они зарегистрированы в Intercom с меткой «Subscribed_Via => раздел архива блога». В следующий раз я расскажу вам, как вы также можете отправить подписчиков вашего плагина Thrive Leads в Intercom с дополнительными данными, которые помогут вам их всех отличить.

Если вы не освоите полезность " codeableVars.security Вы должны знать, что он содержит " нунций «WordPress. Обычно это можно было бы сделать с помощью функции php wp_nonce_field () В форме, но в скрипте, содержащем только JavaScript, поле nonce уже доступно в функции JS " wp_localize_script () .

Легко создайте свой интернет-магазин

Загрузите бесплатные WooCommerce, лучшие плагины для электронной коммерции, чтобы продавать свои физические и цифровые продукты в WordPress. [Рекомендуется]

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

 

Эта статья содержит комментарии 0

Оставить комментарий

Ваш электронный адрес не будет опубликован. Обязательные для заполнения поля помечены *

Этот сайт использует Akismet для уменьшения нежелательности. Узнайте больше о том, как используются ваши комментарии.

Вверх
10 акции
доля10
чирикать
Регистрация