วิธีสร้างลิงก์ "เพิ่มในปฏิทิน" สำหรับอีเมลของคุณ

เผยแพร่แล้ว: 2021-02-05

กิจกรรมแบบตัวต่อตัวหรือเสมือนจริงเกี่ยวกับการทำความรู้จักกับผู้อื่นและเรียนรู้จากกันและกัน เนื่องจากอีเมลเป็นช่องทางส่วนตัว จึงเป็นสื่อในอุดมคติในการสร้างความตื่นเต้นให้กับกิจกรรมและส่งการแจ้งเตือน

เพื่อให้แน่ใจว่าผู้เข้าร่วมจะปรากฏจริง การรวมลิงก์ "เพิ่มในปฏิทิน" ไว้ในอีเมลกิจกรรมของคุณอาจเป็นประโยชน์ ด้วยเหตุนี้ สมาชิกจึงสามารถเพิ่มกิจกรรมในปฏิทินของตนเองได้ ทำให้ง่ายต่อการหลีกเลี่ยงความขัดแย้งในปฏิทิน และอนุญาตให้ตั้งค่าการเตือนความจำของตนเองได้

ตามเนื้อผ้า จะใช้ไฟล์ ICS หรือที่เรียกว่า iCalendar นี่เป็นรูปแบบปฏิทินทั่วไปที่มักใช้นามสกุลไฟล์ .ics และปฏิทินส่วนใหญ่ยอมรับอย่างกว้างขวาง เพื่อไม่ให้สับสนกับ iCal ของ Apple ซึ่งมีชื่อคล้ายกัน แม้ว่าไฟล์ iCalendar จะทำงานที่นั่นเช่นกัน เพื่อความชัดเจน เราจะเรียกสิ่งนี้ว่าเป็นไฟล์ ICS หรือปฏิทินตลอดทั้งโพสต์ในบล็อกนี้

ปฏิทินบางรายการยังสามารถเพิ่มกิจกรรมจากลิงก์ของเว็บ ซึ่งเราจะเรียกว่าลิงก์ปฏิทิน การใช้เวลาเพิ่มเติมในการแสดงลิงก์ "เพิ่มในปฏิทิน" แบบไดนามิกที่ตรงกับไคลเอ็นต์อีเมลเฉพาะของสมาชิกแต่ละรายจะทำให้พวกเขาเข้าถึงกิจกรรมของคุณได้มากขึ้น กล่าวคือ ง่ายกว่าและเร็วกว่าสำหรับสมาชิกในการเพิ่มกิจกรรมของคุณในปฏิทินของพวกเขา

เราจะแนะนำคุณเกี่ยวกับปฏิทินที่คุณควรสนใจ การสร้างไฟล์ปฏิทินและลิงก์จริง และเข้ารหัสไฟล์และลิงก์เหล่านี้ลงในอีเมลกิจกรรมเพื่อประสบการณ์การสมัครรับอีเมลที่ดีที่สุด

สารบัญ

ขั้นตอนที่ 1: เลือกปฏิทินที่จะกำหนดเป้าหมาย
ขั้นตอนที่ 2: สร้างลิงก์ปฏิทินและไฟล์
1. ไฟล์ปฏิทิน ICS
2. ลิงค์ปฏิทิน
ขั้นตอนที่ 3: ใส่รหัสลิงก์เพิ่มลงในปฏิทินลงในอีเมลของคุณ
1. ตัดสินใจว่าจะแสดงปุ่มเพิ่มในปฏิทินของคุณอย่างไร
2. สร้างปุ่มและลิงก์ CTA ของคุณ
3. กำหนดเป้าหมายผู้ชมที่เหมาะสมด้วยลิงก์ปฏิทินที่เหมาะสม
ดูลิงก์ "เพิ่มในปฏิทิน" เหล่านี้ในการดำเนินการ

ขั้นตอนที่ 1: เลือกปฏิทินที่จะกำหนดเป้าหมาย

