Thông báo
  • [Update] Blogger Của Chỉnh
    20/06/2024

    • Update tính năng chơi game trên Blog. Cực kì mới. Tính năng này vẫn đang trong giai đoạn thử nghiệm nên game hay lỗi, ít trò chơi, cái đó AD sẽ sửa sau và sẽ thông báo với mọi người qua một bài viết.
    • Sửa lỗi và bổ sung thêm thông tin cho tính năng chơi găm trên Blog.

  • [Update] Blogger Của Chỉnh
    02/06/2024

    • Update tính năng Safe link nhằm đảm bảo tất cả các khách truy cập trên Blog đểu truy cập vào các link an toàn mà Blogger Của Chỉnh chịu trách nhiệm Xem thêm.

  • [Update] Blogger Của Chỉnh
    28/05/2024

    • Update font hiển thị emoji.
    • Sửa lỗi.

  • [Update] Blogger Của Chỉnh
    29/04/2024

    • Update widget thông báo.
    • Update widget recent commnet.

Thông báo Web đang trong giai đoạn cập nhật cực lớn có thể các nội dung bị xung đột, gây ra lỗi trong quá trình sử dụng. Mong các bạn thông cảm.

Hướng dẫn tạo một trang liên hệ trên bloger/blogspot có đưa về gmail tự động

 Xin chào các bạn đã quay trở lại với Blog Của Chỉnh, hôm này mình sẽ hướng dẫn các bạn tạo trang liên hệ trên bloger/blogspot có đưa về gmail nhé.

Bài viết này có nguồn từ một blog có tiếng INDONESIA và được mình dịch thuật lại. Nếu bài đăng này mình dịch lại nó còn sơ sài hay viết sai chính tả,..v.v. Các bạn hãy comment nó xuống dưới nhé mình sẽ sửa lại. Còn bây giờ vào chủ đề chính thôi.


Phần Một: Giới Thiệu Setup Các App Hỗ Trợ

Nói sơ qua về trang liên hệ

Một trang liên hệ hoặc biểu mẫu liên hệ chắc chắn không còn xa lạ với chúng ta và tất nhiên blog / trang web trung bình đã có một trang liên hệ, để giúp khách truy cập muốn liên hệ với chúng ta dễ dàng hơn.

Bản thân Blogger đã cung cấp trang liên hệ của riêng mình mà chúng ta có thể sử dụng trên blog của mình, nhưng ở đây mình sẽ không sử dụng biểu mẫu liên hệ của Blogger. Bởi vì biểu mẫu liên hệ của blogger chỉ có thể gửi thông báo cho chủ sở hữu blog chứ không phải cho những người điền vào biểu mẫu.

Theo tiêu đề của bài đăng này, mình sẽ tạo một trang liên hệ với các thông báo email tự động, bằng cách sử dụng biểu mẫu google và tập lệnh google (google script), cách thức hoạt động để sau này sẽ có một email thông báo tự động sẽ được nhận bởi chủ sở hữu blog và người điền vào biểu mẫu liên hệ và dữ liệu của người gửi cũng được tự động đưa vào bảng tính của người tạo blog.

Và để hiển thị biểu mẫu liên hệ, bạn có thể thấy trên trang  Liên hệ của blog này cũng sử dụng biểu mẫu google, ở đây mình cần sửa đổi nó để nó trông chuyên nghiệp hơn và mình đã sử dụng một tập lệnh được chia sẻ bởi anh Adhy Suryadi với tư cách là chủ sở hữu của blog Kompi Magic

Điều quan trọng!
Nếu bạn cố gắng gửi email, bạn phải sử dụng email đang hoạt động của mình để có thể xem kết quả trả lời, nếu bạn sử dụng bất kỳ email nào, bạn sẽ không thể biết xem chuyện gì đang xảy ra.

Để trang liên hệ này hoạt đọng mình sẽ sử dụng Google Biểu Mẫu nhé.

Google biểu mẫu là gì ??

Google Form ( Google biểu mẫu ) là một ứng dụng thuộc sở hữu của Google, được thực hiện lần đầu tiên vào năm 2008 dưới dạng bảng tính cho đến nay vẫn tiếp tục phát triển thành một ứng dụng biểu mẫu trực tuyến.

