วิธีเพิ่มการ์ด Twitter ลงในเว็บไซต์ WordPress

เผยแพร่แล้ว: 2023-12-10

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

ทุกสิ่งที่ค่อนข้างเป็นมาตรฐาน ไม่มีสิ่งใดถูกดึงข้อมูลแบบไดนามิก นอกจากนี้ หากทวีตของคุณถูกรีทวีต ทวีตต้นฉบับของคุณ (และเนื้อหาทวีต) จะถูกเปิดเผยน้อยที่สุด - การ์ด Twitter จะเปลี่ยนแปลงทั้งหมดนี้ การ์ด Twitter นำเสนอความสามารถในการดึงเนื้อหาจาก URL ที่กำลังทวีตโดยอัตโนมัติโดยใช้ Open Graph Protocol ยอดนิยม

การ์ดทวิตเตอร์
แหล่งที่มาของภาพ: airrayagroup – Pixabay.com / ใบอนุญาต: CC0 โดเมนสาธารณะ

เนื้อหา เช่น ข้อความที่ตัดตอนมา รูปภาพ หรือแม้แต่วิดีโอ และอื่นๆ อีกมากมาย สามารถดึงข้อมูลและแสดงแบบไดนามิกภายในการ์ด Twitter ที่เกี่ยวข้องได้ ไม่เพียงเท่านั้น การ์ดแต่ละใบยังแสดงลิงก์โดยตรงไปยังชื่อ Twitter ของคุณและยังอนุญาตให้ติดตามได้เพียง 1 คลิก นั่นหมายความว่า หากทวีตของคุณถูกรีทวีต ข้อมูลของคุณ (และเนื้อหาที่แชร์) จะอยู่ในตำแหน่งสำคัญที่จะดึงดูดความสนใจ ไม่ใช่ผู้ใช้ที่รีทวีต วิธีนี้เหมาะอย่างยิ่งที่จะเพิ่มจำนวนผู้ติดตาม Twitter ของคุณ

สองวิธีในการรวมการ์ด Twitter

ให้เรามาดูกันว่าเราจะนำฟีเจอร์ที่เปลี่ยนแปลงเกมนี้ไปใช้กับไซต์ WordPress ของคุณอย่างไร การใช้การ์ด Twitter ใน WordPress สามารถทำได้หลายวิธี หนึ่งคือผ่านการใช้ปลั๊กอิน ประการที่สอง โดยการแก้ไขโค้ดธีมของคุณผ่านการใช้ธีมลูก

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

ปลั๊กอิน Meta การ์ด Twitter

เมตาการ์ด Twitter
แหล่งที่มาของภาพ: ภาพหน้าจอ – WordPress.org

ปลั๊กอิน Twitter Cards Meta ช่วยให้คุณสามารถติดตั้ง Twitter Cards บนเว็บไซต์หรือบล็อก WordPress ของคุณได้อย่างง่ายดาย เมื่อเปิดใช้งานปลั๊กอิน หน้าตัวเลือกภายในแผงควบคุม WordPress ของคุณจะถูกสร้างขึ้น คุณสามารถเข้าถึงได้ผ่านเมนูผู้ดูแล ระบบ Twitter Cards

ตอนนี้คุณสามารถเริ่มกำหนดค่าปลั๊กอิน Twitter Cards Meta ได้แล้ว กรอกรายละเอียดที่เกี่ยวข้องกับบัญชี Twitter ของคุณ เพิ่ม URL รูปภาพเริ่มต้น และเลือกรูปภาพที่คุณต้องการให้แสดงในการ์ด Twitter ของคุณ สุดท้ายให้บันทึกตัวเลือกของคุณโดยคลิกปุ่ม บันทึกตัวเลือก

ปลั๊กอิน Yoast SEO

WordPress SEO โยสต์
แหล่งที่มาของภาพ: ภาพหน้าจอ – WordPress.org

หนึ่งในปลั๊กอินยอดนิยมสำหรับ WordPress คือ Yoast SEO ขณะนี้มีการติดตั้งที่ใช้งานอยู่มากกว่าหนึ่งล้านครั้ง ปลั๊กอิน WordPress อันทรงพลังนี้มาพร้อมกับการรวมการ์ด Twitter ทันที คนส่วนใหญ่มีปลั๊กอินนี้ติดตั้งไว้เพื่อเพิ่มประสิทธิภาพ SEO มีโอกาสที่คุณอาจมีคุณสมบัติเฉพาะนี้พร้อมให้คุณใช้แล้วโดยไม่รู้ตัว

ดาวน์โหลดและติดตั้งปลั๊กอินตามปกติ และไปที่เมนู SEO => ผู้ดูแลระบบโซเชียล ภายในแดชบอร์ด WordPress ของคุณ ป้อนชื่อผู้ใช้ Twitter ของคุณในช่องที่ทำเครื่องหมาย ชื่อผู้ใช้ Twitter แล้วคลิกปุ่ม บันทึกการเปลี่ยนแปลง ที่ด้านบนของหน้าจะมีแท็บสำหรับโซเชียลมีเดียต่างๆ ตอนนี้คลิกแท็บ Twitter เพื่อเปิดหน้าตัวเลือกเฉพาะของ Twitter ด้วยปลั๊กอิน Yoast SEO

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