มีแอปพลิเคชันปฏิทินต่างๆ มากมายให้เลือกใช้: แอปพลิเคชันที่พร้อมใช้งานโดยค่าเริ่มต้นผ่านระบบปฏิบัติการของคอมพิวเตอร์ของคุณ เป็นส่วนหนึ่งของเว็บเมลของคุณ หรือแอปพลิเคชันปฏิทินอื่นที่คุณดาวน์โหลด แทบเป็นไปไม่ได้เลยที่จะรองรับแอปพลิเคชันปฏิทินทั้งหมดที่มีอยู่

เพื่อช่วยให้คุณเข้าใจว่าควรเน้นที่เครื่องมือปฏิทินใด โปรดดูข้อมูล Email Analytics ของคุณ

Litmus Email Analytics - ข้อมูลไคลเอนต์อีเมล — ตัวอย่างข้อมูลอีเมลไคลเอ็นต์จาก Litmus Email Analytics

ปฏิทินทั้งหมดสามารถใช้ไฟล์ ICS เพื่อเพิ่มกิจกรรมใหม่ได้ แต่ต้องการให้ผู้ใช้ดาวน์โหลดไฟล์ ICS ก่อนแล้วจึงอัปโหลดไปยังปฏิทินของตน

อย่างไรก็ตาม ใน Gmail, Office 365 และ Outlook.com คุณยังสามารถเพิ่มกิจกรรมโดยใช้ลิงก์ที่รวมรายละเอียดกิจกรรมของคุณโดยอัตโนมัติ สิ่งนี้นำไปสู่ประสบการณ์สมาชิกที่ดีขึ้น เนื่องจากใช้เวลาเพียงคลิกเดียวเพื่อเพิ่มกิจกรรมของคุณลงในปฏิทิน

ต่อไปนี้คือแผนภูมิที่มีประโยชน์ซึ่งจะสรุปอย่างรวดเร็วว่าปฏิทินใดยอมรับวิธีเพิ่มในปฏิทินเพื่อช่วยเตรียมคุณสำหรับขั้นตอนต่อไป

วิธีการ “เพิ่มในปฏิทิน” โดย Calendar

ปฏิทิน	ไฟล์ปฏิทิน ICS	ลิงค์ปฏิทิน
Google ปฏิทิน	✓	✓
Outlook.com	✓	✓
AOL	✓	✘
Yahoo	✓	✘
Office 365	✓	✓
Outlook	✓	✘
ปฏิทินแอปเปิ้ล	✓	✘

เตือนความจำที่เป็นมิตรว่าถึงแม้คุณสามารถสร้างไฟล์ปฏิทิน ICS ได้เพียงไฟล์เดียว เนื่องจากโปรแกรมรับส่งเมลส่วนใหญ่ยอมรับไฟล์นี้ แต่ สมาชิกของคุณไม่ง่าย

การปรับแต่งลิงก์ปฏิทินสำหรับไคลเอนต์อีเมลแต่ละรายจะเพิ่มโอกาสที่สมาชิกของคุณจะเพิ่มกิจกรรมของคุณลงในปฏิทินของพวกเขา (และเข้าร่วมและแปลง!) เนื่องจากเป็นเพียงแค่คลิกเดียว การทำให้ผู้อื่นเพิ่มไฟล์ ICS ลงในปฏิทินต้องมีขั้นตอนมากกว่านี้ และคุณอาจสูญเสียบางคนไปในระหว่างทาง

ขั้นตอนที่ 2: สร้างลิงก์ปฏิทินและไฟล์

คุณอาจเลือกสร้างไฟล์ปฏิทิน ICS ลิงก์ปฏิทิน หรือทั้งสองอย่าง ทั้งนี้ขึ้นอยู่กับโปรแกรมรับส่งเมลที่สมาชิกของคุณใช้ในการอ่านอีเมล

ไฟล์ปฏิทิน ICS

เนื่องจากไฟล์ ICS เป็นตัวขับเคลื่อนลิงก์สำหรับแอปพลิเคชันปฏิทินจำนวนมาก นี่เป็นทางเลือกที่ดีเสมอมา