google form vẫn là một đơn vị hoàn chỉnh của dịch vụ Google Drive, bên cạnh đó còn có tài liệu google, bảng tính và trang trình bày, v.v.

Google trang tính / bảng tính là gì ??

Google Sheets là một trong những tính năng của Google Drive (dịch vụ lưu trữ trực tuyến không giới hạn) được phát triển bởi công ty công nghệ Google.

Chắc hẳn hầu hết những người đi làm và sinh viên đều đã khá quen thuộc với dịch vụ Google Sheets rồi nhỉ. Để thuận tiện, dịch vụ này thường được gọi là Bảng tính (nó như kiểu excel của Microsoft vậy nhưng Google Sheets nó online).

Google Script là gì ??

Google Sheets cũng cung cấp một ngôn ngữ lập trình có tên là GAS (Google App Script).

Bản thân Google tuyên bố rằng GAS là: Google App Script là ngôn ngữ kịch bản đám mây JavaScript cung cấp khả năng tự động hóa tác vụ dễ dàng cho tất cả các sản phẩm của Google và dịch vụ của bên thứ ba.

Với Google Script chúng ta có thể làm:

  1. Menulis UDF (hàm do người dùng xác định) cho trang tính google
  2. Tạo macro ứng dụng
  3. Phát triển các ứng dụng dựa trên bảng tính
  4. Tích hợp với các Sản phẩm & Dịch vụ khác của Google
  5. Phát triển Giao diện người dùng đồ họa (GUI) chạy dưới dạng Ứng dụng web
  6. Tương tác với cơ sở dữ liệu quan hệ dựa trên đám mây thông qua Dịch vụ JDBC của Google.

Cách tạo trang liên hệ có email tự động

  1. Tạo một Biểu mẫu liên hệ trên Google Forms, nhấn vào template Biểu mẫu thông tin liên hệ mà google đã tạo
  2. Xóa hai ô: Địa chỉSố điện thoại, để im 3 ô Tên EmailGhi chú (để những ô còn lại là bắt buộc trả lời)
  3. Tiếp theo bạn hãy nhấp vào tab cài đặt ở trên cùng và ở phần cài đặt các bạn nhấn mũi tên khi nhấn vào xong một menu sổ xuống và bạn kéo xuống và tắt giới hạn ở một lần trả lời
  4. Hãy ghi nhớ ID FORM, nó rất quan trọng cho bước sau (nó ở thanh địa chỉ trên trình duyệt sau /d/...ID FORM.../)

Sau khi bạn đã hoàn thành xong bước trên bạn hãy làm theo những bước sau để thiết lập APP SCRIPTS cho Forms của bạn:

  1. Nhấp vào tab Câu trả lời ở trên cùng, sau đó nhấp vào Liên kết với trang tính
  2. Chọn bảng tính mới rồi nhấn Tạo
  3. Sau đó, một trang mới cho bảng tính mở ra, bạn cũng có thể thay đổi tên của bảng tính này từ Thông tin liên hệ (Phản hồi) thành tên bạn thích.
  4. Tiếp theo, bạn nhấp vào Tiện ích mở rộng và chọn App Script sau khi một trang mới mở ra bạn xóa hết các dòng code cũ và thay vào dòng code bên dưới.
//kịch bản email thông báo tự động với google form
function emailxacnhan(e) {
  var name=e.values[1]; //đọc email trong cột cột B
  var email=e.values[2]; //đọc cột sang cột C
  var loinhan=e.values[3]; //đọc cột D

  var subject="*Mình đã nhận được tin nhắn của bạn"; //chủ đề sẽ xuất hiện trong email của người nhận

  var message=createHTMLHeader();

  message+="<b>Xin chào "+name+"</b><br/>";
  message+="Cảm ơn bạn đã liên lạc với mình.<br/>";
  message+="Mình muốn thông báo với bạn rằng mình đã nhận được tin nhắn của bạn.<br/>";
  message+="Vui lòng chờ đợi, mình sẽ sớm trả lời tin nhắn của bạn.<br/><br/>";

  message+="Trân trọng<br/>";
  message+="Blog Của Chỉnh<br/>";
  message+="Admin blogcuachinhbeta.blogspot.com/<br/>";

  message+=createHTMLFooter();

  MailApp.sendEmail({to:email,
                     subject:subject,
                     htmlBody:message,
                     name:"BLOGGER CỦA CHỈNH" //Tên sẽ xuất hiện trong email của người nhận
                    });
}

