2247 lượt xem
0 bình luận

Cách sử dụng mẫu email marketing đẹp khi gửi mail

Bài viết hướng dẫn cách sử dụng các mẫu email marketing đẹp, là phần 3 trong serie 4 bài về xây dựng hệ thống gửi Email Marketing miễn phí với Google Script.

Với 2 bài vừa rồi của chủ đề này, bạn đã setup thành công một hệ thống gửi mail tự động. Lúc này, người nhận sẽ thấy một email như dưới đây:

send-email-06

Tại sao nên dùng mẫu email marketing đẹp?

Như bạn thấy, email phía trên trông khá nhôm nhựa. Mà chúng ta muốn ít ra trông nó phải thế này:

Ví dụ một mẫu email marketing đẹp

Sử dụng mẫu email marketing đẹp có mấy lợi ích:

  • Đỡ xúc phạm người nhận: đang ngồi Rolls Royce, lướt web bằng con iPhone 11 Promax mà ăn ngay quả email xấu đau xấu đớn vào mặt, có phải kém sang cái thằng người không
  • Đảm bảo nhận diện thương hiệu, nâng cao tỉ lệ chuyển đổi, trau chuốt trải nghiệm khách hàng và một số từ ngữ nguy hiểm khác.

Để làm điều này, email phải cần tới html. Bạn có thể tìm kiếm các mẫu email đẹp bằng cách vào đây search từ khóa “free email marketing html template”.

Sử dụng mẫu email marketing tìm được thế nào?

Hãy làm theo các bước sau.

Bước 1: Tạo 1 file html trong google script

Từ trình soạn thảo của Google Script, trên menu, chọn File, chọn New, chọn HTML file

send-email-08

Đặt tên cho file này là XacNhanDonHang, xóa hết nội dung mặc định đi:

send-email-09

 

Paste đoạn code sau vào phần soạn thảo, và sửa text theo ý bạn. (Việc sửa html không thuộc phạm trù bài viết này, nên mình không hướng dẫn. Nếu bạn cần hỗ trợ thì để lại comment bên dưới nhé!)

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="x-apple-disable-message-reformatting">
    <title></title>
</head>

<body width="100%" style="margin: 0; padding: 0 !important; mso-line-height-rule: exactly; background-color: #f1f1f1;">
    <center style="width: 100%; background-color: #f1f1f1;font-family: Arial, sans-serif;">
    <div style="max-width: 600px; margin: 0 auto; background: #fff;" class="email-container">
    	<!-- BEGIN BODY -->
      <table align="center" role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%" style="margin: auto;">
      	<tr>
          <td valign="top" class="bg_white" style="padding: 1em 2.5em 0 2.5em;">
          	<table role="presentation" border="0" cellpadding="0" cellspacing="0" width="100%">
          		<tr>
          			<td style="text-align: center;">
                        <h1>our-Shop</h1>
                      </td>
          		</tr>
          	</table>
          </td>
          </tr>
          <tr>
          <td valign="middle" style="padding: 3em 0 2em 0;">
            <img src="http://fang.badao.vn/wp-content/uploads/2020/08/email.png" alt="" style="width: 150px; max-width: 600px; height: auto; margin: auto; display: block;">
          </td>
          </tr><!-- end tr -->
                <tr>
          <td valign="middle" style="padding: 1em 0 1em 0;">
            <table style="width: 100%;">
            	<tr>
            		<td>
            			<div style="padding: 0 2.5em; text-align: center;">
            				<h2>Xác nhận đơn hàng</h2>
            				<h3>Chào [tenkhachhang]!</h3>
                    <p style="text-align: left;letter-spacing: -1px;font-size: 17px;">Chúng tôi đã nhận được đơn đặt hàng của bạn.</p>
                    <p style="text-align: left;letter-spacing: -1px;font-size: 17px;">
                      Sản phẩm:<br>
                      <a href="[linksanpham]" style="font-weight: 600;text-decoration: none;">  
                        [tensanpham] - [giasanpham]<sup>đ</sup>
                      </a>
                    </p>
                    <p>Shop sẽ giao hàng cho bạn trong thời gian sớm nhất.</p>
                    <p>Cám ơn bạn đã đồng hành cùng shop.</p>
            			</div>
            		</td>
            	</tr>
            </table>
          </td>
          </tr><!-- end tr -->
      <!-- 1 Column Text + Button : END -->
      </table>
      <table align="center" role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%" style="margin: auto;">
      	<tr>
          <td valign="middle">
            <table style="margin-left: 20px;display: block;margin-right: 20px;">
            	<tr>
                <td valign="top" width="33.333%" style="padding-top: 20px;">
                  <table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
                    <tr>
                      <td style="text-align: left; padding-right: 10px;">
                      	<h3 class="heading">Giới thiệu</h3>
                      	<p>ourShop - thời trang chính hãng. Bảo hành 05 năm, cam kết hoàn tiền</p>
                      </td>
                    </tr>
                  </table>
                </td>
                <td valign="top" width="33.333%" style="padding-top: 20px;">
                  <table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
                    <tr>
                      <td style="text-align: left; padding-left: 5px; padding-right: 5px;">
                      	<h3 class="heading">Liên hệ</h3>
                      	<ul>
                                    <li><span class="text">Tầng 10, tòa nhà XYZ, đường ABC, phường JQK</span></li>
                                    <li><span class="text">+1 234 56789</span></a></li>
                                  </ul>
                      </td>
                    </tr>
                  </table>
                </td>
                <td valign="top" width="33.333%" style="padding-top: 20px;">
                  <table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
                    <tr>
                      <td style="text-align: left; padding-left: 10px;">
                      	<h3 class="heading">Links</h3>
                      	<ul>
                                    <li><a href="#" style="text-decoration: none;">Website</a></li>
                                    <li><a href="#" style="text-decoration: none;">Facebook</a></li>
                                    <li><a href="#" style="text-decoration: none;">Pinterest</a></li>
                                  </ul>
                      </td>
                    </tr>
                  </table>
                </td>
              </tr>
            </table>
          </td>
        </tr><!-- end: tr -->
        <tr>
          <td class="bg_light" style="text-align: center;">
          	<p>Chúc bạn có một ngày vui vẻ. Trân trọng!</p>
          </td>
        </tr>
      </table>

    </div>
  </center>