ในการเริ่มต้น เราขอแนะนำเครื่องมือ iCalendar Event Maker นี้เพื่อสร้างไฟล์ ช่วยให้คุณสามารถเพิ่มข้อมูลใดๆ ที่สมาชิกของคุณอาจต้องการทราบเกี่ยวกับกิจกรรม เช่น สถานที่ คำอธิบาย และ URL คุณยังสามารถเจาะจงกับกิจกรรมของคุณได้มากขึ้น ทำซ้ำหรือเพิ่มการแจ้งเตือนสำหรับแขกของคุณ

เมื่อผู้ชมของคุณเพิ่มไฟล์ของคุณลงในปฏิทิน พวกเขามีรายละเอียดที่ชัดเจนว่างานนี้มีไว้เพื่ออะไร และทำหน้าที่เป็นเครื่องเตือนใจว่าทำไมกิจกรรมจึงอยู่ในปฏิทินของพวกเขา

ลิงค์ปฏิทิน

ในการสร้างลิงก์ Add to Calendar สำหรับปฏิทินเว็บเมล เราขอแนะนำเครื่องมือลิงก์ปฏิทินของ Amit Agarwal มันจะสร้าง URL ทั้งหมดที่คุณต้องใส่ในอีเมลของคุณสำหรับปฏิทินของแต่ละคน

เครื่องมือนี้มีข้อเสีย: คุณไม่สามารถสร้างกิจกรรมที่เกิดซ้ำหรือรวมการแจ้งเตือนเช่นเดียวกับที่คุณทำกับไฟล์ ICS คุณสามารถเพิ่มรายละเอียดเหล่านี้ใน URL ของปฏิทิน แต่คุณจะต้องสร้างรายละเอียดเหล่านี้ในแต่ละปฏิทิน ซึ่งคุณอาจไม่มีสิทธิ์เข้าถึง

ด้วยเหตุนี้จึงควรสร้างไฟล์ปฏิทิน ICS นอกเหนือจากลิงก์ปฏิทิน

อย่าส่งอีเมลเสียอีก

ป้องกันข้อผิดพลาดของอีเมล เช่น ลิงก์ Add to Calendar ที่ใช้งานไม่ได้ ด้วยการทดสอบ QA อัตโนมัติด้วย Litmus Checklist ส่งอีเมลถึงแบรนด์และปราศจากข้อผิดพลาดด้วยความมั่นใจ (และปกป้องชื่อเสียงแบรนด์ของคุณ)

เริ่มการทดลองใช้ฟรี →

ขั้นตอนที่ 3: ใส่รหัสลิงก์เพิ่มลงในปฏิทินลงในอีเมลของคุณ

ก่อนที่เราจะเข้าสู่ส่วนที่สนุกจริงๆ (การเข้ารหัส!) คุณต้องตัดสินใจว่าจะนำเสนอลิงก์ "เพิ่มในปฏิทิน" อย่างไร

ตัดสินใจว่าจะแสดงปุ่มเพิ่มในปฏิทินของคุณอย่างไร

ดังที่เราได้กล่าวไว้ก่อนหน้านี้ ตามธรรมเนียมแล้ว จะมีลิงก์ "เพิ่มในปฏิทิน" หลายลิงก์พร้อมกับปุ่มไฟล์ ICS เมื่อใช้ปุ่มไดนามิกเป็นปุ่มเพิ่มในปฏิทิน คุณมีสองตัวเลือกที่แตกต่างกัน:

แสดงหนึ่ง : คุณสามารถกำหนดเป้าหมายโปรแกรมรับส่งเมลของสมาชิกแต่ละราย และแสดงลิงก์เฉพาะที่ตรงกับโปรแกรมรับส่งเมลของพวกเขาแบบไดนามิก
แสดงทั้งหมด : คุณสามารถใช้รูปแบบไฮบริดโดยที่ปุ่มคำกระตุ้นการตัดสินใจหลัก (CTA) จะถูกปรับให้เป็นแบบส่วนตัวสำหรับไคลเอนต์อีเมลของสมาชิกแต่ละราย และคุณยังคงให้ลิงก์ปฏิทินสำรอง

ถ้าคุณปรับแต่งลิงก์ เพิ่มในปฏิทิน ให้กับสมาชิกทุกคนได้ คุณอาจสงสัยว่าทำไมคุณถึงต้องการพิจารณาแสดงลิงก์ปฏิทินอื่นๆ เลย

