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 () ".
이 튜토리얼에서해야 할 모든 것입니다. 즐겨 사용하는 소셜 네트워크에서 친구에게 질문을하거나 튜토리얼을 공유하십시오.