วิธีเพิ่มวิดีโอในบล็อก WordPress หรือเว็บไซต์ WordPress ของคุณเอง

มีหลายวิธีในการเพิ่มวิดีโอลงในหน้าเว็บไซต์ อาจเป็นปลั๊กอิน Video Gallery บางส่วน ปลั๊กอินบางส่วนที่คุณสามารถเพิ่มทั้งวิดีโอและรูปภาพ (เช่น Portfolios) และเพิ่มวิดีโอโดยใช้ปลั๊กอิน Slider

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

และเนื่องจากน่าสนใจกว่าที่จะมีเว็บไซต์แบบไดนามิกและทันสมัย ​​ฉันจะพยายามแนะนำสามวิธีในการเพิ่มวิดีโอในบล็อกหรือเว็บไซต์

• เพิ่มวิดีโอด้วยปลั๊กอินแกลเลอรีวิดีโอ
• เพิ่มวิดีโอด้วยปลั๊กอิน Slider
• เพิ่มวิดีโอด้วยปลั๊กอิน Portfolio

เป็นมูลค่าที่จะกล่าวถึงว่าวิดีโอที่ควรใช้ในค่าผ่านทางทั้งสามนี้ถูกนำมาจาก YouTube และ Vimeo เนื่องจากสำหรับวิดีโอประเภทไฟล์ mp4 จำเป็นต้องใช้ปลั๊กอินอื่น ๆ ซึ่งสนับสนุนไฟล์ประเภทนี้

ดังนั้น ปลั๊กอินแรกตามหลักเหตุผลและโดยทั่วไปคือปลั๊กอินแกลเลอรีวิดีโอ ซึ่งหาได้ง่ายในไดเร็กทอรีปลั๊กอินของ WordPress เพียงแค่ค้นหาด้วยชื่อเดียวกันทุกประการ

หลังจากค้นหาและเปิดใช้งานปลั๊กอินแล้ว ก็ถึงเวลาเพิ่มวิดีโอลงในปลั๊กอินแกลเลอรีวิดีโอ ในโพสต์นี้มีการนำเสนอวิดีโอแคทวอล์คแฟชั่นโชว์ฤดูใบไม้ร่วงฤดูหนาวปี 2017 และฤดูใบไม้ผลิฤดูร้อนปี 2017 ดังนั้นเมื่อผู้สร้างเว็บไซต์ไปที่หน้าจากตำแหน่งที่งานจะพบปุ่ม "เพิ่มแกลเลอรีวิดีโอใหม่" สามารถพบได้

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

ที่จริงแล้ว จากภาพหน้าจอที่เพิ่มชื่อ คำอธิบายและลิงก์ URL จะพร้อมใช้งานทันทีหลังจากใส่ URL แต่ฉันชอบที่จะทำหลังจากอัปโหลดวิดีโอทั้งหมดแล้ว ดังนั้น หลังจากอัปโหลดวิดีโอแล้ว รูปภาพขนาดย่อของวิดีโอต่อไปนี้จะปรากฏขึ้น:

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

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

ในภาพหน้าจอ จำนวนการดูคือ 0 เท่านั้น เนื่องจากฉันยังไม่ได้เผยแพร่หน้า

ตัวเลือก URL ซึ่งว่างเปล่าอีกครั้งในกรณีของฉัน หมายถึงข้อมูลเพิ่มเติม ตัวอย่างเช่น หากฉันต้องการแสดงวิดีโอเพิ่มเติมเกี่ยวกับแคทวอล์คของ Christian Dior หรือให้ข้อมูลส่วนบุคคลเกี่ยวกับชีวิตและประสบการณ์การทำงาน การพัฒนาแบรนด์ของเขา ฯลฯ ปุ่ม "ดูเพิ่มเติม" (ลิงก์ URL เดียวกัน) ก็เข้ามาช่วยฉัน

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

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

ดังนั้น เมื่อไม่สามารถใช้มุมมอง Blog Style Gallery กับประเภทบล็อกของฉัน มุมมองอื่นๆ จะดูดีในการแสดงวิดีโอ ฉันไม่ชอบมุมมองเนื้อหา-ป๊อปอัปมากนักเนื่องจากแว่นขยายแบบโฮเวอร์ และทำให้รูปแบบและประเภทแกลเลอรีของฉันไม่สะดวกเล็กน้อย

แต่จริงๆ แล้ว การลบออกได้โดยใช้โค้ด CSS

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

ในขณะที่มุมมอง Slider จะหมุนวิดีโอด้วยเอฟเฟกต์การเปลี่ยนภาพที่แตกต่างกัน สำหรับฉัน ในกรณีของแกลเลอรีวิดีโอ เอฟเฟกต์การเปลี่ยนภาพที่สวยงามของแถบเลื่อนนั้นไม่สำคัญและมีความเกี่ยวข้องเพียงพอ ในขณะที่ในกรณีของรูปภาพ เอฟเฟกต์เหล่านี้สามารถทำให้หน้าดูโดดเด่นและสดใสได้

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

มุมมองไลท์บ็อกซ์และภาพขนาดย่อกำลังแสดงวิดีโอโดยไม่มีคำอธิบาย เพียงแสดงชื่อในขณะที่วางเมาส์บนวิดีโอ

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

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