การแสดงเพียงลิงก์เดียวไม่ได้คำนึงถึงคนชอบ อืม ฉัน ฉันมักจะใช้อีเมลที่ทำงานของฉันเพื่อลงชื่อสมัครใช้อีเมล เพื่อที่ฉันจะได้เห็นหน้าตาของอีเมลเหล่านั้นใน Outlook แต่ฉันต้องการเพิ่มกิจกรรมในปฏิทิน Gmail ส่วนตัวของฉัน นี่อาจเป็นปัญหาสำหรับผู้คนหากมีลิงก์ปฏิทินเพียงลิงก์เดียว

ตัวเลือกที่สองในการแสดงลิงก์ปฏิทินหลายรายการเป็นวิธีที่ดีในการแก้ปัญหานี้

เพิ่มในตัวอย่างอีเมลปฏิทิน — ตัวอย่างปุ่มส่วนบุคคลพร้อมลิงก์ปฏิทิน

มันซับซ้อนกว่าการซ่อนและแสดงปุ่ม CTA เล็กน้อยตามการตั้งค่าไคลเอนต์อีเมล แต่มันมอบประสบการณ์การใช้งานที่ดีที่สุดให้กับผู้ใช้ในความคิดของฉัน เมื่อคุณพบกับสมาชิกในกล่องจดหมายของพวกเขา แต่ยังคงรองรับเวิร์กโฟลว์ที่พวกเขาอาจมี

สร้างปุ่มและลิงก์ CTA ของคุณ

ตอนนี้เพื่อความสนุก: การเข้ารหัสปุ่มไฟล์ ICS เป็นค่าเริ่มต้น เริ่มต้นด้วยสิ่งนี้เพราะมันทำงานได้ทุกที่ ไม่ว่าไคลเอนต์อีเมล แอพ หรืออุปกรณ์ใดที่สมาชิกของคุณอ่าน

ขั้นแรก รับไฟล์ ICS ที่คุณสร้างในขั้นตอนที่ 2 โดยใช้เครื่องมือ iCalendar Event Maker จากนั้นอัปโหลดไปยังเซิร์ฟเวอร์ของบริษัท ระบบจัดการเนื้อหา (CMS) หรือไลบรารีสื่อของผู้ให้บริการอีเมล

ตอนนี้เป็นเวลาสร้างปุ่ม มีหลายวิธีในการสร้างปุ่ม คุณสามารถตรวจสอบ Ultimate Guide to Bulletproof Buttons ของเราได้บางส่วน ทุกวันนี้ เราเป็นแฟนตัวยงของปุ่มเข้าถึงได้ของ Mark Robbins ดังนั้นนี่คือตัวอย่างที่คุณสามารถใช้:

<a href="https://campaigns.litmus.com/_email/test/newnewyork.ics" class="cta btn-yellow" style="background-color: #F4D66C; font-size: 18px; font-family: Helvetica, Arial, sans-serif; font-weight:bold; text-decoration: none; padding: 14px 20px; color: #1D2025; border-radius: 5px; display:inline-block; mso-padding-alt:0; box-shadow:0 3px 6px rgba(0,0,0,.2);"><!--[if mso]><i style="letter-spacing: 25px;mso-font-width:-100%;mso-text-raise:30pt"> </i><![endif]--><span style="mso-text-raise:15pt;">Add to your Calendar</span><!--[if mso]><i style="letter-spacing: 25px;mso-font-width:-100%"> </i><![endif]--></a>

จากนั้น สร้าง URL สำหรับลิงก์ปฏิทินของโปรแกรมรับส่งเมลอื่นที่คุณวางแผนจะใช้และวางไว้ใต้ปุ่มที่คุณเพิ่งสร้างขึ้น:

<p style="font-family: Helvetica, Arial, sans-serif; color: #fdfdfd; font-size: 18px; line-height: 24px; margin: 20px 0 0 0;">
     <a href="https://outlook.office.com/calendar/0/deeplink/compose?body=Learn%20all%20about%20the%20rules%20of%20the%20Motorway%20and%20how%20to%20access%20the%20fast%20lane.%0A%0Ahttps%3A%2F%2Fen.wikipedia.org%2Fwiki%2FGridlock_%28Doctor_Who%29&enddt=2022-01-12T20%3A00%3A00%2B00%3A00&location=New%20Earth&path=%2Fcalendar%2Faction%2Fcompose&rru=addevent&startdt=2022-01-12T18%3A00%3A00%2B00%3A00&subject=Welcome%20to%20the%20Motorway" target="_blank" style="color: #fdfdfd; text-decoration: underline;">Outlook.com</a> |
                       	 
     <a href="https://outlook.office.com/calendar/0/deeplink/compose?body=Learn%20all%20about%20the%20rules%20of%20the%20Motorway%20and%20how%20to%20access%20the%20fast%20lane.%0A%0Ahttps%3A%2F%2Fen.wikipedia.org%2Fwiki%2FGridlock_%28Doctor_Who%29&enddt=2022-01-12T20%3A00%3A00%2B00%3A00&location=New%20Earth&path=%2Fcalendar%2Faction%2Fcompose&rru=addevent&startdt=2022-01-12T18%3A00%3A00%2B00%3A00&subject=Welcome%20to%20the%20Motorway" target="_blank" style="color: #fdfdfd; text-decoration: underline;">Office 365</a> |
                   	 
     <a href="https://calendar.google.com/calendar/render?action=TEMPLATE&dates=20220112T180000Z%2F20220112T200000Z&details=Learn%20all%20about%20the%20rules%20of%20the%20Motorway%20and%20how%20to%20access%20the%20fast%20lane.%0A%0Ahttps%3A%2F%2Fen.wikipedia.org%2Fwiki%2FGridlock_%28Doctor_Who%29&location=New%20Earth&text=Welcome%20to%20the%20Motorway" target="_blank" style="color: #fdfdfd; text-decoration: underline;">Google</a>
</p>

สุดท้าย ห่อทั้งหมดไว้ในแท็ก <div> เพื่อให้คุณสามารถกำหนดเป้าหมายสำหรับการปรับเปลี่ยนในแบบของคุณ:

<div class="default">
     <a href="https://campaigns.litmus.com/_email/test/newnewyork.ics" class="cta btn-yellow" style="background-color: #F4D66C; font-size: 18px; font-family: Helvetica, Arial, sans-serif; font-weight:bold; text-decoration: none; padding: 14px 20px; color: #1D2025; border-radius: 5px; display:inline-block; mso-padding-alt:0; box-shadow:0 3px 6px rgba(0,0,0,.2);"><!--[if mso]><i style="letter-spacing: 25px;mso-font-width:-100%;mso-text-raise:30pt"> </i><![endif]--><span style="mso-text-raise:15pt;">Add to your Calendar</span><!--[if mso]><i style="letter-spacing: 25px;mso-font-width:-100%"> </i><![endif]--></a>
     <p style="font-family: Helvetica, Arial, sans-serif; color: #fdfdfd; font-size: 18px; line-height: 24px; margin: 20px 0 0 0;">
          <a href="https://outlook.office.com/calendar/0/deeplink/compose?body=Learn%20all%20about%20the%20rules%20of%20the%20Motorway%20and%20how%20to%20access%20the%20fast%20lane.%0A%0Ahttps%3A%2F%2Fen.wikipedia.org%2Fwiki%2FGridlock_%28Doctor_Who%29&enddt=2022-01-12T20%3A00%3A00%2B00%3A00&location=New%20Earth&path=%2Fcalendar%2Faction%2Fcompose&rru=addevent&startdt=2022-01-12T18%3A00%3A00%2B00%3A00&subject=Welcome%20to%20the%20Motorway" target="_blank" style="color: #fdfdfd; text-decoration: underline;">Outlook.com</a> |
                       	 
          <a href="https://outlook.office.com/calendar/0/deeplink/compose?body=Learn%20all%20about%20the%20rules%20of%20the%20Motorway%20and%20how%20to%20access%20the%20fast%20lane.%0A%0Ahttps%3A%2F%2Fen.wikipedia.org%2Fwiki%2FGridlock_%28Doctor_Who%29&enddt=2022-01-12T20%3A00%3A00%2B00%3A00&location=New%20Earth&path=%2Fcalendar%2Faction%2Fcompose&rru=addevent&startdt=2022-01-12T18%3A00%3A00%2B00%3A00&subject=Welcome%20to%20the%20Motorway" target="_blank" style="color: #fdfdfd; text-decoration: underline;">Office 365</a> |
                       	 
          <a href="https://calendar.google.com/calendar/render?action=TEMPLATE&dates=20220112T180000Z%2F20220112T200000Z&details=Learn%20all%20about%20the%20rules%20of%20the%20Motorway%20and%20how%20to%20access%20the%20fast%20lane.%0A%0Ahttps%3A%2F%2Fen.wikipedia.org%2Fwiki%2FGridlock_%28Doctor_Who%29&location=New%20Earth&text=Welcome%20to%20the%20Motorway" target="_blank" style="color: #fdfdfd; text-decoration: underline;">Google</a>
     </p>
