วิธีฝังวิดีโอใน WordPress (YouTube + More)

เผยแพร่แล้ว: 2020-09-02

ไม่แน่ใจว่าจะฝังวิดีโอใน WordPress ได้อย่างไร?

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

โชคดีที่ WordPress มีเครื่องมือและวิธีการมากมายที่คุณสามารถใช้เพื่อฝังวิดีโอในเนื้อหาของคุณ

ในโพสต์นี้ เราจะพูดถึงพวกเขาให้ได้มากที่สุด ไม่ว่าคุณจะใช้ตัวแก้ไขบล็อก (Gutenberg), ตัวแก้ไขแบบคลาสสิก หรือ Elementor เราจะแสดงวิธีฝังวิดีโอจาก YouTube, Vimeo, เซิร์ฟเวอร์ของคุณเอง และวิธีการอื่นๆ อีกมากมาย เราจะแชร์เคล็ดลับอื่นๆ เช่น วิธีฝังวิดีโอส่วนตัวที่ผู้ดูของคุณจะไม่สามารถแชร์ได้

ไม่ว่าคุณจะทำงานในสถานการณ์ใด คุณควรมีความรู้ที่คุณต้องการในตอนท้ายของโพสต์นี้

สารบัญ

  • วิธีการฝังวิดีโอใน WordPress
  • วิธีฝังวิดีโอใน WordPress Gutenberg Editor
  • วิธีฝังวิดีโอใน WordPress Classic Editor (TinyMCE)
  • วิธีฝังวิดีโอใน Elementor
  • วิธีฝังวิดีโอ YouTube ใน WordPress
  • วิธีฝังวิดีโอในแถบด้านข้างของ WordPress
  • วิธีฝังวิดีโอจากแหล่งอื่น (Vimeo, DailyMotion เป็นต้น)
  • วิธีการโฮสต์วิดีโอด้วยตนเองบน WordPress
  • วิธีฝังวิดีโอส่วนตัวสำหรับไซต์/หลักสูตรสมาชิก WordPress
  • ฝังวิดีโอใน WordPress ด้วยวิธีที่ง่ายที่สุด — ด้วย Elementor

วิธีฝังวิดีโอในบล็อกโพสต์และเพจของ WordPress

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

เพื่อให้แน่ใจว่านี่เป็นคำแนะนำที่ครอบคลุม เราจะอธิบายแต่ละตัวเลือกอย่างละเอียด ซึ่งหมายความว่าจะมีการทับซ้อนกันระหว่างส่วนต่างๆ ตัวอย่างเช่น เมื่อเราแสดงวิธีการฝังวิดีโอใน Elementor เราจะใช้ YouTube เป็นตัวอย่าง

มาขุดกัน…

วิธีฝังวิดีโอใน WordPress Block Editor (Gutenberg)

หากคุณกำลังใช้ตัวแก้ไขบล็อกของ WordPress AKA Gutenberg มันมาพร้อมกับบล็อกในตัวเพื่อช่วยให้คุณฝังวิดีโอจากแหล่งต่างๆ เราจะแสดงให้คุณเห็นว่าการบล็อกเหล่านี้ทำงานอย่างไรกับ YouTube แต่การดำเนินการพื้นฐานเดียวกันนี้ถือเป็นจริงสำหรับบริการวิดีโออื่นๆ

ในการเริ่มต้น คุณต้องเพิ่มบล็อก YouTube ที่คุณต้องการฝังวิดีโอของคุณ:

WordPress YouTube Block

จากนั้นวางใน URL โดยตรงไปยังวิดีโอ (คัดลอกมาจากแถบที่อยู่ของเบราว์เซอร์ของคุณ) และคลิกที่ฝัง จากนั้นคุณควรดูตัวอย่างวิดีโอของคุณในโปรแกรมแก้ไข:

the embed option in the youtube block