หลังจากสร้างแกลเลอรีแล้ว ก็ถึงเวลาที่แน่นอนในการเพิ่มลงในเพจ โพสต์ หรือแม้แต่เทมเพลต ในการดำเนินการนี้ ผู้สร้างเว็บไซต์ต้องคัดลอกรหัสย่อแล้ววางลงในหน้าหรือโพสต์ที่เหมาะสม

ตอนนี้ส่งผ่านไปยังปลั๊กอิน POWr Multi Slider แล้วดูว่าจะเพิ่มวิดีโอด้วยเครื่องมือนี้ได้อย่างไร ในปลั๊กอินนี้ ปลั๊กอินนี้ไม่เพียงแต่รองรับวิดีโอเท่านั้น แต่ยังรองรับรูปภาพ แบนเนอร์ เอกสารและกิจกรรมอีกด้วย

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

เริ่มจากการเพิ่มวิดีโอ ในกรณีนี้ เช่นเดียวกับในปลั๊กอินอื่น ๆ ผู้สร้างเว็บไซต์สามารถเพิ่มวิดีโอลงในปลั๊กอินด้วย URL เท่านั้น น่าเสียดายที่การปรับแต่งสไลด์วิดีโอมีเพียงสองฟังก์ชันเท่านั้น: ซ่อนตัวควบคุมการเล่นและชื่อวิดีโอไฮฟ์

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

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

ขั้นตอนต่อไปคือการเพิ่มรูปภาพ ฉันถ่ายภาพจากวิดีโอโดยตรง

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

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

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

โดยรวมแล้ว หลังจากเพิ่มเนื้อหาลงในแถบเลื่อนแล้ว ก็เป็นเวลาที่เหมาะสมในการทำงานกับการออกแบบ หลังจากทดสอบตัวเลือกบางอย่าง เอฟเฟกต์การเปลี่ยน ลูกศร และตัวเลือกอื่นๆ ตัวเลื่อนก็พร้อมใช้งานอย่างสมบูรณ์ เพื่อบันทึกตัวเลื่อน ปลั๊กอินนี้ต้องมีข้อมูลการเข้าสู่ระบบบัญชีโซเชียลของผู้ใช้รายใดรายหนึ่ง

สำหรับฉัน เรื่องนี้ค่อนข้างแปลกและไม่สะดวก อย่างไรก็ตาม นี่เป็นข้อกำหนดของปลั๊กอิน และหากไม่มี แถบเลื่อนจะไม่ถูกเผยแพร่

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

หลังจากกดปุ่ม เพิ่มใหม่ ปลั๊กอินจะมีสื่อสามประเภทที่แตกต่างกัน ซึ่งสามารถเพิ่มได้: รูปภาพ วิดีโอ และลิงก์

ภาพขนาดย่อของวิดีโอสามารถอัปโหลดจากพีซีหรือนำมาจาก YouTube หลังจากคลิกที่ “คลิกที่นี่เพื่อรับข้อมูลวิดีโอและแบบฟอร์มย่อ” ภาพขนาดย่อของวิดีโอ YouTube จะปรากฏขึ้น

ในอีกด้านหนึ่งของปลั๊กอินนี้ ตัวเลือกที่ปรับแต่งได้มากมายนั้นไม่มีอยู่จริง แต่ในทางกลับกัน มันใช้งานง่ายจากแง่มุมของการสร้างแกลเลอรีวิดีโอ หลังจากทั้งหมด หน้าต่อไปนี้จะปรากฏขึ้น มีการเพิ่มข้อมูลเกี่ยวกับโพสต์และรหัสย่อที่นี่

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

โดยรวมแล้ว ในบทความนี้ ฉันได้นำเสนอสามวิธีในการเพิ่มวิดีโอไปยังเว็บไซต์หรือโพสต์ มีวิธีอื่นในการเพิ่มวิดีโอโดยไม่ต้องสงสัย แต่ทั้งสามวิธีนี้ดูเหมือนจะเป็นวิธีพื้นฐานและง่ายที่สุด

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

พวกเขาจะไม่เพียงแต่เรียนรู้ แต่ยังสอนผู้เข้าชมด้วยประสบการณ์และผลลัพธ์ที่ยอดเยี่ยม

ประวัติ:
ฉันชื่อแอนนา. ฉันรักการสร้างและเย็บชุด สำหรับการสร้างเว็บไซต์เชิงพาณิชย์ (ร้านค้า) และการขายชุดของฉัน ฉันใช้ WordPress พร้อมปลั๊กอินที่ยอดเยี่ยม ฉันไม่ใช่นักพัฒนาเว็บไซต์หรือผู้เชี่ยวชาญในการสร้างเว็บไซต์ แต่ปลั๊กอินทั้งหมดที่ฉันใช้นั้นง่ายมากและช่วยให้ฉันบรรลุเป้าหมายและแม้กระทั่งความฝัน

ดังนั้น หากคุณมีข้อเสนอแนะหรือคำแนะนำใดๆ โปรดติดต่อฉันได้ที่ LinkedIn