</div>

กำหนดเป้าหมายผู้ชมที่เหมาะสมด้วยลิงก์ปฏิทินที่เหมาะสม

สำหรับไคลเอนต์อีเมลแต่ละรายการที่คุณต้องการกำหนดเป้าหมาย คุณจะต้องสร้างบล็อกเนื้อหา <div> เวอร์ชันใหม่ที่คุณสร้างไว้ด้านบน—แต่ด้วยลิงก์ปฏิทินที่เหมาะสมของไคลเอนต์อีเมลเป้าหมายเป็นปุ่มเพิ่มในปฏิทิน CTA แล้วเปลี่ยน ลิงค์ปฏิทินเพิ่มเติมด้านล่าง

สุดท้าย ใช้ CSS เพื่อกำหนดเป้าหมายไคลเอ็นต์อีเมลเฉพาะ และแสดงเนื้อหาเฉพาะไคลเอ็นต์ในขณะที่ซ่อนเนื้อหาเริ่มต้น เคล็ดลับสำหรับมือโปร: ใส่ CSS การกำหนดเป้าหมายแต่ละรายการลงในบล็อกสไตล์ของตัวเอง เนื่องจากเป็นที่ทราบกันดีว่าการเพิ่ม CSS ลงในบล็อกสไตล์หลักทำให้การกำหนดเป้าหมายยุ่งเหยิง

ไคลเอนต์อีเมลใดที่คุณสามารถกำหนดเป้าหมายได้

Gmail
Office 365
Outlook.com
ยาฮู*
เอโอแอล*

คุณยังสามารถกำหนดเป้าหมายไคลเอ็นต์เดสก์ท็อปสำหรับ Outlook ได้ แต่เนื่องจากจะใช้ปุ่มเริ่มต้นอยู่แล้ว คุณไม่ จำเป็นต้อง กำหนดเป้าหมายในครั้งเดียว (ว้าว!)

มาถึงประเด็นสำคัญเกี่ยวกับวิธีการกำหนดเป้าหมายไคลเอนต์อีเมลแต่ละราย (และดูบันทึกย่อที่อัปเดตของเราสำหรับ Yahoo และ AOL)

Gmail

บล็อกเนื้อหาที่คุณจะแสดงสำหรับ Gmail มี URL ของ Google ปฏิทินเป็นปุ่มหลัก วนรอบลิงก์อื่นๆ ใต้ปุ่มเพื่อรวมไฟล์ ICS นอกจากนี้ คุณจำเป็นต้องซ่อนทั้งบล็อกไม่ให้คนอื่นเห็น ดังนั้นให้เพิ่มคุณสมบัติ display ที่มีค่า none ให้กับแท็ก <div> และรวมสิ่งทั้งหมดไว้ในโค้ดแบบมีเงื่อนไขเพื่อซ่อนใน Outlook

ผลลัพธ์มีลักษณะดังนี้:

