Marketing Email
      Back to home
      1. Help Center
      2. HubSpot Marketing Tools
      3. Marketing Email

      Optimize your marketing email for mobile devices (BETA): ปรับแต่งอีเมลให้เหมาะสำหรับส่งให้อุปกรณ์พกพา

      หากคุณกำลังสร้าง Marketing Email คุณสามารถซ่อนส่วนเฉพาะสำหรับผู้รับที่ใช้ Desktop หรือ Mobile Email Clients ได้

      วันที่เผยแพร่ 17 มกราคม 2568

      Available with any of the following subscriptions, except where noted:
      All products and plans


      หากคุณกำลังสร้าง Marketing Email       คุณสามารถซ่อนส่วนเฉพาะสำหรับผู้รับที่ใช้ Desktop หรือ Mobile Email Clients ได้ รวมถึงปรับเปลี่ยนการตั้งค่าคอลัมน์และเลย์เอาต์โดยรวมให้เหมาะกับผู้ใช้ที่อ่านอีเมลบนอุปกรณ์ขนาดเล็ก การปรับแต่งอีเมลให้เข้ากับอุปกรณ์ต่างๆ จะช่วยเพิ่มการมีส่วนร่วมและปรับปรุงประสบการณ์ใช้งานอีเมลโดยรวมของผู้ใช้

       

      โปรดทราบ: ฟีเจอร์นี้มีให้เฉพาะใน Drag and Drop Email Editor เท่านั้น หากใช้ Custom Coded Email Templates จะต้องมีนักพัฒนาในการสร้าง Media Queries เพื่อรองรับขนาดของ Email Client และประเภทอุปกรณ์

      การสนับสนุน Email Client

      Email Client หลักๆ ส่วนใหญ่รองรับการตั้งค่าการปรับให้เหมาะกับอุปกรณ์เคลื่อนที่ที่ HubSpot มีให้ใน Marketing Email Editor แต่ Email Client ต่อไปนี้ยังไม่รองรับอีเมลที่ปรับให้เหมาะกับอุปกรณ์เคลื่อนที่ในปัจจุบัน:

      • Yahoo! Mail บน Android
      • AOL Mail บน Android
      • Gmail IMAP (เช่น การใช้งาน Gmail App กับบัญชีที่ไม่ใช่ Google)
      • บางเวอร์ชันของ Samsung Mail เช่น การใช้บัญชี Outlook ที่เชื่อมต่อกับ Samsung Mail

      หากใช้ Email Client ที่ระบุไว้ข้างต้น ฟีเจอร์ Mobile Optimization ของ HubSpot ที่เพิ่ม Media Queries สำหรับ Desktop หรือ Mobile จะไม่ถูกนำมาใช้ ส่วนที่ตั้งค่าให้ซ่อนสำหรับ Desktop หรือ Mobile จะยังมองเห็นได้

      ซ่อนโมดูลและส่วนต่างๆ บน Desktop หรือ Mobile

      ปรับแต่งว่าโมดูลหรือส่วนใดจะปรากฏสำหรับผู้รับที่ใช้ Desktop หรือ Mobile:

      toggle-between-client-types-in-email-editor
      • วางเมาส์เหนือโมดูลหรือส่วนต่างๆ และคลิกไอคอน Hide เพื่อซ่อนโมดูลในเวอร์ชันอีเมลที่คุณกำลังแก้ไข
        • หากต้องการแสดงโมดูลที่ซ่อนทั้งหมดสำหรับเวอร์ชันที่คุณกำลังแก้ไข ให้คลิก Show all hidden ที่ด้านบนของ Email Editor
        • คุณสามารถคลิกไอคอน View เพื่อเปลี่ยนโมดูลที่ซ่อนกลับมาให้มองเห็นได้ในเวอร์ชันของอีเมล

      hide-email-module-on-desktop-1

      • ในแถบด้านซ้าย คุณสามารถเลือก Show as maximum width on mobile devices เพื่อให้โมดูลหรือส่วนปรากฏแบบเต็มความกว้างสำหรับผู้รับบนมือถือ

      ปรับแต่งเลย์เอาต์อีเมลสำหรับ Mobile หรือ Desktop

      ปรับเปลี่ยนการตั้งค่าเลย์เอาต์ต่างๆ ระหว่าง Mobile และ Desktop Clients:

      • ในแถบด้านซ้าย คลิก Content
      • เพื่อปรับแต่งการแสดงผลของส่วนในอีเมลระหว่าง Desktop และ Mobile:
        • คลิกส่วนใดส่วนหนึ่งของอีเมล
        • ภายใต้ Visibility ให้ปิดสวิตช์ All devices จากนั้นคลิก Show หรือ Hide ในส่วน Desktop และ Mobile

      configure-section-visibility-for-desktop-and-mobile-email-clients-0

        • ในส่วน Layout, ปิดสวิตช์ All devices จากนั้นกำหนดค่าเลย์เอาต์คอลัมน์สำหรับ Desktop และเลย์เอาต์การซ้อนสำหรับ Mobile

      configure-column-and-stacking-for-email-clients

        • แก้ไขสไตล์ของส่วนสำหรับ Mobile หรือ Desktop Clients เช่น สีของ Body, ความกว้างและประเภทของ Border, ประเภท Background, และสี Background
      • ปรับแต่งการแสดงผล Template สำหรับ Desktop หรือ Mobile Recipients
        • ในแถบด้านซ้าย คลิก Design
        • ในส่วน Template, ปิดสวิตช์ All devices
        • จากนั้นปรับแต่งสไตล์ของ Template สำหรับผู้รับบน Desktop หรือ Mobile เช่น สีของ Body, ความกว้างและประเภทของ Border, ประเภท Background, และสี Background

      customize-desktop-and-mobile-appearance-for-template

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

      ที่มา: https://knowledge.hubspot.com/marketing-email/optimize-marketing-email-for-mobile-devices