Jetpack là một giải pháp tuyệt vời để xây dựng danh sách người đăng ký và Intercom là giải pháp cho phép bạn quản lý người đăng ký và ở lại liên lạc với họ.
Trong hướng dẫn này, chúng tôi sẽ chỉ cho bạn cách tăng danh sách người đăng ký với Jetpack và Liên lạc.
Một số người đến hỏi tôi liệu có thể cho phép người dùng đăng ký và nhận tất cả các bài viết của họ bằng e-mail và lưu trữ địa chỉ e-mail của họ trong Liên lạc không. Tôi ngay lập tức phản hồi tích cực, đặc biệt là API (Giao diện lập trình ứng dụng) rất dễ sử dụng.
Vì vậy, tôi đã nghĩ đến việc sử dụng một plugin đăng ký, plugin này sẽ gửi địa chỉ email tới Intercom thông qua API. Và đó chính xác là những gì tôi sẽ làm.
Chúng tôi đã cài đặt Jetpack, vì vậy tất cả những gì bạn cần là kích hoạt mô-đun " Các theo dõi …Tuy nhiên, nó không đơn giản như vậy, nếu bạn muốn hiển thị hình thức ở một vị trí tùy chỉnh (trang tùy chỉnh chẳng hạn)? Chúng tôi cũng sẽ chỉ cho bạn cách tùy chỉnh vị trí của hình thức.
Các bước đầu tiên
Chúng ta sẽ bắt đầu với một hình thức nền tảng :
Không bao giờ bỏ lỡ bài viết của chúng tôi. Nhận thông tin cập nhật trong hộp thư của bạn ngay sau khi chúng được đăng.
Đối với bất kỳ ai có thể quan tâm, tôi đã thêm biểu mẫu ở đây bằng hành động " genesis_after_entry Chủ đề Genesis, nhưng nếu bạn không sử dụng Genesis, bạn có thể sử dụng bộ lọc " Nội dung Và kết hợp nội dung của bạn với nội dung của bài viết.
Trong ví dụ của chúng tôi, chúng tôi sẽ hiển thị biểu mẫu sau 3e bài viết. Nếu bạn sử dụng bộ lọc, hãy sử dụng các chức năng " ob_start "Và" ob_get_clean Để khởi tạo bộ đệm và sử dụng nội dung của nó.
toàn cầu $ bài, $ wp_query; if (is_home() && $ wp_query->bài viết[3]->ID == $ bài->ID) { bao gồm(get_stylesheet_directory()."/includes/templates/snippets/blog-archive-signup.php"); }
Dưới đây là một mã CSS để tạo kiểu mẫu.
# Blog-archive-đăng ký { chiều rộng:100% ! important; trong sáng:cả hai; } # Blog-archive-đăng ký { @ bao gồm điểm ngắt ($ viên) { lý lịch:url ( "images / bg.png-thấp") không lặp lại 0 0; cao:200px; } } # blog-archive-signup fieldset { biên giới:0; chiều rộng:100%; padding-left:50px; } # blog-archive-signup fieldset { @ bao gồm điểm ngắt (tối đa-chiều rộng $ viên) { padding-left:0px } } # blog-archive-signup legend { padding-top:20px; } # blog-archive-signup # fields-container { chiều rộng:100% } # blog-archive-signup input [name * = 'email'] { lý lịch:url ( "images /-field.png thấp") không lặp lại 0 0; đệm:0; tỷ suất lợi nhuận:0; cao:44px; biên giới:0; chiều rộng:560px; chiều cao giữa các dòng:22px; phao:trái; } # blog-archive-signup input [name * = 'email'] { @ bao gồm điểm ngắt (tối đa-chiều rộng $ viên) { đệm:0; tỷ suất lợi nhuận:0; biên giới:0; chiều rộng:50%; phao:trái; } } # blog-archive-signup input [type = 'submit'] { lý lịch:url ( "images /-button.png thấp") không lặp lại 0 0; đệm:0; tỷ suất lợi nhuận:0; cao:44px; biên giới:0; chiều rộng:180px; màu sắc: #fff; text-align:Trung tâm }
Cách thêm người đăng ký
Bây giờ chúng tôi sẽ đăng ký người dùng trên Jetpack bằng cách sử dụng " jQuery.ajax '.
$("# Blog-archive-đăng ký").trình(chức năng(e) { e.preventDefault(); $("LoadingMessage #, # failMessage").ẩn().tẩy(); là __button = $('# blog-archive-signup input [type = "submit"]').được(0); $('# blog-archive-signup input [type = "submit"]').sau khi(codeable_spinner); là __DATA = $(điều này).sắp đặt từng hàng() + '& an toàn =' + codeableVars.an ninh + '& action = blog_archive_signup'; $.gửi(codeableVars.ajaxurl,__DATA,chức năng(phản ứng) { giao diện điều khiển.đăng nhập(phản ứng); if (phản ứng.thành công) { $("#codeable_spinner").replaceWith("Thành công!").chậm trễ(5000).fadeOut('Chậm').tẩy(); } khác { $("#codeable_spinner").replaceWith(""+phản ứng.tin nhắn+"").chậm trễ(5000).fadeOut('Chậm').tẩy(); } }) })
Bây giờ chúng ta cần lưu người dùng trong Jetpack và Intercom. Tôi đã đào sâu vào mã của Jetpack để tìm hiểu cách nó thêm người đăng ký và tìm thấy lớp "Jetpack_Subscriptions" và phương thức tĩnh lấy email làm tham số. Và đối với Intercom, một yêu cầu CURL đơn giản là đủ.
add_action('Wp_ajax_landing_page_signup', 'Blog_archive_signup')); add_action('Wp_ajax_nopriv_landing_page_signup', 'Blog_archive_signup'); chức năng blog_archive_signup() { $ data = mảng( 'Email' => $ _ POST['Blog_archive_partition_email'], 'Custom_attributes' => mảng('Subscribed_via' => 'Blog_archive_partition') ); $ cuộc gọi = wswp_make_api_call($ data); $ phản ứng = mảng("Thành công"=>đúng,"Message" => "Bpa_signup"); $ đăng ký = Jetpack_Subscriptions::đăng ký($ _REQUEST[$ prefix.'_email']); delete_transient('Wpcom_subscribers_total'); stats_update_blog(); // cập nhật số người đăng ký trong wp-admin wp_send_json($ phản ứng); ra(); } chức năng wswp_make_api_call($ data) { $ curl = curl_init(); curl_setopt_array($ curl, mảng( CURLOPT_HTTPHEADER => mảng('Content-Type: application / json', 'Accept: 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($ data), CURLOPT_HEADER => sai, )); / / Lưu ý bạn sẽ cần phải đặt các hằng số id ứng dụng và api $ trở lại = json_decode(curl_exec($ curl), đúng); curl_close($ curl); trở lại $ trở lại; }
Đó là tất cả. Bây giờ khi ai đó điền vào biểu mẫu đó, họ ngay lập tức nhận được email xác nhận trên Jetpack cho biết họ đã đăng ký và họ sẽ nhận được email chứa các bài viết của bạn ngay sau khi chúng được đăng.
Đằng sau hậu trường, chúng được đăng ký trong Intercom với nhãn “Subscribe_Via => phân vùng lưu trữ blog”. Lần tới tôi sẽ cho bạn biết cách bạn cũng có thể gửi những người đăng ký plugin Thrive Leads của mình tới Intercom bằng données thông tin bổ sung sẽ cho phép bạn phân biệt tất cả.
Nếu bạn không làm chủ được tính hữu dụng của " codeableVars.security Bạn phải biết rằng nó chứa một " khâm mạng WordPress. Thông thường, điều này đã được thực hiện với chức năng php " wp_nonce_field () Trong biểu mẫu, nhưng tập lệnh chỉ chứa JavaScript, trường nonce đã có sẵn trong hàm JS " wp_localize_script () '.
Đó là tất cả những gì cần làm cho hướng dẫn này. Hãy đặt câu hỏi cho chúng tôi hoặc chia sẻ hướng dẫn với bạn bè của bạn trên các mạng xã hội yêu thích của bạn.
