วันอังคารที่ 25 มิถุนายน พ.ศ. 2562

Add Twitter Cards to Blogger

Twitter card  หรือภาพตัวอย่างประกอบบทความที่โพสใน Twitter มีหลายขนาด, แต่ในบทความนี้จะ เป็นแบบขนาดใหญ่ (Summary Card with Large Image) และเป็นวิธีที่ง่ายที่สุด เพียงวิธีเดียว ผมนำ Code มาจาก github ลิงค์นี้ครับ






วิธีทำ


1. เปิด blogger.com คลิก Sigh in blogger > Theme

1.1 (ถ้าต้องการ) คุณจะ Backup theme ก่อนการแก้ไขก็ได้
1.2 คลิกที่ Edit HTML




2. กด Ctrl+f > พิมพ์ <head>





3. Copy code ข้างล่างนี้ โดยเปลี่ยน @???  เป็น Twitter user ของคุณ

<meta content='summary_large_image' name='twitter:card'/>
<meta content='@???์' name='twitter:site'/>
<meta content='@???' name='twitter:creator'/>
<meta expr:content='data:blog.pageName' name='twitter:title'/>
<meta expr:content='data:blog.metaDescription' name='twitter:description'/>
<meta expr:content='data:blog.postImageUrl' name='twitter:image'/>





4. นำไป Paste ลงบรรทัดข้างล่าง <head> จากนั้น.. > Save Theme



ทดสอบวาง url เว็บเพจในบล็อกของคุณ (หน้าใดก็ได้) > คลิก Preview card
ถ้าไม่มีอะไรผิดพลาด ก็จะมีพรีวิวออกมาตามรูป






6. ถ้าโพสจริงใน Twitterก็จะเป็นตามรูป
สำรับคำอธิบายใต้ภาพที่ผู้อ่านเห็นก็จะเป็นคำอธิบายที่คุณเขียนใน Search Description (คำอธิบายการค้นหา)ในหน้า Edit Post (แก้ไขโพส หรือหน้าที่ใช้เขียนบทความนั่นเอง)

สำหรับรายละเอียดอื่นๆ เช่น Twitter card มีกี่ขนาด, ขนาดภาพที่เหมาะสม, ใครสนใจก็ค้นหาได้ตามเน็ทครับ สำหรับผมพึ่งจะใช้ Twitter ได้ไม่ถึงเดือน เลยขอเน้นเฉพาะที่ได้ผลลัพภ์สวยตามต้องการ และง่ายที่สุดก็พอแล้ว
เขียนโดย ที่ ไม่มีความคิดเห็น :
สมัครสมาชิก: บทความ ( Atom )