ตัวแก้ไขบล็อกมาพร้อมกับบล็อกการฝังวิดีโอโดยเฉพาะสำหรับบริการต่อไปนี้:

  • YouTube
  • Vimeo
  • Animoto
  • เดลี่โมชั่น
  • Screencast
  • ติ๊กต๊อก
  • VideoPress

WordPress.tv

วิธีฝังวิดีโอใน WordPress Classic Editor (TinyMCE)

หากคุณไม่ได้ใช้ตัวแก้ไขบล็อก WordPress ใหม่ คุณยังสามารถฝังวิดีโอได้อย่างง่ายดายโดยใช้ตัวแก้ไข Classic TinyMCE

ตัวแก้ไขแบบคลาสสิกรวมการผสานรวมแบบฝังทั้งหมดเหมือนกับตัวแก้ไขบล็อกใหม่ ไม่ได้ทำให้ชัดเจนเพราะไม่มี "บล็อก" สำหรับแต่ละแหล่งที่มา

หากต้องการใช้การผสานรวมแบบฝังเหล่านี้ สิ่งที่คุณต้องทำคือวางใน URL โดยตรงไปยังแท็บ Visual ของตัวแก้ไขแบบคลาสสิก จากนั้น WordPress จะฝังวิดีโอให้คุณโดยอัตโนมัติ


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

อ่านบทความเกี่ยวกับโค้ด HTML ในบล็อกของเราเพื่อรับคำแนะนำที่ดีที่สุดในการเขียนเนื้อหาเว็บ

a gif of Embedding the video

คุณสามารถใช้แนวทางเดียวกันนี้กับแพลตฟอร์มอื่นๆ เช่น Vimeo, DailyMotion เป็นต้น

วิธีฝังวิดีโอใน Elementor

Elementor มี Videowidget ของตัวเองซึ่งทำให้ง่ายต่อการฝังวิดีโอในเนื้อหาของคุณ

ในการเริ่มต้น ให้เพิ่มวิดเจ็ต วิดีโอ ลงในตำแหน่งที่คุณต้องการรวมวิดีโอไว้ในเนื้อหาของคุณ จากนั้นเลือกแหล่งที่มาจากสี่ตัวเลือก:

  • YouTube
  • Vimeo
  • เดลี่โมชั่น
  • โฮสต์เอง

เมื่อคุณเลือกแล้ว สิ่งที่คุณต้องทำคือวางลิงก์ของวิดีโอ หากคุณมี Elementor Pro คุณสามารถใช้คุณลักษณะเนื้อหาแบบไดนามิกเพื่อแทรกลิงก์วิดีโอแบบไดนามิกจากฟิลด์ที่กำหนดเองได้

จากนั้นกำหนดการตั้งค่าอื่นๆ ตามที่คุณต้องการ ตัวอย่างเช่น คุณสามารถเล่นวิดีโออัตโนมัติ ปิดใช้การควบคุมโปรแกรมเล่น และอื่นๆ

Elementor's Video Widget

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

ด้วย Elementor Pro คุณจะสามารถเข้าถึงวิดเจ็ต Media Carousel ซึ่งช่วยให้คุณสร้างภาพหมุน/ตัวเลื่อนที่รวมวิดีโอที่ฝังไว้จาก YouTube หรือ Vimeo ในการตั้งค่าของวิดเจ็ต ให้เลือก วิดีโอ สำหรับประเภทสไลด์และ:

  • เพิ่มภาพขนาดย่อ

ป้อนลิงก์ไปยังวิดีโอ YouTube หรือ Vimeo ในกล่อง ลิงก์วิดีโอ

Elementor's Media Carousel Widget

ด้วยโปรแกรมเสริม Elementor บุคคลที่สาม คุณสามารถเข้าถึงวิดเจ็ตเพิ่มเติมเพื่อช่วยให้คุณทำงานกับวิดีโอใน Elementor ตัวอย่างเช่น Ultimate Addons สำหรับ Elementor ให้วิดเจ็ตแกลเลอรีวิดีโอที่กรองได้ใหม่