Jetpack은 구독자 목록을 작성하기 위한 훌륭한 솔루션이며 Intercom은 구독자를 관리하고 CONTACT 그들과 함께.

이 튜토리얼에서는 Jetpack 및 Intercom으로 가입자 목록을 늘리는 방법을 보여줍니다.

어떤 사람들은 사용자가 전자 우편으로 모든 기사를 구독 및 수신하고 전자 우편 주소를 인터콤에 저장할 수 있는지 묻습니다. 특히 API로 긍정적 인 반응을 보였습니다 (응용 프로그램 프로그래밍 인터페이스)는 사용하기 쉽습니다.

그래서 저는 API를 통해 인터콤에 이메일 주소를 보내는 구독 플러그인을 사용하는 것에 대해 생각했습니다. 그리고 그것이 바로 제가 할 일입니다.

이미 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입니다.

# 블로그 아카이브-가입 { :100% ! 중요; 선명한:; } 
# 블로그 아카이브-가입 { @include 중단 점 ($ 태블릿) { 배경:URL ( "이미지 / 저 bg.png") 0 0을 노 반복하지; 신장:200px; } } 
# 블로그 아카이브-가입 FIELDSET { 경계:0; :100%; 패딩 왼쪽:50px; } 
# 블로그 아카이브-가입 FIELDSET { @include 중단 점 (최대 폭 $ 태블릿) { 패딩 왼쪽:0px } } 
# 블로그 아카이브-가입 전설 { 패딩 탑:20px; } 
# 블로그 아카이브 - 가입 필드 컨테이너 # { :100% } 
# 블로그 아카이브-가입 입력 [이름 * = '이메일'] { 배경:URL ( "이미지 / 저 field.png") 0 0을 노 반복하지; 메워 넣기:0; 한계:0; 신장:44px; 경계:0; :560px; 라인 높이:22px; 뜨다:왼쪽 (left); } 
# 블로그 아카이브-가입 입력 [이름 * = '이메일'] { @include 중단 점 (최대 폭 $ 태블릿) { 메워 넣기:0; 한계:0; 경계:0; :50%; 뜨다:왼쪽 (left); } } 
# 블로그 아카이브-가입 입력 [유형 = '제출'] { 배경:URL ( "이미지 / 저 button.png") 0 0을 노 반복하지; 메워 넣기:0; 한계:0; 신장:44px; 경계:0; :180px; : #fff; 텍스트 정렬:센터 }

구독자를 추가하는 방법

이제 "를 사용하여 Jetpack에 사용자를 등록합니다 jQuery.ajax ".

$("# 블로그 아카이브-가입").제출(기능(e) { e.로 preventDefault(); $("LoadingMessage #, #의 failMessage").숨기기().제거(); 
      였다 __button = $('# 블로그 아카이브-가입 입력 [유형 = "제출"]).얻을(0); $('# 블로그 아카이브-가입 입력 [유형 = "제출"]).시간 내에(codeable_spinner); 
      였다 __DATA = $().직렬화() + '& 보안 =' + codeableVars.보안 + '& 액션 = 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 => 정렬('콘텐츠 유형 : 응용 프로그램 / 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 => 그릇된, )); 
   // 당신은 적절한 값으로 앱 ID와 API 키에 대한 상수를 설정해야합니다 참고  
  $ 반환 = json_decode(curl_exec($ 컬), 참된); 
  curl_close($ 컬); 
  return $ 반환; 
}

그게 다야. 이제 누군가 해당 양식을 작성하면 즉시 Jetpack에서 구독했다는 확인 이메일을 받고 기사가 게시되는 즉시 이메일을 받게됩니다.

내부적으로 Intercom에 "Subscribed_Via => 블로그 아카이브 파티션"이라는 레이블로 등록되어 있습니다. 다음 번에는 Thrive Leads 플러그인 구독자를 Intercom으로 보낼 수 있는 방법을 알려드리겠습니다. données 모두 구별할 수 있는 추가 정보입니다.

"의 유용성을 마스터하지 않으면 codeableVars.security 당신은 " 로마 교황 사절 워드 프레스. 일반적으로 이것은 PHP 함수 " wp_nonce_field () 자바 스크립트 만 포함하는 스크립트 형식의 nonce 필드는 이미 JS 함수에서 사용할 수 있습니다. wp_localize_script () ".

이 튜토리얼에서해야 할 모든 것입니다. 즐겨 사용하는 소셜 네트워크에서 친구에게 질문을하거나 튜토리얼을 공유하십시오.