//tập lệnh để tạo thông báo email đến email của bạn với tư cách là chủ sở hữu của biểu mẫu trực tuyến
function emailthongbao(e) {
var name=e.values[1]; //đọc email trong cột cột B
var email=e.values[2]; //đọc cột sang cột C
var loinhan=e.values[3]; //đọc cột D

  var subject="Biểu mẫu liên hệ Blog Của Chỉnh"; //Chủ để xuất hiện trong email của Admin

  var message=createHTMLHeader();

  message+="<b>Xin chào Admin</b><br/><br/>";
  message+="Vừa rồi có người gửi tin nhắn qua form liên hệ Blog Của Chỉnh<br/>";
  message+="<b>Với thông tin như sau:</b><br/>";
  message+="Tên:"+name+"<br/>"; //Ghi tên người nhận
  message+="Email:"+email+"<br/>"; //Email của người nhận
  message+="Tin nhắn:"+loinhan+"<br/>"; //Nội dung tin nhắn

  message+=createHTMLFooter();

  MailApp.sendEmail({
    to:"chinhdaumoi6a3@gmail.com",
    subject:subject,
    htmlBody:message,
    name:"Biểu mẫu liên hệ Blog Của Chỉnh"
  });
}

function createHTMLHeader(){
  var html="<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'>";
  html+="<html xmlns='https://www.w3.org/1999/xhtml'>";
  html+="<head>";
  html+="<meta http-equiv='Content-Type' content='text/html; charset=utf-8' />";
  html+="</head>";
  html+="<body>";
  return html;
}

function createHTMLFooter(){
  var html="</body>";
  html+="</html>";
  return html;
}
Hãy thay đổi từ theo ý muốn của bạn hoặc các từ mình đánh dấu thành tên blog của bạn và đừng quên thay email chinhdaumoi6a3@gmail.com thành email bạn muốn nhận tin nhắn nhé
Để thêm tin nhắn bạn hãy thêm hàm message+="thêm tin của bạn vào đây"; và sử dụng <br /> để cách hoặc nhấn Enter 
"+"name+" Lấy tên người gửi tin nhắn.
"+"email+" Lấy email người gửi tin nhắn.
"+"loinhan+" Lấy tin nhắn người gửi.

  1. Bạn hãy đổi tên của Dự án không có tiêu đề thành tên bạn muốn, miễn là bạn thích, rồi bấm vào lưu
  2. Sau đó bạn nhấn vào nút kích hoạt nó là biểu tượng đồng hồ ở bên trái, một trang mới sẽ mở ra
  3. Bạn hãy nhấp vào nút màu xanh lam ở phía dưới màn hình + Thêm trình kích hoạt và một tab được bật lên bạn chọn hàm emailxacnhan và thiết lập theo hình ảnh bên dưới và bạn nhấp vào lưu
  4. Cuối cùng, ủy quyền cho nó là xong
  5. Khi ủy quyền xong, bạn trở lại menu trước, thêm một trình kích hoạt mới giống cái trước, chỉ là lần thứ hai bạn thay đổi email xác nhận thành email thông báo (hàm của nó: emailthongbao), sau đó nhấp vào Lưu.
Cài đặt kích hoạt email xác nhận có chức năng gửi email tự động cho những người điền vào biểu mẫu.
Cài đặt kích hoạt email thông báo, nó có chức năng gửi email tự động đến chủ sở hữu blog.

Đến đây là các bạn đã xong phần một và sẽ sang bước hai là cài đặt trang liên hệ cho blog thôi. 

Vì bài này hơi dài nên mình sẽ chia trang nhé bạn hãy chuyển sang trang 2 và đọc tiếp nhé.


Phần Hai: Cách Tạo Trang Liên Hệ Cho Blogspot/Blogger Với Thông Báo Email Tự Động

