Jetpack е чудесно решение за създаване на списък с абонати, а Intercom е решение, което ще ви позволи да управлявате абонатите и да останете в контакт с тях.

В този урок ще ви покажем как да увеличите списъка си с абонати с Jetpack и Интерком.

Някои хора дойдоха да ме попитат дали е възможно да се позволи на потребителите да се абонират и получават всичките им статии по електронна поща и да съхраняват своите имейл адреси в Интерком. Веднага отговорих положително, особено като API (Application Programming Interface) е лесен за използване.

Затова си помислих да използвам приставка за абонамент, която ще изпраща имейл адресите до Intercom чрез API. И точно това ще направя.

Вече имахме инсталиран Jetpack, така че всичко, което трябва, е да активирате модула " Абонаменти …Въпреки това, не е толкова просто, какво ще стане, ако искате да покажете форма в персонализирано местоположение (потребителска страница например)? Ще ви покажем също как да персонализирате къде форма.

Първи стъпки

Ще започнем с a форма основен :

 Никога не пропускайте нашите публикации. Получавайте актуализации във вашата пощенска кутия веднага щом бъдат публикувани. 

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

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

в световен мащаб $ пост, $ wp_query; 
if (is_home() && $ wp_query->мнения[3]->ID == $ пост->ID) {       
     include(get_stylesheet_directory()."/includes/templates/snippets/blog-archive-signup.php"); 
}

Тук е CSS код, за да оформят формата.

# Blog-архив се регистрира { Широчината:100% ! важно; изчисти:и двете; } 
# Blog-архив се регистрира { @ include breakpoint ($ таблетка) { фон:URL адрес ( "образи / ниско bg.png") без повторение 0 0; височина:200px; } } 
# блог-архив-регистрация поле { граница:0; Широчината:100%; вата-наляво:50px; } 
# блог-архив-регистрация поле { @ include breakpoint (макс. ширина $ таблетка) { вата-наляво:0px } } 
# блог-архив-регистрационна легенда { вата-отгоре:20px; } 
# блог-архив-регистрация # полета-контейнер { Широчината:100% } 
# вход-архив-регистрация [име * = 'имейл'] { фон:URL адрес ( "образи / ниско field.png") без повторение 0 0; подложка:0; марж:0; височина:44px; граница:0; Широчината:560px; Онлайн-височина:22px; поплавък:наляво; } 
# вход-архив-регистрация [име * = 'имейл'] { @ include breakpoint (макс. ширина $ таблетка) { подложка:0; марж:0; граница:0; Широчината:50%; поплавък:наляво; } } 
# вход-архив-регистрация [type = 'submit'] { фон:URL адрес ( "образи / ниско button.png") без повторение 0 0; подложка:0; марж:0; височина:44px; граница:0; Широчината:180px; цвят: #fff; текст-приравни:център }

Как да добавя абонати

Сега ще регистрираме потребители в Jetpack, използвайки „ jQuery.ajax ".

$("# Blog-архив се регистрира").представят(функция(e) { e.preventDefault(); $("LoadingMessage #, # failMessage").крия().премахване на(); 
      Var __button = $("блог-архив-вход за регистрация [type =" submit "] ').получавам(0); $("блог-архив-вход за регистрация [type =" submit "] ').след(codeable_spinner); 
      Var __DATA = $(това).издавам на части() + '& secure =' + codeableVars.сигурност + '& action = blog_archive_signup';   
      $.пускат(codeableVars.ajaxurl,__DATA,функция(отговор) { утеши.влезете(отговор); if (отговор.успех) { 
          $("#codeable_spinner").replaceWith("Успех!").забавяне(5000).fadeOut("Бавно").премахване на(); } още { 
          $("#codeable_spinner").replaceWith(""+отговор.съобщение+"").забавяне(5000).fadeOut("Бавно").премахване на(); 
      } 
}) 
})

Сега трябва да запазим потребителя в 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-admin  
  wp_send_json($ отговор); 
  изход(); 
} 
функция wswp_make_api_call($ данни) { 
   $ къдри = curl_init(); curl_setopt_array($ къдри, масив( CURLOPT_HTTPHEADER => масив("Тип съдържание: приложение / json", "Приемам: приложение / 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 => фалшив, )); 
   // Имайте предвид, че ще трябва да настроите ключа на правилните стойности  
  $ връщане = json_decode(curl_exec($ къдри), вярно); 
  curl_close($ къдри); 
  връщане $ връщане; 
}

Това е всичко. Сега, когато някой попълни този формуляр, той веднага получава имейл за потвърждение на Jetpack, в който се казва, че се е абонирал, и ще получи имейли с вашите статии веднага щом бъдат публикувани.

Зад кулисите те са регистрирани в Intercom с етикета „Subscribed_Via => блог архивен дял“. Следващия път ще ви кажа как можете да изпратите абонатите на плъгина Thrive Leads към Intercom с données допълнителна информация, която ще ви позволи да ги различите.

Ако не овладеете полезността на „ codeableVars.security Трябва да знаете, че съдържа „ нунций "WordPress. Обикновено това би било направено с функцията php " wp_nonce_field () Във формата, но скриптът, съдържащ само JavaScript, полето nonce вече е достъпно във функцията JS " wp_localize_script () ".

Това е всичко, което трябва да се направи за този урок. Не се колебайте да ни задавате въпроси или да споделяте урока с приятелите си в любимите си социални мрежи.

 

Тя ПИН на Pinterest