ขั้นตอนสุดท้ายคือการเพิ่มชื่อผู้ใช้ Twitter ของคุณไปยังบัญชีผู้ใช้ของไซต์ของคุณ คุณสามารถทำได้ผ่านเมนู Users => ผู้ดูแลระบบโปรไฟล์ของคุณ ในแดชบอร์ด WordPress ของคุณ เลื่อนหน้าโปรไฟล์ผู้ใช้ลงจนกว่าคุณจะเห็นหัวข้อ For Twitter Cards Meta คุณสามารถเพิ่มชื่อผู้ใช้ Twitter ของคุณในช่องที่ให้ไว้ได้ อย่าลืมคลิกปุ่ม อัปเดตโปรไฟล์ เพื่อบันทึกการเปลี่ยนแปลงของคุณอย่างถูกต้อง

ปลั๊กอินการ์ด JM Twitter

การ์ด Twitter ของ JM
แหล่งที่มาของภาพ: ภาพหน้าจอ – WordPress.org

JM Twitter Cards เป็นอีกหนึ่งปลั๊กอินที่ช่วยให้คุณสามารถรวม Twitter Cards เข้ากับเว็บไซต์ WordPress ของคุณได้อย่างง่ายดาย รองรับการ์ดทุกประเภท และไม่ขัดแย้งกับ Yoast SEO สิ่งนี้ช่วยให้คุณยังคงใช้คุณสมบัติ Yoast อื่น ๆ ได้หากคุณต้องการใช้ปลั๊กอินนี้สำหรับความต้องการการ์ด Twitter ของคุณ

เมื่อเปิดใช้งานปลั๊กอิน คุณสามารถไปที่หน้าตัวเลือกในแดชบอร์ด WordPress ของคุณได้โดยคลิกที่ JM Twitter Cards เพียงกรอกรายละเอียดที่ต้องการ เช่น ชื่อผู้ใช้ Twitter ประเภทการ์ด ขนาดรูปภาพ ตอนนี้ให้อัปโหลดรูปภาพทางเลือกที่จะแสดงหากไม่มีรูปภาพของโพสต์

คุณยังสามารถให้ข้อมูลเพิ่มเติมที่จะเชื่อมโยงไปยังร้านค้าอุปกรณ์เคลื่อนที่ต่างๆ เช่น Google Play และ Apple Store ซึ่งจะช่วยให้คุณสามารถโปรโมต แอป ที่อาจเชื่อมโยงกับเนื้อหาที่แชร์ได้ด้วยตนเอง การใช้แท็บ ประเภทโพสต์ ที่ด้านบนของหน้าตัวเลือก คุณสามารถเลือกเพิ่มเติมได้ว่าโพสต์ เพจ และ/หรือไฟล์แนบของคุณจะทำให้คุณมีโอกาสปรับแต่งการ์ด Twitter ของคุณแต่ละรายการเพิ่มเติมตามแต่ละโพสต์หรือไม่

เพิ่มการ์ด Twitter โดยไม่ต้องใช้ปลั๊กอิน

นักพัฒนาธีมและผู้ที่ต้องการทำให้โค้ดสกปรก สามารถใช้การ์ด Twitter ในธีม WordPress ได้อย่างง่ายดาย การใช้ธีมลูกของธีมเฉพาะที่คุณเปิดใช้งาน เพียงเพิ่มโค้ดต่อไปนี้ลงในไฟล์ function.php :

ฟังก์ชั่น my_twitter_cards() {
    ถ้า (is_singular()) {
        $ โพสต์ทั่วโลก;
	$twitter_user = str_replace('@', '', get_the_author_meta('twitter'));
	$twitter_url = get_permalink();
	$twitter_title = get_the_title();
	$twitter_excerpt = get_the_excerpt();
	$twittercard_image = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'เต็ม');
	$twittercard_thumb = $twittercard_image[0];
	ถ้า (!$twittercard_thumb) {
	    $twittercard_thumb = 'https://www.example.com/default-image.png';
	}
	ถ้า ($twitter_user) {
	    echo '<meta name="twitter:creator" value="@' . esc_attr($twitter_user) . '" />' . "\n";
	}
	echo '<meta name="twitter:card" value="summary" />' . "\n";
	echo '<meta name="twitter:url" value="' . esc_url($twitter_url) . '" />' . "\n";
	echo '<meta name="twitter:title" value="' . esc_attr($twitter_title) . '" />' . "\n";
	echo '<meta name="twitter:description" value="' . esc_attr($twitter_excerpt) . '" />' . "\n";
	echo '<meta name="twitter:image" value="' . esc_url($twittercard_thumb) . '" />' . "\n";
	echo '<meta name="twitter:site" value="@mhthemes" />' . "\n";
    }
}
add_action('wp_head', 'my_twitter_cards');

สิ่งที่เราทำที่นี่คือการสร้างฟังก์ชัน PHP ที่เรียกว่า my_twitter_cards ฟังก์ชันนี้เชื่อมโยงกับการดำเนินการ wp_head และกำหนดข้อมูลบางส่วนจากโพสต์ใดก็ตามที่กำลังดูอยู่ ให้กับตัวแปร PHP บางตัว อย่าลืมเปลี่ยนค่าสำหรับ $twitter_user ตามความต้องการส่วนตัวของคุณ และระบุ URL ของรูปภาพทางเลือกสำหรับ $twittercard_thumb ข้อมูลนี้จะถูกใช้เป็น ข้อมูลเมตา ของโพสต์ ข้อมูลนี้เองที่การ์ด Twitter ดึงและแสดงบนหน้าจอ

กำลังตรวจสอบ URL ของคุณ

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

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

ClickWhale - ตัวจัดการลิงค์ WordPress