Trước tiên bạn hãy quay lại trang khi vừa nãy bạn tạo trang biểu mẫu trong phần một, bạn hãy nhấp vào dấu ⋮ và nhấp vào nhận đường liên kết được điền trước 


Sau đó bạn nhấn tổ hợp phím Ctrl +  F trên bàn phím để tìm các code bên dưới và bạn phải sao chép nó vào notepad hoặc ghi nhớ nó vì code này rất quan trọng.

<style>
.post-title{display:none;}
#ss-form input:focus ~ label,
#ss-form textarea:focus ~ label,
#ss-form input:valid ~ label,
#ss-form textarea:valid ~ label {
  font-size: 0.75em;
  color: #f09800; /*Thay đổi nó bằng mã màu bạn thích*/
  top: -2.25rem;
  -webkit-transition: all 0.125s ease;
  transition: all 0.125s ease;
}
#ss-form .styled-input {
  width: 33.3333%;
  margin: 2rem 0 1rem;
  padding: 0;
  position: relative;
}
#ss-form .styled-input-in {
  position: relative;
}
#ss-form .styled-input label {
  color: #999;
  padding: 1rem;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transition: all 0.25s ease;
  transition: all 0.25s ease;
  pointer-events: none;
  line-height: 1;
  font-family: "Helvetica", "Arial", sans-serif;
}
#ss-form .styled-input.wide {
  width: 100%;
}
#ss-form input,
#ss-form textarea {
  padding: 1rem 1rem;
  border: 1px solid #ddd;
  width: 100%;
  font-size: 1rem;
  background: #fafafa;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-family: "Helvetica", "Arial", sans-serif;
}
.dark-mode #ss-form input,
.dark-mode #ss-form textarea,
.dark-mode #ss-form .btn-default{background:#505050}
#ss-form input ~ .span1,
#ss-form textarea ~ .span1 {
  display: block;
  width: 0;
  height: 3px;
  background:#f09800; /*Thay đổi nó bằng mã màu bạn thích*/
  position: absolute;
  left: 50%;
  -webkit-transition: width 0.4s ease-in-out;
  transition: width 0.4s ease-in-out;
}
#ss-form input ~ .span2,
#ss-form textarea ~ .span2 {
  display: block;
  width: 0;
  height: 3px;
  background: #f09800; /*Thay đổi nó bằng mã màu bạn thích*/
  position: absolute;
  right: 50%;
  -webkit-transition: width 0.4s ease-in-out;
  transition: width 0.4s ease-in-out;
}
#ss-form input ~ span {
  bottom: 0;
}
#ss-form input:focus,
#ss-form textarea:focus {
  outline: 0;
}
#ss-form input:focus ~ .span1,
#ss-form textarea:focus ~ .span1,
#ss-form input:focus ~ .span2,
#ss-form textarea:focus ~ .span2 {
  width: 50%;
}
#ss-form textarea {
  width: 100%;
  min-height: 15em;
}
#ss-form .btn {
  font-family: "Helvetica", "Arial", sans-serif;
  text-transform: uppercase;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 1px;
  border-radius: 3px;
  padding: 0 25px;
  height: 40px;
  line-height: 40px;
  color: #fff;
  background-color:#f09800; /*Thay đổi theo mã màu bạn thích*/
  border: 1px solid #ddd;
  cursor: pointer;
  margin: 10px 0 0;
  background-image: none;
}
.dark-mode #ss-form .btn{color:#fff}
#ss-form .btn-default:hover,
#ss-form .btn-default:focus {
  background-color: #ffae00; /*Thay đổi nó bằng mã màu bạn thích*/
  color: white;
  outline: 0;
}
#iframe_uexxnchh {
display:none;
}
@media (max-width:600px){#ss-form .styled-input {
  width: 100%;
}
}
</style>
<iframe name="iframe_uexxnchh" id="iframe_uexxnchh" onload="if(typeof sent_uexxnchh!='undefined'){window.location='/p/thanks.html';}"></iframe>
<form action="https://docs.google.com/forms/d/ĐỂ ID BIỂU MẪU CỦA BẠN VÀO ĐÂY/formResponse" method="POST" id="ss-form" target="iframe_uexxnchh" onsubmit="sent_uexxnchh=true">

