Làm Thế Nào Tạo Thông Báo Email Trên WordPress?

Chúng tôi thường xuyên được hỏi về cách tạo thông báo email hàng ngày và hàng tuần trên WordPress. Chúng tôi sử dụng tùy chọn trong biểu mẫu đăng kí email để người dùng có thể chọn chu kì thông báo theo ngày hay theo tuần. Trong bài viết này, chúng tôi sẽ hướng dẫn các bạn cách tạo thông báo email mỗi ngày và mỗi tuần trên WordPress.

tạo thông báo email

Vì sao chúng ta nên thêm tùy chọn thông báo qua email hàng ngày và hàng tuần?

Tất cả các chuyên gia marketing đều đồng ý rằng marketing qua email là cần thiết đối với bất kì trang web hay blog nào. Nó có chi phí hiệu quả và rất hấp dẫn. Hãy xem hướng dẫn của chúng tôi về cách bạn nên bắt tay vào xây dựng danh sách email ngay lập tức nhé.

Thay vì để mất những người theo dõi bởi họ đã phát ngán vì email, tốt hơn hết bạn nên cũng cấp cho họ lựa chọn theo tuần. Điều này cho phép người dùng của bạn có thể kiểm soát được tần suất nhận thông tin từ bạn cũng như khiến họ muốn theo dõi bạn hơn.

Đây là cái mà chúng ta sẽ xây dựng:

list25optin

Chú ý: Để thực hiện hướng dẫn này, bạn phải đăng ký dịch vụ marketing email nhé. Chúng tôi sử dụng MailChimp cho hướng dẫn này, tuy nhiên, về cơ bản thì cách thức đối với mọi dịch vụ email đều như nhau thôi.

Đăng nhập tài khoản và chọn mục điều hướng danh sách. Bạn sẽ thấy tập hợp các danh sách của mình. Nhấn vào Groups » View Groups.

mailchimpgroup

Bởi vì bạn chưa có một nhóm này, nên bạn sẽ thấy một màn hình như thế này. Bạn có thể nhấn vào xem video để tìm hiểu thêm về nó nhé. Để thực hiện theo hướng dẫn này, bạn cần phải nhấn vào nút Tạo Nhóm.

mailchimpgroup2

Sau khi nhấn nút đó, bạn sẽ thấy một màn hình như thế này.

mailchimpgroup

Giờ thì bạn đã nhìn thấy tùy chọn hiển thị lựa chọn nhóm trên biểu mẫu đăng kí. Bạn có thể chọn tùy chọn ô tích như chúng tôi, nút radio, trình thả xuống hoặc không hiển thị. Đối với chúng tôi, ô tích là sự lựa chọn lý tưởng. Chọn tiêu đề nhóm, sau đó thêm tùy chọn mà bạn muốn. Do chúng tôi chỉ muốn tạo thông báo Hàng ngày và Hàng tuần, chúng tôi sẽ chỉ thêm 2 tùy chọn. Hãy cứ thoải mái tạo nhãn theo ý muốn như trên trang web WPB Daily của chúng tôi nhé. Lưu nhóm và bạn đã hoàn thành bước này rồi đấy.

Bây giờ hãy cùng đi đến phần các biểu mẫu trong danh sách của chúng tôi nhé. Trở về trang Danh sách. Nhấn vào liên kết biểu mẫu:

mailchimpgroup4

Bạn sẽ thấy một trang hiển thị biểu mẫu đăng ký của bạn trông như thế nào. Đây là trình xây dựng mà bạn có thể sử dụng để tạo hình ảnh tiêu đề và hơn thế nữa. Chúng tôi đã tùy chỉnh biểu mẫu của chúng tôi, và chúng trông như thế này:

mailchimpgroup

Lý do duy nhất mà chúng ta cần phải kiểm tra thao tác này đó là xem xem ô tích đã có ở đó chưa. Sau khi xong, cuộng lên đầu trang và nhấn vào “For your Website tab” và chọn Signup Form Embed Code ( mã nhúng biểu mẫu đăng nhập).

mailchimpgroup

Bạn sẽ thấy tùy chọn tạo mã nhúng biểu mẫu. Có rất nhiều tùy chọn ở đây, nhưng chúng tôi sẽ chọn Naked Form ( Biểu mẫu trống) để có thể dễ dàng tùy biến theo cách chúng tôi muốn.

mailchimpgroup

Nếu bạn không muốn tiêu đề và các chỉ số khu vực bắt buộc của họ xuất hiện trong biểu mẫu của mình, hãy nhấn vào các ô tùy chọn thiết lập giống như ảnh chụp màn hình trên đây của chúng tôi nhé. Sau đó nhấn Create Embed Code (Tạo mã nhúng) được hiển thị cùng trang ngay dưới nút đó.

mailchimpgroup

Sao chép và dán mã này vào giao diện của bạn. Ví trí thì tùy bạn muốn nó sẽ hiển thị ở đâu trong biểu mẫu tùy chọn. Còn chúng tôi thì đặt ở thanh bên, vì vậy chúng tôi sẽ dán mã này vào tệp tin sidebar.php. Sau khi đã dán mã này, mục tiêu của chúng tôi là bỏ đi tất cả các thẻ thiết kế div. Vậy nên chúng ta hãy chỉ giữ các trường biểu mẫu cơ bản thôi nhé. Kết quả của các bạn sẽ trông giống như thế này:

<form action="http://list25.us1.list-manage.com/subscribe/post?u=549b83cc29ff23c36e5796c38&id=184bf03dd3" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank">