</body>
</html>

Sau đó, update lại một chút google script

function getEmail(){
  var file_id = '1g_Pmr1TSoXRx5W9r-TNBW_ye709YRnWeD2xRtocwkas'; //Thay ID file của bạn vào đây
  var sheet_name = 'Aug'; //Một file google sheet có nhiều sheet con. Thay tên sheet vào đây
  var customerList = SpreadsheetApp.openById(file_id).getSheetByName(sheet_name); //Khai báo sheet
  var lastRow = customerList.getLastRow(); //Tìm dòng cuối cùng
  for(var i = 2; i <= lastRow; i++){ //Tạo vòng lặp với i là số thứ tự của dòng, bắt đầu từ 2 vì dòng 1 là header
    var tenKhachHang = customerList.getRange('B' + i).getValue(); //Lấy giá trị tên khách hàng ở cột B
    var emailKhachHang = customerList.getRange('C' + i).getValue(); //Lấy giá trị email khách hàng ở cột C
    var tenSanPham = customerList.getRange('D' + i).getValue(); //Lấy tên sản phẩm ở cột D
    var linkSanPham = customerList.getRange('E' + i).getValue(); //Lấy link sản phẩm ở cột E
    var giaSanPham = customerList.getRange('F' + i).getValue(); //Lấy giá sản phẩm ở cột F
    var tieudeThu = 'Xác nhận đơn hàng - Sản phẩm ' + tenSanPham;
    var status = customerList.getRange('G' + i).getValue(); //Kiểm tra cột G, xem khách này gửi thư hay chưa
    var htmlBody = HtmlService.createHtmlOutputFromFile('XacNhanDonHang').getContent();
    var noidungThu = htmlBody.replace("[tenkhachhang]", tenKhachHang).replace("[linksanpham]", linkSanPham).replace("[giasanpham]", giaSanPham).replace("[tensanpham]", tenSanPham);
    
    if(status !== 'Đã gửi'){
      //GmailApp.sendEmail(emailKhachHang,tieudeThu,noidungThu);
      MailApp.sendEmail({
        to: emailKhachHang,
        subject: tieudeThu,
        htmlBody: noidungThu,
      });
      customerList.getRange("G"+i).setValue('Đã gửi');
    }
  }
}

Vậy là bạn đã hoàn tất hệ thống gửi mail xác nhận tự động bằng Google Script. Hẹn bạn trong bài viết sau: Tự động gửi mail chúc mừng sinh nhật bằng Google Script.

 

Đọc đầy đủ chủ đề này:

Bài viết khác
How to disable email field in OptinMonster

How to disable email field in OptinMonster

Bởi Fang.2F
October 22, 2021 · 1 phút đọc

Gửi Email Marketing miễn phí từ Google Sheet

Gửi Email Marketing miễn phí từ Google Sheet

Bởi Fang.2F
August 26, 2020 · 1 phút đọc