เครื่องมือ 04
Social Preview
ดูว่าหน้าเว็บของคุณจะแสดงอย่างไรเมื่อแชร์บน Facebook, Twitter และ LinkedIn อัปโหลดรูปภาพเพื่อทดสอบแท็ก Open Graph ของคุณ
yourdomain.com
ชื่อหน้าเว็บจะแสดงที่นี่
คำอธิบายจะแสดงที่นี่
1200 × 630
1200 × 628
1200 × 627
เครื่องมือ Social Preview คืออะไร?
เครื่องมือ Social Preview แสดงว่าลิงก์ของคุณจะมีหน้าตาอย่างไรเมื่อแชร์บน Facebook, Twitter/X และ LinkedIn: ภาพการ์ด ชื่อ คำอธิบาย และโดเมน แสดงผลในเลย์เอาต์จริงของแต่ละแพลตฟอร์ม คุณกรอกข้อมูล อัปโหลดรูป และสลับดูแต่ละแพลตฟอร์มเพื่อเปรียบเทียบ
ลิงก์ที่แชร์อยู่หรือตายด้วยการ์ดของมัน ลิงก์ที่มีภาพ Open Graph ที่ถูกต้องได้คลิกมากกว่า URL เปล่าอย่างมาก และแต่ละแพลตฟอร์มครอปและตัดข้อความต่างกัน การตรวจการ์ดก่อนเผยแพร่ดีกว่าการพบการ์ดเสียหลังโพสต์ขึ้นไปแล้ว
วิธีใช้งาน
- 1กรอกชื่อและคำอธิบายที่คุณวางแผนใส่ในแท็ก Open Graph
- 2อัปโหลดรูปที่ตั้งใจใช้เป็น og:image
- 3สลับระหว่างแท็บ Facebook, Twitter และ LinkedIn เพื่อดูการแสดงผลของแต่ละแพลตฟอร์ม
- 4ปรับความยาวข้อความและองค์ประกอบภาพจนการ์ดดูดีทุกที่ แล้วคัดลอกค่าไปใส่ใน meta tags ของคุณ
คำถามที่พบบ่อย
ภาพ Open Graph ควรมีขนาดเท่าไหร่?
ใช้ 1200 x 630 พิกเซล ตรงกับสัดส่วนที่ Facebook แนะนำ (1.91:1) และใช้ได้บน Twitter และ LinkedIn โดยถูกครอปน้อยที่สุด วางข้อความสำคัญและใบหน้าไว้ตรงกลาง: ขอบคือส่วนที่แพลตฟอร์มตัดก่อน ไฟล์ควรต่ำกว่าประมาณ 1 MB เพื่อการดึงข้อมูลที่เร็ว
ทำไมลิงก์ยังแสดงตัวอย่างเก่าหลังจากเปลี่ยนแท็กแล้ว?
แพลตฟอร์มแคชตัวอย่างที่ดึงมาอย่างหนัก บังคับรีเฟรชด้วยเครื่องมือดีบักของแต่ละแพลตฟอร์ม: Facebook Sharing Debugger ("Scrape Again"), LinkedIn Post Inspector หรือตรวจสอบใหม่ใน Card Validator ของ Twitter ก่อนหน้านั้นแพลตฟอร์มจะแสดงการ์ดที่แคชไว้ต่อไป บางครั้งนานเป็นสัปดาห์
ต้องมีแท็ก Twitter Card แยกไหมถ้ามี Open Graph แล้ว?
ส่วนใหญ่ไม่ต้อง: Twitter ใช้แท็ก Open Graph เมื่อแท็กของตัวเองหายไป แต่ควรเพิ่ม twitter:card ค่า summary_large_image ไม่งั้น Twitter อาจแสดงการ์ดสี่เหลี่ยมเล็กแทนภาพเต็มความกว้าง แท็กเฉพาะแพลตฟอร์มสำคัญเฉพาะเมื่อต้องการข้อความต่างกันในแต่ละเครือข่าย