ساخت لیست خود را از مشترکان با jetpack است و ارتباطی

Jetpack یک راه حل عالی برای ایجاد لیست مشترکین است و Intercom راه حلی است که به شما امکان می دهد مشترکین را مدیریت کنید و در آن بمانید. تماس با آنها.

در این آموزش به شما نشان خواهیم داد که چگونه می توانید لیست مشترکان خود را با Jetpack و Intercom افزایش دهید.

برخی از افراد به من سؤال کردند که آیا امکان دارد کاربران بتوانند کلیه مقالات خود را از طریق پست الکترونیکی مشترک و دریافت کنند و آدرسهای ایمیل خود را در Intercom ذخیره کنند. من فوراً پاسخ مثبت دادم ، خصوصاً به عنوان API (رابط کاربردی برنامه نویسی) استفاده از آن آسان است.

بنابراین به استفاده از یک افزونه اشتراک فکر کردم که آدرس ایمیل را از طریق API به Intercom ارسال می کند. و این دقیقاً همان کاری است که من انجام خواهم داد.

قبلاً Jetpack را نصب کرده بودیم ، بنابراین تنها کاری که نیاز دارید فعال کردن ماژول است " اشتراک ها ... با این حال، به این سادگی نیست، اگر بخواهید آن را نمایش دهید چه می شود فرم در یک مکان سفارشی (به عنوان مثال صفحه سفارشی)؟ ما همچنین به شما نشان خواهیم داد که چگونه می توانید مکان را سفارشی کنید فرم.

مراحل اول

ما با یک شروع خواهیم کرد فرم پایه ای :

 پستهای ما را هرگز از دست ندهید. به روزرسانی ها را به محض ارسال در صندوق پستی خود دریافت کنید. 

برای هر کسی که علاقه مند باشد ، من فرم را با استفاده از اقدام به اینجا اضافه کرده ام " genesis_after_entry موضوع Genesis ، اما اگر از Genesis استفاده نمی کنید ، می توانید از فیلتر استفاده کنید " the_content و و مطالب خود را با مطالب مقاله موافقت کرد.

در مثال ما فرم را بعد از 3 نمایش خواهیم داد^e مقاله است. اگر از فیلتر استفاده می کنید ، از توابع استفاده کنید " ob_start "و" ob_get_clean برای تنظیم اولیه بافر و استفاده از مطالب آن.

جهانی $ پست, $ wp_query; 
if (is_home() && $ wp_query->پست[3]->ID == $ پست->ID) {       
     شامل(get_stylesheet_directory()."/includes/templates/snippets/blog-archive-signup.php"); 
}

در اینجا یک کد CSS برای ظاهر شدن فرم است.

# وبلاگ آرشیو-ثبت نام { عرض:٪۱۰۰ !مهم; واضح:هر دو; } 
# وبلاگ آرشیو-ثبت نام { include breakpoint (قرص $) { زمینه:آدرس ( "تصاویر / کم bg.png") بدون تکرار 0 0; ارتفاع:200px; } } 
# وبلاگ-آرشیو ثبت نام fieldset { مرز:0; عرض:٪۱۰۰; padding چپ:50px; } 
# وبلاگ-آرشیو ثبت نام fieldset { include breakpoint (حداکثر عرض تبلت) { padding چپ:0px } } 
# افسانه ثبت نام وبلاگ-آرشیو { لایه گذاری بالا:20px; } 
# وبلاگ-بایگانی-ثبت نام # fields-container { عرض:٪۱۰۰ } 
# ورود به سیستم ثبت نام بایگانی بایگانی [نام * = 'ایمیل'] { زمینه:آدرس ( "تصاویر / کم field.png") بدون تکرار 0 0; بالشتک:0; حاشیه:0; ارتفاع:44px; مرز:0; عرض:560px; ارتفاع خط:22px; شناور:ترک کرد; } 
# ورود به سیستم ثبت نام بایگانی بایگانی [نام * = 'ایمیل'] { include breakpoint (حداکثر عرض تبلت) { بالشتک:0; حاشیه:0; مرز:0; عرض:٪۱۰۰; شناور:ترک کرد; } } 
# ورود به سیستم ثبت نام بایگانی بایگانی [نوع = 'ارسال'] { زمینه:آدرس ( "تصاویر / کم button.png") بدون تکرار 0 0; بالشتک:0; حاشیه:0; ارتفاع:44px; مرز:0; عرض:180px; رنگ: به #fff; تراز متن:مرکز }

نحوه اضافه کردن مشترکین

اکنون کاربران را با استفاده از "در Jetpack در Jetpack ثبت خواهیم کرد. jQuery.ajax '.

$("# وبلاگ آرشیو-ثبت نام").ارسال(تابع(e) { e.preventDefault(); $("LoadingMessage #، # failMessage").پنهان کردن().برداشتن(); 
      VAR __button = $(# ورودی ثبت نام ورود به وبلاگ-آرشیو [type = "submit"] ').دریافت کنید(0); $(# ورودی ثبت نام ورود به وبلاگ-آرشیو [type = "submit"] ').بعد از(codeable_spinner); 
      VAR __DATA = $(این).مرتب کردن() + "& امن =" + 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();  
  // refresh subscribers count in wp-admin  
  wp_send_json($ پاسخ); 
  خروج(); 
} 
تابع wswp_make_api_call($ داده) { 
   $ حلقه = curl_init(); curl_setopt_array($ حلقه, صف( CURLOPT_HTTPHEADER => صف('Content-Type: application / json', 'پذیرش: application / 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 with ارسال کنید données اطلاعات اضافی که به شما امکان می دهد همه آنها را تشخیص دهید.

در صورت عدم تسلط بر " codeableVars.security باید بدانید که حاوی " پیک وردپرس به طور معمول ، این کار با عملکرد php انجام می شد " wp_nonce_field () در فرم ، اما اسکریپت فقط حاوی JavaScript است ، زمینه nonce در عملکرد JS موجود است " wp_localize_script () '.

این در مورد همه چیزهایی است که باید برای این آموزش انجام شود. در صورت تمایل به ما سؤال بپرسید یا آموزش خود را با دوستان خود در شبکه های اجتماعی مورد علاقه خود به اشتراک بگذارید.