og:image ไม่แสดง? วิธีแก้ไข
og:image ไม่แสดงมักเกิดจากสาเหตุหนึ่งในห้าประการ ได้แก่ URL ของรูปภาพไม่เป็นสาธารณะ รูปภาพมีขนาดใหญ่เกินไป แพลตฟอร์มแคชเวอร์ชันเก่าไว้ แท็กชี้ไปยังหน้าที่ผิด หรือรูปแบบรูปภาพไม่ได้รับการรองรับ คู่มือนี้จะอธิบายวิธีแก้ไขแต่ละสาเหตุพร้อมกับเครื่องมือดีบักที่ Facebook, X และ LinkedIn จัดเตรียมไว้ให้
เหตุใด og:image ของฉันจึงไม่แสดงผล
ส่วนใหญ่แล้วสาเหตุมาจาก URL ของรูปภาพไม่สามารถเข้าถึงได้จากภายนอก ขนาดไฟล์เกินขีดจำกัดของแพลตฟอร์ม หรือแพลตฟอร์มกำลังแสดงเวอร์ชันที่แคชไว้ แพลตฟอร์มโซเชียลจะทำการดึงข้อมูลใหม่ตามกำหนดเวลาและแคชข้อมูลอย่างหนัก ดังนั้นรูปภาพใหม่จึงมักดูเหมือน "ไม่ทำงาน" จนกว่าคุณจะบังคับให้รีเฟรชด้วยเครื่องมือดีบักของพวกเขา
สาเหตุที่พบบ่อยที่สุด 5 ประการ (และวิธีแก้ไข)
1. URL ของรูปภาพไม่เป็นสาธารณะ
แพลตฟอร์มต่าง ๆ ต้องสามารถดึงรูปภาพได้โดยไม่ต้องมีการยืนยันตัวตน URL ที่อยู่หลังหน้าเข้าสู่ระบบ localhost หรือที่อยู่ IP จะไม่สามารถใช้งานได้
วิธีแก้ไข: โฮสต์รูปภาพที่ URL สาธารณะแบบ HTTPS และยืนยันว่า curl -I <image-url> คืนค่า 200 OK พร้อมรูปภาพประเภท Content-Type
2. รูปภาพมีขนาดใหญ่เกินไป
แพลตฟอร์มส่วนใหญ่จำกัดขนาด OG image ไว้ที่ 8 MB (X อยู่ที่ประมาณ 5 MB) ไฟล์ PNG ขนาดใหญ่อาจล้มเหลวโดยไม่มีข้อความแจ้งเตือน
วิธีแก้ไข: เก็บไฟล์ให้ต่ำกว่า 5 MB การ์ดข้อความขนาด 1200×630 โดยทั่วไปจะมีขนาด 200–500 KB บน FastOG ผลลัพธ์ PNG ถูกปรับขนาดให้เหมาะสมกับข้อกำหนดนี้อยู่แล้ว
3. แพลตฟอร์มแคชเวอร์ชันเก่าไว้
Facebook, X, LinkedIn, Slack และ Discord ต่างก็แคชข้อมูลอย่างจริงจัง Meta ยังเก็บสำเนารูปภาพของตัวเองและผูกตัวอย่างพรีวิวกับ URL ของหน้า ดังนั้นการเปลี่ยน URL รูปภาพเพียงอย่างเดียวจะไม่ทำให้พรีวิวเปลี่ยนแปลง หลังจากเปลี่ยนรูปภาพแล้ว การ์ดเก่าจะยังคงแสดงอยู่เป็นเวลาหลายชั่วโมงหรือหลายวัน
วิธีแก้ไข: บังคับให้แพลตฟอร์มดึงข้อมูลใหม่ด้วยเครื่องมือของแพลตฟอร์มนั้น ๆ (ดูด้านล่าง) สำหรับการเปลี่ยนรูปภาพ ให้ใช้ URL ที่เปลี่ยนแปลงตามเนื้อหา (URL ที่ลงนามของ FastOG ทำสิ่งนี้โดยอัตโนมัติ) สำหรับแพลตฟอร์มเดียวที่อนุญาตให้รีเฟรชผ่านโปรแกรมได้ ดูที่ บังคับรีเฟรชแคช Open Graph ของ Facebook
4. URL ผิดหรือผิดหน้า
แท็ก og:image อาจหายไป ซ้ำกัน หรือชี้ไปยังหน้าที่ไม่มีแท็กดังกล่าว
วิธีแก้ไข: ดูซอร์สโค้ดของหน้าและยืนยันว่าแท็ก og:image มีอยู่ ถูกเรนเดอร์จากฝั่งเซิร์ฟเวอร์ และเป็น URL แบบสัมบูรณ์
5. รูปแบบที่ไม่รองรับ
บางแพลตฟอร์มปฏิเสธรูปแบบบางอย่างหรือรูปภาพแบบเคลื่อนไหว
วิธีแก้ไข: ใช้ PNG หรือ JPG อัตราส่วนที่รองรับคือ 1200×630
เครื่องมือสำหรับการดีบัก
| แพลตฟอร์ม | เครื่องมือ |
|---|---|
| Facebook / WhatsApp | Sharing Debugger — developers.facebook.com/tools/debug |
| X / Twitter | Card Validator — cards-dev.twitter.com/validator |
Post Inspector — linkedin.com/post-inspector |
วาง URL จากนั้นกด "Scrape" / "Refresh" เพื่อดึงแท็กล่าสุด
รายละเอียดเฉพาะของ FastOG
- FastOG เรนเดอร์ PNG ขนาด 1200×630 — ซึ่งเป็นขนาดที่รองรับ — จึงหลีกเลี่ยงปัญหาเรื่องขนาดและอัตราส่วนได้
- URL ที่ลงนาม (signed URL) จำกัดการเข้าถึงเฉพาะการเรนเดอร์ครั้งแรกเท่านั้น ภาพที่ถูกแคชแล้วยังคงใช้งานได้ ดังนั้นการ์ดที่แชร์ไปแล้วจึงยังคงทำงานต่อไป
- เปลี่ยนชื่อเรื่อง → เปลี่ยน URL → เรนเดอร์ใหม่หนึ่งครั้ง แพลตฟอร์มจะ (ในที่สุด) ตรวจจับการ์ดใหม่เมื่อคุณบังคับให้มีการสแกนซ้ำ (re-scrape)
คำถามที่พบบ่อย
FastOG รับประกันว่า og:image ของฉันจะแสดงผลหรือไม่?
FastOG ส่งมอบไฟล์ PNG ขนาด 1200×630 ที่ถูกต้องจาก URL สาธารณะ การที่แพลตฟอร์มจะแสดงผลหรือไม่นั้นขึ้นอยู่กับแคชของแพลตฟอร์ม — ควรทำการดึงข้อมูลใหม่ด้วยตัวตรวจสอบ (validator) หลังจากเปลี่ยนรูปภาพ
ทำไม Facebook ยังแสดงรูปภาพเก่าอยู่แม้ฉันจะอัปเดตแล้ว?
Facebook จะแคชข้อมูลที่ดึงมา และเก็บสำเนารูปภาพไว้เอง — ดังนั้นการเปลี่ยน og:image URL ใหม่เพียงอย่างเดียวไม่เพียงพอ ให้ใช้ Sharing Debugger → "Scrape Again"; บังคับให้รีเฟรชแคช Open Graph ของ Facebook ครอบคลุมเส้นทาง API โทเค็นแอปที่จำเป็น และขีดจำกัดอัตราการเรียกใช้ที่ต้องปฏิบัติตาม
ฉันจะบังคับให้ X แสดงการ์ดใหม่ได้อย่างไร?
เปิด X Card Validator แล้ววาง URL ลงไป ระบบจะดึงข้อมูล og:image และ twitter:image ล่าสุดอีกครั้ง