WordPress 文章編輯器如何正確新增或上傳影片？

WordPress是非常主流的網站建置工具，但同時它也相當令人頭疼，三不五時就會出現狀況，在國內缺乏相關教學與論壇的情況下，初學者往往會因為找不到解法便棄坑......但偏偏許多時候又不得不使用它，因此為了給予WordPress初學者一些希望，之後會定期挑些常見的問題來分享，這次就來談談文章上傳影片的方式及會遇到哪些問題吧～

當在 WordPress 中撰寫文章時，可以透過以下方式在文章內添加影片

【使用預設編輯器】

• 使用內建的文章編輯器 Gutenberg 來新增影片。

  • 此種方式最為陽春與直覺，是WP預設的編輯方式，可點擊【新增媒體】從檔案或連結插入；但實際上若是從檔案庫中插入影片，可能會發生桌上型裝置正常顯示，手機端卻出問題的情況，主要是由於此方式是將檔案庫中影片，按「完整尺寸」嵌入，導致影片尺寸過大，超出手機畫面而無法顯示。

【使用外掛輔助解決】

•  使用Elementor編輯器外掛編輯文章頁面，並新增影片

  • Elementor可以理解成WordPress的進階外掛編輯，可以進行更細節的設定與外觀調整，相當程度更能客製化文章頁面，不過操作介面較複雜，且須具有基本的網頁程式碼概念，對於初學者來說不易消化。使用Elementro編輯器的話，可以透過左上角的「+」號來新增媒體，再從左側編輯面板直接上傳影片或置入影片連結。

• 使用Html5 Video Player，將影片以Short Code短代碼新增影片

  • 將影片以『Short Code形式』製作成獨立元件（姑且這樣理解吧）之後只要把Short Code複製並貼上到文章中即可成功插入，可以解決因為尺寸關係導致手機端無法顯示的問題。另外也能在製作Short Code的過程中透過編輯器自訂義蠻多細節的，比如說元件的標題、封面縮圖、是否循環播放、自動播放...等設定

• • 使用教學：

    >>安裝『Html5 Video Player』

    >>若要安插主機上的影片到文章中的話，可以從(面板左側)【媒體_媒體庫】找到主機上的所有影片，複製網址 / 若是YT可以直接複製影片連結。

    >>至(面板左側)【Html5 Video Player】，點選Add New Player新增。

    >>KEY上影片對應的標題，將剛剛複製的連結網址貼上（右側可以調整屆時影片的外觀之類的設定）。

    >>發佈（此發佈非文章或頁面發佈，而是發佈並建立成Short Code元件) >>將Short Code複製到文章預設編輯器那直接貼上；或透過安裝後預設編輯器新增的【Html5 Video Player】按鈕，將已建立好的Short Code丟到文章上（直接在打文章的地方，找位置複製貼上即可）

 

GPT-4 與 Pinecone 共同孕育的 AI 小寶貝： BabyAGI ，陪伴您成長的得力助手！｜Accucrazy 肖準行銷

Jarvis 的現實化身：AutoGPT，市場調查與競爭分析的全方位數位諸葛亮！｜Accucrazy 肖準行銷

從 AI 到 AIGC ：一場革命性的科技進化論，正活生生在我們眼前上演！｜Accucrazy 肖準行銷

RLHF ：從人類的反饋中學習，引領大型語言模型走向新境界！｜Accucrazy 肖準行銷

開啟記憶之鑰：1 分鐘教你掌握 RNN 與 LSTM 數據預測的秘密！｜Accucrazy 肖準行銷

---

原文出處：https://www.accucrazy.com/article-upload-tutorial/