<!--Gmail Button-->
<!--[if (gte mso 9)|(IE)]><!-->
<div class="gmail" style="display: none;">
     <a href="https://calendar.google.com/calendar/render?action=TEMPLATE&dates=20220112T180000Z%2F20220112T200000Z&details=Learn%20all%20about%20the%20rules%20of%20the%20Motorway%20and%20how%20to%20access%20the%20fast%20lane.%0A%0Ahttps%3A%2F%2Fen.wikipedia.org%2Fwiki%2FGridlock_%28Doctor_Who%29&location=New%20Earth&text=Welcome%20to%20the%20Motorway" class="cta btn-yellow" style="background-color: #F4D66C; font-size: 18px; font-family: Helvetica, Arial, sans-serif; font-weight:bold; text-decoration: none; padding: 14px 20px; color: #1D2025; border-radius: 5px; display:inline-block; mso-padding-alt:0; box-shadow:0 3px 6px rgba(0,0,0,.2);"><span style="mso-text-raise:15pt;">Add to your Google Calendar</span></a>
                       	 
     <p style="font-family: Helvetica, Arial, sans-serif; color: #fdfdfd; font-size: 18px; line-height: 24px; margin: 20px 0 0 0;">
          <a href="https://outlook.office.com/calendar/0/deeplink/compose?body=Learn%20all%20about%20the%20rules%20of%20the%20Motorway%20and%20how%20to%20access%20the%20fast%20lane.%0A%0Ahttps%3A%2F%2Fen.wikipedia.org%2Fwiki%2FGridlock_%28Doctor_Who%29&enddt=2022-01-12T20%3A00%3A00%2B00%3A00&location=New%20Earth&path=%2Fcalendar%2Faction%2Fcompose&rru=addevent&startdt=2022-01-12T18%3A00%3A00%2B00%3A00&subject=Welcome%20to%20the%20Motorway" target="_blank" style="color: #fdfdfd; text-decoration: underline;">Outlook.com</a> |
                       	 
          <a href="https://outlook.office.com/calendar/0/deeplink/compose?body=Learn%20all%20about%20the%20rules%20of%20the%20Motorway%20and%20how%20to%20access%20the%20fast%20lane.%0A%0Ahttps%3A%2F%2Fen.wikipedia.org%2Fwiki%2FGridlock_%28Doctor_Who%29&enddt=2022-01-12T20%3A00%3A00%2B00%3A00&location=New%20Earth&path=%2Fcalendar%2Faction%2Fcompose&rru=addevent&startdt=2022-01-12T18%3A00%3A00%2B00%3A00&subject=Welcome%20to%20the%20Motorway" target="_blank" style="color: #fdfdfd; text-decoration: underline;">Office 365</a> |
                       	 
          <a href="https://campaigns.litmus.com/_email/test/newnewyork.ics" target="_blank" style="color: #fdfdfd; text-decoration: underline;">Apple Mail/Outlook Desktop</a>
     </p>
</div>                   	 
<!--<![endif]-->

Gmail จะเปลี่ยนประเภทเอกสารเป็น <u></u> โดยอัตโนมัติ สิ่งนี้ถูกวางไว้ใกล้กับองค์ประกอบ <div> ที่สืบทอดคลาสและ ID จากแท็ก <body> ใช้สิ่งต่อไปนี้เพื่อกำหนดเป้าหมายเนื้อหาใน Gmail:

u + .body .foo {}

บล็อกสไตล์เพื่อซ่อนค่าเริ่มต้นและแสดงปุ่ม Gmail มีลักษณะดังนี้:

<!--gmail styles-->
<style>
     u + .body .gmail { display: block !important; }
     u + .body .default { display: none !important; }
</style>

Outlook.com และ Office 365

บล็อกสำหรับ Outlook.com (Outlook Web App หรือ OWA) และ Office 365 มีลักษณะเหมือนกับบล็อก Gmail ที่มีการปรับเปลี่ยนเล็กน้อย ได้แก่ คลาสและการวนซ้ำของปุ่มและ URL ลิงก์ไปยังบัญชีสำหรับไคลเอ็นต์เป้าหมายใหม่