<!-- CỘT TÊN -->
<div class="styled-input"> 
<div class="styled-input-in">
<input type="text" aria-label="Tên" name="entry.200562xxxx" value="" id="entry.200562xxxx" dir="auto" title="" required="required">
<label>Tên</label>
<span class="span1"></span><span class="span2"></span>
</div>
</div>
<!-- HOÀN THÀNH CỘT TÊN -->

<!-- CỘT EMAIL -->
<div class="styled-input">
<div class="styled-input-in">
<input type="email" aria-label="Email" name="entry.104578xxxx" value="" id="entry.104578xxxx" dir="auto" title="Phải là một địa chỉ email hợp lệ" required="required">
<label>Email</label>
<span class="span1"></span><span class="span2"></span>
</div>
</div>
<!-- HOÀN THÀNH CỘT EMAIL -->

<!-- CỘT BÌNH LUẬN/TIN NHẮN -->
<div class="styled-input wide">
<div class="styled-input-in">
<textarea aria-label="Komentar" name="entry.83933xxxx" rows="8" cols="0" id="entry.83933xxxx" dir="auto" aria-required="true" required="required"></textarea>
<label>Tin nhắn</label>
<span class="span1"></span><span class="span2"></span>
</div>
</div>
<!-- HOÀN THÀNH CỘT BÌNH LUẬN/TIN NHẮN-->

<!-- ĐÁP ÁN --> 
<input name="draftResponse" type="hidden" value="[null,null,&quot;53320429166xxxxxxxx&quot;]">
  <input name="pageHistory" type="hidden" value="0">
<!-- HOÀN THÀNH ĐÁP ÁN -->

<!-- NÚT GỬI -->
  <input name="fbzx" type="hidden" value="5332042916695xxxxxx">
  <button type="submit" name="submit" class="btn btn-default">Gửi</button>
</form>
<!-- HOÀN THÀNH -->

Bạn hãy thay đổi những gì mà mình đánh dấu bằng những đoạn code mà bạn đã sao chép trước đó, nếu mọi thứ đã được chỉnh sửa thì bạn hãy nhấn nút lưu.
Code p/thanks.html có chức năng chuyển hướng đến trang chứa biểu mẫu cảm ơn sau khi bạn đã gửi biểu mẫu liên hệ thành công.

Để tạo trang cảm ơn, bạn hãy tạo một trang mới và đặt tên là: Cảm ơn. Sau đó chuyển sang chế độ xem HTML. Sau đó dán đoạn code dưới đây vào sau đó lưu lại. Bạn cũng có thể thay đổi ngôn từ theo ý muốn của các bạn.