<input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL">

<input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button" />

<input type="checkbox" checked="checked" value="1" name="group[9][1]" id="mce-group[9]-9-0">

<label for="mce-group[9]-9-0">List25 Daily</label>

<input type="checkbox" checked="checked" value="2" name="group[9][2]" id="mce-group[9]-9-1">

<label for="mce-group[9]-9-1">List25 Weekly</label>

</form>

Hãy chú ý rằng chúng ta đã di chuyển nút submit ngay dưới chỗ email. Biểu tượng của phần email cũng đã bị bỏ nên ở đó bạn sẽ thấy một khoảng trắng. Chúng tôi cũng đá bỏ màn hình báo lỗi bởi vì tab báo thành công ổn hơn. Người dùng thường sẽ không biết phải điền gì vào phần dành cho email nên chúng tôi đã thêm chú thích. Cách tốt nhất để làm việc này là sử dụng chuỗi giá trị làm mờ (onblur).

Hãy tiếp tục và thay thế ô nhập email như thế này nhé :

<input type="text" value="Enter your email..." onblur="if (this.value == '') {this.value = 'Enter your email...';}"  onfocus="if (this.value == 'Enter your email...') {this.value = '';}" name="EMAIL" class="required email emailupdatesinput" id="mce-EMAIL" />

Mã thực hiện thao tác này bằng cách thêm dòng chữ “Enter your email…” (Nhập email của bạn…) vào ô nhập email. Tuy nhiên, khi người dùng nhấn vào ô đó để nhập email, nó sẽ tự động biến mất.

Giờ thì chúng ta đã giải quyết xong vấn đề này, hãy cùng thêm một vài thứ vào biểu mẫu của chúng ta nhé

<form action="http://list25.us1.list-manage.com/subscribe/post?u=549b83cc29ff23c36e5796c38&id=184bf03dd3" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank">

<div class="subscribe">

<input type="text" value="Enter your email..." onblur="if (this.value == '') {this.value = 'Enter your email...';}"  onfocus="if (this.value == 'Enter your email...') {this.value = '';}" name="EMAIL" class="required email emailupdatesinput" id="mce-EMAIL" />

<input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button subscribesubmitbutton" />

<div class="clear"></div>

<div class="subscribecheckboxes">

<input type="checkbox" checked="checked" value="1" name="group[9][1]" id="mce-group[9]-9-0">

<label for="mce-group[9]-9-0">List25 Daily</label>

<input type="checkbox" checked="checked" value="2" name="group[9][2]" id="mce-group[9]-9-1" class="secondcheckbox">

<label for="mce-group[9]-9-1">List25 Weekly</label>

</div>

</div>

</form>

Hãy nhớ rằng lý do duy nhất khiến chúng tôi có ProximaNovaRegular trong mã này đó là vì chúng tôi đang sử dụng phông chữ có font-face riêng. Bạn sẽ cần phải thay thế nó với phông mà bạn đang sử dụng trong giao diện của mình.

.subscribe { width: 296px; height: 38px; border: solid #bbbbbb 1px; margin: 0 0 60px 0;}

.subscribecheckboxes {margin: 20px 0 0 0; font-family: 'ProximaNovaRegular', sans-serif; font-size: 14px; color: #626262;}

.secondcheckbox {margin: 0 0 0 28px;}

.emailupdatesinput { width: 162px; height: 38px; border: none; font-family: Georgia, serif; font-size: 14px; font-style: italic; color: #949494; padding: 0 10px 0 10px; float: left;}

.subscribesubmitbutton { background: #ff370f; height: 40px; border: none; width: 115px; margin: -1px -60px 0 0; float: left; font-family: 'ProximaNovaRegular', sans-serif; font-size: 12px; color: #ffffff; text-transform: uppercase; padding: 0 1px 0 0; cursor: pointer;}

Sau khi đã tải CSS lên, kết quả cuối cùng của bạn sẽ trông như thế này:

Giờ thì bạn đã xong phần thiết kế, bạn cần phải tạo các chiến dịch trong bảng điều khiển MailChimp hay Aweber của mình cho từng nhóm khác nhau. Chúng tôi sẽ sử dụng chiến dịch RSS to Email (RSS Driven Campaigns).

Nhấn chọn mục trình đơn Campaigns, và di chuột đến nút campaign. Bạn sẽ thấy tùy chọn RSS Driven Campaign

Các bước sau đó thì khá là rõ ràng. Bạn sẽ nhập đường dẫn RSS Feed của mình, tùy chọn thời gian và chọn từng phần trong danh sách của bạn và thế là xong.

Chúng tôi hi vọng bài viết này đã giúp các bạn hiểu được cách tạo thông báo email hàng ngày cũn như hàng tuần.

Về tác giả

Duy Anh

Chào các bạn,

Mình là coder, đang sống và làm việc ở Mỹ. Mình thích viết lách nên muốn dành khoảng thời gian trống để chia sẻ các thủ thuật giúp các bạn xây dựng được trang web riêng của mình. Bạn nào cần xây dựng blog, web thì cứ ới, rảnh là mình giúp, tất cả FREE nhé!

Ý kiến cá nhân của bạn

bộ công cụ Wordpress hữu ích dành cho mọi website

Bộ công cụ hữu ích dành cho mọi website Wordpress

Bao gồm theme & plugin tốt nhất và được sử dụng nhiều nhất!

Xin vui lòng kiểm tra email để xác thực tài khoản!