อาจมีความสับสนเนื่องจาก Office 365 มีทั้งเดสก์ท็อปและไคลเอ็นต์เว็บเมล อย่างไรก็ตาม การกำหนดเป้าหมายจะใช้กับไคลเอ็นต์เว็บเมลของ Outlook เท่านั้น ซึ่งทำให้มั่นใจได้ว่าปุ่มหลักสำหรับไคลเอ็นต์เดสก์ท็อปจะลิงก์ไปยังไฟล์ ICS ในขณะที่อยู่ในไคลเอ็นต์เว็บเมล นั่นคือ URL ของลิงก์ปฏิทิน

ทั้ง Outlook.com และ Office 365 เว็บเมลนำหน้าชื่อคลาสด้วย x_ แต่จะไม่ทำเช่นนี้กับตัวเลือกแอตทริบิวต์ ดังนั้น <div> บล็อกของคุณสามารถกำหนดเป้าหมายด้วย:

[class="x_foo"] {}

…และจะใช้กับไคลเอ็นต์เว็บเมลของ Outlook เท่านั้น ดังนั้น สไตล์บล็อกสำหรับไคลเอ็นต์เว็บเมล Outlook จะมีลักษณะดังนี้:

<!--owa styles-->
<style>
     [class~="x_outlook"] { display: block !important; }
     [class~="x_default"] { display: none !important; }
</style>

Yahoo และ AOL

Yahoo เคยมีลิงก์ปฏิทิน แต่ในการทดสอบครั้งล่าสุดของเรา ลิงก์ดังกล่าวจะนำคุณไปยังหน้าปฏิทินเพื่อเพิ่มกิจกรรม แต่ไม่มีรายละเอียดกิจกรรมใดๆ ส่งต่ออีกต่อไป

ซึ่งอาจเกิดจากการเปลี่ยนแปลงที่ Yahoo เนื่องจาก Verizon ทั้ง AOL และ Yahoo เป็นเจ้าของ พวกเขาจึงอาจปรับปรุงไคลเอ็นต์อีเมลเพื่อให้สอดคล้องกันมากขึ้น

แม้ว่าคุณ จะ ยังคงกำหนดเป้าหมาย Yahoo และ AOL โดยเฉพาะได้ แต่ตอนนี้รองรับเฉพาะไฟล์ ICS ดังนั้น ช่วยประหยัดเวลาและใช้รหัสเริ่มต้นของ Add to Calendar ที่แชร์ในตอนต้นของขั้นตอนที่ 3 ในบล็อกโพสต์นี้ จนกว่าจะมีประกาศเพิ่มเติม

ดูลิงก์ "เพิ่มในปฏิทิน" เหล่านี้ในการดำเนินการ

ดังนั้น แม้ว่าโค้ดด้านบนจะสวยงาม แต่คุณอาจสงสัยว่าเมื่อใช้งานในอีเมลจริงแล้วหน้าตาเป็นอย่างไร โชคดีสำหรับคุณ เราได้เขียนโค้ดใน Litmus Builder เพื่อให้คุณสามารถดูว่าปุ่มและลิงก์เพิ่มในปฏิทินมีลักษณะอย่างไร และแสดงผลอย่างไรในไคลเอ็นต์อีเมลและอุปกรณ์ต่างๆ

ให้อีเมลพิเศษนี้แก่ผู้เข้าร่วมงานของคุณ!

ตรวจสอบให้แน่ใจว่าอีเมลกิจกรรมของคุณถูกต้อง

อีเมลที่เสียหายหมายถึง Conversion ที่น้อยลง เช่น คนที่เพิ่มกิจกรรมของคุณลงในปฏิทิน เย้ๆ ป้องกันข้อผิดพลาดของอีเมลและปกป้องชื่อเสียงแบรนด์ของคุณด้วย Litmus Email Previews และอื่นๆ

เริ่มการทดลองใช้ฟรี →

โพสต์บล็อกนี้เผยแพร่ครั้งแรกเมื่อวันที่ 8 พฤษภาคม 2019 โดย Jaina Mistry ได้รับการอัปเดตเมื่อวันที่ 5 กุมภาพันธ์ พ.ศ. 2564 เพื่อความชัดเจนและมีข้อมูลใหม่