<style scoped="scoped">
.thanks_layout{text-align: center; position: fixed; top:0; left:0; bottom:0; right:0; background:rgba(0,0,0,.8);z-index:99999}
.thanks_message{width:50%;background:#fff;border-radius:5px;padding:20px;border:1px solid transparent;text-align: center; color:#333; position: absolute; top: 10%; left: 50%;margin-left:-25%;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;}
@media screen and (max-width:768px){.thanks_message{width:90%!important;margin-left:-45%!important;}
}
</style>
<div class="thanks_layout">
<div class="thanks_message">
<img alt="Thumb" height="48" width="48" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1uOADirh8vkgBRZYgQVjpLaCbaJdhM5sVHWFQdqO6w1Tv0njm2KgKL1J1MdCj2Oj6z-bLFz_kJLt5pvLZ5fPW0poTw0dfLeVcHQuBJwxHhceDVJigmXJnm8aqIzQD2vcno1UZaHZnhN9C/s1600/ic_thumb_up_black_24dp_2x.png" />
        <h2>Biểu mẫu đã được gửi thành công</h2>
        <div>Nếu không gặp trở ngại và các hoạt động khác, quản trị viên sẽ ngay lập tức phản hồi tin nhắn bạn gửi.</div><br/>
        <div><a href="https://blogcuachinh-beta.blogspot.com/" title="Trang chủ"><b>Trang chủ</b></a> hoặc Quay lại <a href="/p/contact.html" title="Biểu mẫu Liên hệ"><b>Biểu Mẫu Liên Hệ</b></a></div>
</div>
</div>
Các bạn hãy thay đổi những cái mình đánh dấu theo cách của bạn nhé
  1. thay đổi https://blogcuachinh-beta.blogspot.com/ thành địa chỉ blog của bạn .
  2. Thay đổi /p/contact.html thành địa chỉ trang liên hệ của bạn.
Đến bước này là các bạn đã hoàn thành xong Cách tạo một trang liên hệ trên blogger/blogspot có đưa về gmail rồi. Bạn đừng quên kiểm tra xem nó có gửi tin nhắn không nhé. Nếu có cái gì đó không hiểu hoặc thắc mắc ở chỗ nào đó hãy bình luận xuống dưới nhé.

Tập lệnh Google Script có logo kèm theo

//kịch bản email thông báo tự động với google form
function emailxacnhan(e) {
  var name=e.values[1]; //đọc email ở cột B
  var email=e.values[2]; //đọc cột sang cột C
  var loinhan=e.values[3]; //đọc cột D

  var subject="*Mình đã nhận được tin nhắn của bạn"; //chủ đề sẽ xuất hiện trong email của người nhận

  var message=createHTMLHeader();

  message+="<div style='margin:0.5rem 0px 1rem;padding:20px;border-width:5px 1px 1px;border-style:solid;border-color:rgb(245,145,5) rgb(221,221,221)rgb(221,221,221);font-variant-numeric:inherit;font-variant-east-asian:inherit;font-stretch:inherit;line-height:inherit;vertical-align:baseline;quotes:none;background-image:initial;background-position:initial;background-size:initial;background-repeat:initial;background-origin:initial;background-clip:initial;overflow:hidden;border-radius:5px;width:auto'><font color='#000000'><div class='brand-logo' style='text-align:center'><img style='width:100px;height:100px' src='https://i.imgur.com/rBxno66.png'/></div><br><div class='mail-body' style='width:800px;max-width:100%;margin:0 auto;box-shadow:0 20px 60px 10px rgba(0, 0, 0, 0.192);background:#fff;border-radius:7px;padding:15px;box-sizing:border-box;font-family:'Roboto';line-height:2;'><h2 style='text-align:center;'>Cảm ơn...</h2><div style='font-size:16px;color:rgba(49,53,59,0.96);line-height:1.43'>Xin chào <b>"+name+"</b></div><br/><div style='color:rgba(49,53,59,0.96);font-size:14px;font-weight:normal;line-height:1.4;margin:0 0 18px'>Cám ơn bạn đã liên lạc với mình.<br/>Mình muốn thông báo cho bạn rằng mình đã nhận được tin nhắn của bạn<br/>Xin vui lòng chờ, mình sẽ trả lời tin nhắn của bạn ngay lập tức.<br/><br/><i>Dữ liệu của bạn được đính kèm bên dưới:</i><br/><br/><div style='background:#eee;padding:10px;border-radius:7px'>Tên : "+name+" <br/><br/>Email : "+email+"<br/><br/>Lời nhắn : "+loinhan+"</div><br/>Trân trọng,<br/>Blogger Của Chỉnh | <A <a href='https://bloggercuachinhbeta.blogspot.com/'style='text-decoration:none;color:#f09800;' target='_blank'>bloggercuachinhbeta.blogspot.com</a></div>";


  message+=createHTMLFooter();

  MailApp.sendEmail({to:email,
                     subject:subject,
                     htmlBody:message,
                     name:"Blogger Của Chỉnh" //Tên sẽ xuất hiện trong email của người nhận
                    });
}

//tập lệnh để tạo thông báo qua email tới email của bạn với tư cách là chủ sở hữu biểu mẫu trực tuyến
function emailthongbao(e) {
var name=e.values[1]; //đọc email ở cột B
var email=e.values[2]; //đọc cột sang cột C
var loinhan=e.values[3]; //đọc cột D

  var subject="Biểu mẫu liên hệ Blogger Của Chỉnh"; // chủ đề sẽ xuất hiện trong email của chủ sở hữu
  var message=createHTMLHeader();

  message+="<div style='margin:0.5rem 0px 1rem;padding:20px;border-width:5px 1px 1px;border-style:solid;border-color:rgb(245,145,5) rgb(221,221,221)rgb(221,221,221);font-variant-numeric:inherit;font-variant-east-asian:inherit;font-stretch:inherit;line-height:inherit;vertical-align:baseline;quotes:none;background-image:initial;background-position:initial;background-size:initial;background-repeat:initial;background-origin:initial;background-clip:initial;overflow:hidden;border-radius:5px;width:auto'><font color='#000000'><div class='brand-logo' style='text-align:center'><img style='width:100px;height:100px' src='https://i.imgur.com/rBxno66.png'/></div><br><div class='mail-body' style='width:800px;max-width:100%;margin:0 auto;box-shadow:0 20px 60px 10px rgba(0, 0, 0, 0.192);background:#fff;border-radius:7px;padding:15px;box-sizing:border-box;font-family:'Roboto';line-height:2;'><h2 style='text-align:center;'>Có tin nhắn mới...</h2><div style='font-size:16px;color:rgba(49,53,59,0.96);line-height:1.43'>Xin chào, <b>Admin</b></div><br/><div style='color:rgba(49,53,59,0.96);font-size:14px;font-weight:normal;line-height:1.4;margin:0 0 18px'>Có một tin nhắn mới. <br/><br/><i>Kèm theo là dữ liệu của người gửi dưới đây:</i><br/><br/><div style='background:#eee;padding:10px;border-radius:7px'>Tên: "+name+" <br/><br/>Email: "+email+"<br/><br/>Lời nhắn: "+loinhan+"</div></div>";



  message+=createHTMLFooter();

  MailApp.sendEmail({
    to:"chinhdaumoi6a3@gmail.com",
    subject:subject,
    htmlBody:message,
    name:"Biểu mẫu liên hệ Blogger Của Chỉnh"
  });
}

function createHTMLHeader(){
  var html="<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'>";
  html+="<html xmlns='https://www.w3.org/1999/xhtml'>";
  html+="<head>";
  html+="<meta http-equiv='Content-Type' content='text/html; charset=utf-8' />";
  html+="</head>";
  html+="<body>";
  return html;
}

function createHTMLFooter(){
  var html="</body>";
  html+="</html>";
  return html;
}
Các bạn thay đổi mấy cái mình đánh dấu thành của bạn
  1. Thay đổi chinhdaumoi6a3@gmail.com thành mail của bạn
  2. Thay đổi https://i.imgur.com/rBxno66.png thành link ảnh logo của bạn
  3. Thay đổi link blog và tên blog mình đã đánh dấu thành của bạn
  4. Thay đổi mấy cái mã màu mà bạn thích, mình sử dụng RGB, bạn vui lòng tìm mã sau (245,145,5) sử dụng công cụ chọn màu trên blog này để lấy mã màu RGB bạn muốn dùng

Nếu bạn muốn chỉnh sửa tên và nội dung tin nhắn thì bạn hãy copy nó vào notepad / notepad++ và dùng google dịch để dịch mail ra ngôn ngữ mà bạn muốn, và dùng nó hãy nhấn Ctrl  F để tìm từ khóa cho dễ chỉnh sửa, vì tin nhắn HTML khá nhạy cảm nên không thể có khoảng cách được bạn nhé. Bạn sẽ tìm thấy một mã đính kèm


Warning!
Nếu bạn cố gắng gửi email bạn hãy sử dụng email đang hoạt động của mình để có thể xem kết quả trả lời tự động, nếu bạn sử dụng một email nào đó, bạn sẽ không biết chuyện gì đang xảy ra

Lời kết và demo

Demo

Lời kết

Đây là một bài viết được viết bằng tiếng Indonesia được mình việt hóa lại bằng google nó có thể hơi dài, nó có thể khiến cho các bạn khi đọc không hiểu ở một số chỗ bạn hãy bình luận hoặc gửi vào trang liên hệ của blog này mình phản hồi và giải đáp cho bạn. Chúc bạn thành công.

Tham khảo thêm :
Life is not fair - get used to it!
Blog được chuyển sang tên miền mới