Nếu bạn nghiện email, đặc biệt là email dành cho doanh nghiệp, thì từ hướng dẫn này, bạn sẽ từng bước tìm hiểu cách tạo chữ ký email HTML cho iPhone hoặc iPad.
Chữ ký email doanh nghiệp HTML phải bao gồm: tên, chức vụ của bạn trong tổ chức, tên công ty, logo công ty, chi tiết liên hệ của bạn và công ty (điện thoại, email, địa chỉ web).
Trong hầu hết các ứng dụng email như Outlook, chữ ký HTML được thêm bằng cách chèn mã HTML trong trường chữ ký. Vì iPhone hoặc iPad hơi khác một chút, nhưng trong cả hai trường hợp, bạn đều cần chữ ký HTML.
Nội dung
Cách tạo chữ ký email HTML cho iPhone hoặc iPad
Như tôi đã nói ở trên, trước tiên bạn cần tạo chữ ký HTML (nếu bạn đã có chữ ký này, bạn có thể bỏ qua phần hướng dẫn này).
Tạo chữ ký HTML
Trong ví dụ của tôi, tôi đã làm một Chữ ký email HTML cho iPhone một cái gì đó đơn giản hơn, bao gồm: hình ảnh (hoặc logo công ty), các biểu tượng mạng xã hội có liên kết, tên và họ, chức năng, số điện thoại, địa chỉ email và địa chỉ web.
Nếu bạn muốn bắt đầu từ đây model của chữ ký, mã HTML như sau:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Email Signature</title>
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Montserrat">
<style type="text/css">
img { outline: none; text-decoration: none; border: none; }
p { margin: 0px !important; }
a { color: #000 !important; text-decoration:none !important; }
@media only screen and (max-width: 480px) {
.heading-one {
font-size:16px !important;
line-height:18px !important;
}
.heading-two {
font-size:12px !important;
line-height:14px !important;
}
.paragraph {
font-size:10px !important;
line-height:11px !important;
}
}
href>a { color:#000; text-decoration: none !important; text-decoration: none; }
</style>
</head>
<body>
<!-- EDIT BELOW IF YOU AREN'T OUTLOOK USER -->
<!--[if !mso]><!-->
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td valign="top" style="display:inline-block; min-width:100px; max-width:100px; padding-right: 20px; padding-bottom: 10px;"><table width="80" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td style="display: block; height: 100px; text-align: center;"><img src="img/model.jpg" width="100" height="100" alt=""/></td>
</tr>
<tr>
<td style="background: #305dbf; padding-top: 10px; padding-bottom: 10px; text-align: center;"><table border="0" align="center" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="padding-right: 15px;"><a href="http://www.facebook.com/" target="_blank"><img src="img/icon-facebook-0.png" width="12" height="12" alt=""/></a></td>
<td style="padding-right: 15px;"><a href="http://www.twitter.com/" target="_blank"><img src="img/icon-twitter-0.png" width="12" height="12" alt=""/></a></td>
<td><a href="http://www.linkedin.com/" target="_blank"><img src="img/icon-linkedin-0.png" width="12" height="12" alt=""/></a></td>
</tr>
</tbody>
</table></td>
</tr>
</tbody>
</table></td>
<td valign="top" style="display:inline-block; min-width:300px; max-width:400px;"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td style="padding-bottom: 10px;"><span class="heading-one" style="font-family:'Montserrat', Arial, sans-serif; font-size:16px; line-height:18px; font-weight:600; color:#000; text-transform:uppercase;">John Doe</span><br><span class="heading-two" style="font-family:'Montserrat', Arial, sans-serif; font-size:14px; line-height:16px; font-weight:500; color:#000; text-transform:capitalize;">Creative Director</span></td>
</tr>
<tr>
<td style="padding-bottom: 7px;"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td width="16" style="padding-right: 5px;"><img src="img/icon-phone-10.png" width="16" height="16" alt=""/></td>
<td><span class="paragraph" style="font-family:'Montserrat', Arial, sans-serif; font-size:12px; line-height:14px; font-weight:400; color:#000;">858-272-3400</span></td>
</tr>
</tbody>
</table></td>
</tr>
<tr>
<td style="padding-bottom: 7px;"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td width="16" style="padding-right: 5px;"><img src="img/icon-email-10.png" width="16" height="16" alt=""/></td>
<td><a href="mailto:youremail@domain.com" target="_blank" style="color:#000; text-decoration: none !important; text-decoration: none;"><span class="paragraph" style="font-family:'Montserrat', Arial, sans-serif; font-size:12px; line-height:14px; font-weight:400; color:#000;">hi@website.com</span></a></td>
</tr>
</tbody>
</table></td>
</tr>
<tr>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td width="16" style="padding-right: 5px;"><img src="img/icon-website-10.png" width="16" height="16" alt=""/></td>
<td><a href="http://www.yourwebsite.com" target="_blank" style="color:#000; text-decoration: none !important; text-decoration: none;"><span class="paragraph" style="font-family:'Montserrat', Arial, sans-serif; font-size:12px; line-height:14px; font-weight:400; color:#000;">www.website.com</span></a></td>
</tr>
</tbody>
</table></td>
</tr>
</tbody>
</table></td>
</tr>
</tbody>
</table>
<!--<![endif]-->
<!-- EDIT BELOW IF YOU ARE OUTLOOK USER -->
<!--[if mso]>
<table border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td width="100" valign="top" style="padding-right: 20px; padding-bottom: 10px;"><table width="80" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td style="display: block; height: 100px; text-align: center;"><img src="img/model.jpg" width="100" height="100" alt=""/></td>
</tr>
<tr>
<td style="background: #305dbf; padding-top: 10px; padding-bottom: 10px; text-align: center;"><table border="0" align="center" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="padding-right: 15px;"><a href="http://www.facebook.com/" target="_blank"><img src="img/icon-facebook-0.png" width="12" height="12" alt=""/></a></td>
<td style="padding-right: 15px;"><a href="http://www.twitter.com/" target="_blank"><img src="img/icon-twitter-0.png" width="12" height="12" alt=""/></a></td>
<td><a href="http://www.linkedin.com/" target="_blank"><img src="img/icon-linkedin-0.png" width="12" height="12" alt=""/></a></td>
</tr>
</tbody>
</table></td>
</tr>
</tbody>
</table></td>
<td width="400" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td style="padding-bottom: 10px;"><span class="heading-one" style="font-family:'Montserrat', Arial, sans-serif; font-size:16px; line-height:18px; font-weight:600; color:#000; text-transform:uppercase;"><font face="'Montserrat', Arial, sans-serif !important;">John Doe</font></span><br><span class="heading-two" style="font-family:'Montserrat', Arial, sans-serif; font-size:14px; line-height:16px; font-weight:500; color:#000; text-transform:capitalize;"><font face="'Montserrat', Arial, sans-serif !important;">Creative Director</font></span></td>
</tr>
<tr>
<td style="padding-bottom: 7px;"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td width="16" style="padding-right: 5px;"><img src="img/icon-phone-10.png" width="16" height="16" alt=""/></td>
<td><span class="paragraph" style="font-family:'Montserrat', Arial, sans-serif; font-size:12px; line-height:14px; font-weight:400; color:#000;"><font face="'Montserrat', Arial, sans-serif !important;">858-272-3400</font></span></td>
</tr>
</tbody>
</table></td>
</tr>
<tr>
<td style="padding-bottom: 7px;"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td width="16" style="padding-right: 5px;"><img src="img/icon-email-10.png" width="16" height="16" alt=""/></td>
<td><a href="mailto:youremail@domain.com" target="_blank" style="color:#000; text-decoration: none !important; text-decoration: none;"><span class="paragraph" style="font-family:'Montserrat', Arial, sans-serif; font-size:12px; line-height:14px; font-weight:400; color:#000;"><font face="'Montserrat', Arial, sans-serif !important;">hi@website.com</font></span></a></td>
</tr>
</tbody>
</table></td>
</tr>
<tr>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td width="16" style="padding-right: 5px;"><img src="img/icon-website-10.png" width="16" height="16" alt=""/></td>
<td><a href="http://www.yourwebsite.com" target="_blank" style="color:#000; text-decoration: none !important; text-decoration: none;"><span class="paragraph" style="font-family:'Montserrat', Arial, sans-serif; font-size:12px; line-height:14px; font-weight:400; color:#000;"><font face="'Montserrat', Arial, sans-serif !important;">www.website.com</font></span></a></td>
</tr>
</tbody>
</table></td>
</tr>
</tbody>
</table></td>
</tr>
</tbody>
</table>
<![endif]-->
</body>
</html>Đơn giản nhất là tạo một thư mục cho chữ ký. Bạn sao chép mã này vào trình soạn thảo văn bản hoặc HTML, sau đó sửa đổi mã đó cùng với dữ liệu của bạn. Cuối cùng, bạn lưu nó với phần mở rộng .html.
Bên cạnh tệp HTML bạn tạo thư mục img trong đó bạn bao gồm các yếu tố đồ họa. Hình ảnh và biểu tượng. Bạn xác định các yếu tố này trong mã HTML của mình. Ví dụ: <img src="img/icon-email-10.png".../>.
Sau khi bạn đã tùy chỉnh chữ ký của mình, hãy mở tệp HTML trong trình duyệt của bạn. Kết quả sẽ giống với hình ảnh ở phần đầu của hướng dẫn.
Cách thêm chữ ký HTML cho iPhone hoặc iPad
Để người nhận có thể mở và đọc được chữ ký, chữ ký đó phải được lưu trữ trên máy chủ hoặc dịch vụ web cloud cho phép bạn tải lên các tệp HTML và đồ họa.
Tôi đặt chữ ký của tôi trên Địa chỉ web.
Sau khi chữ ký HTML đã được tạo và có sẵn trực tuyến, bước tiếp theo là thêm chữ ký HTML vào tài khoản email trên thiết bị của bạn iPhone hoặc iPad.
Hướng dẫn dành cho các tài khoản email được thêm vào ứng dụng Mail có mặt trên tất cả các thiết bị iPhone, iPad, Mac.
1. Mở "Settings" sau đó di chuyển đến "Mail".
2. Trong các tùy chọn "Mail"mở"Signature".
2. Mở liên kết web mà bạn có chữ ký và sao chép tất cả nội dung. Bạn có thể làm điều này từ Safari trên các thiết bị iPhone hoặc iPad. Với chức năng Handoff (Universal Clipboard) được bật, bạn có thể sao chép chữ ký HTML từ máy tính của mình Mac hoặc MacSách.
3. Quay lại “Signature” và dán (paste) nội dung được sao chép.
Sau bước này, có thể nói bạn đã học cách tạo và thêm chữ ký email HTML cho iPhone hoặc iPad.
Liên quan: Cách tạo chữ ký HTML bằng hình ảnh cho Outlook
Đừng lo lắng nếu bạn nhận thấy rằng ở điểm 3, văn bản không rõ ràng. Màu nền sẽ được sao chép từ nguồn chữ ký HTML. Vì vậy, nếu người nhận đặt giao diện email thành chủ đề "tối", thư của bạn sẽ đến với nền trắng.
