[WordPress] 外掛分享: Lightweight and Responsive Youtube Embed

首頁外掛目錄 › Lightweight and Responsive Youtube Embed
WordPress 外掛 Lightweight and Responsive Youtube Embed 的封面圖片
40+
安裝啟用
★★★☆☆
3/5 分(2 則評價)
2761 天前
最後更新
問題解決
WordPress 3.0.0+ v1.0.0 上架:2017-10-08

內容簡介

如果你想要在你的網站上嵌入 YouTube 影片,那麼你就需要這個外掛程式。也許你知道,也許你不知道,預設的 YouTube 嵌入程式碼不是可響應的,在載入播放器時,你的瀏覽器需要從 YouTube 的伺服器下載超過 1MB 的資料。這太多了,這就是為什麼我們開發這個外掛程式的原因。影片播放器必須是輕巧和響應的。這就是這個外掛程式的好處。

這個外掛程式會取代預設的 YouTube 播放器,顯示影片的高品質縮圖和一個播放按鈕。真正的播放器和影片不會下載,直到你點擊播放按鈕或縮圖。這個簡單的技巧可以讓你的網站更輕量級、更快速,縮圖和播放器也會是可響應的。

我們的外掛程式只有 60KB,沒有任何不必要的功能或庫。

如果你正在優化你的網站速度,或者想要減少頁面載入時間,那麼這個外掛程式是你最好的選擇。

這個外掛程式可以:

自動使所有嵌入式 YouTube 影片具有響應性
減少你的頁面大小(嵌入影片的頁面)
加速你的網站
提升使用者體驗

你還可以:

使用 ‘thumb_url’ 參數為每個嵌入式影片手動插入不同的縮圖。

[youtube_embed url=”video_url” thumb-url=”custom_thumb_url”]

使用 ‘width’ 參數手動設置每個影片的不同寬度。

[youtube_embed url=”video_url” width=”50″]

手動將每個影片對齊到左邊、右邊或中間位置,使用 ‘align’ 參數。

[youtube_embed url=”video_url” align=”center”]

停用相關影片

停用影片控件
停用全屏選項
全局或單獨對影片進行對齊
為所有影片或僅為單個影片設置自定義影片寬度的短代碼參數

比較

這裡是使用內置的 TwentySeventeen 主題(沒有任何其他外掛)進行快速比較的結果。

我們在一個全新的空白頁面上放置了一個預設的 YouTube 影片嵌入程式碼,在執行測試之後,再用我們的解決方案替換並再次執行測試。

使用傳統的 YouTube 嵌入程式碼的總頁面大小:2.18MB
使用我們輕量級且具有響應性的嵌入程式碼的總頁面大小:472KB

使用傳統的 YouTube 嵌入程式碼的頁面載入時間:5.33 秒
使用我們輕量級且具有響應性的嵌入程式碼的頁面載入時間:2.52 秒

外掛標籤

開發者團隊

⬇ 下載最新版 (v1.0.0) 或搜尋安裝

① 下載 ZIP → 後台「外掛 › 安裝外掛 › 上傳外掛」
② 後台搜尋「Lightweight and Responsive Youtube Embed」→ 直接安裝(推薦)
📦 歷史版本下載

原文外掛簡介

If you are embedding Youtube video(s) into your site then you will need this plugin. As you may (or may not) know the default Youtube embed code is not responsive and in order to load the player itself your browser has to download more than 1MB of data from Youtube’s servers. That is way too much and this is the reason why we made this plugin. A video player has to be lightweight and responsive. Period.
This plugin is replacing the default Youtube player with the video’s high quality thumbnail and a play button. The real player and the video won’t load until you click on the play button or the thumbnail itself. With this easy trick you will have a much lighter and faster website and the thumbnail + the actual player will be responsive too.
Our plugin is only 60KB without any extra library or unnecessary function.
If you are speed-optimizing your site or if you want to reduce the loading times of your pages then you are at the right place.
This plugin will:

Make all of the embedded Youtube videos responsive automatically
Will reduce the size of your pages (where you have embedded videos)
Will make your site faster
Will improve the user experience

You can also:

Manually insert a different thumbnail for each embedded video with the ‘thumb_url’ parameter.
[youtube_embed url=”video_url” thumb-url=”custom_thumb_url”]

Manually set a different width for each video with the ‘width’ parameter.
[youtube_embed url=”video_url” width=”50″]

Manually align each video to left, right or center with the ‘align’ parameter.
[youtube_embed url=”video_url” align=”center”]

Disable the related videos

Disable the video controls
Disable the fullscreen option
Align the videos globally or individually
Set the custom video width for all videos or to just a single video with a shortcode parameter

Comparison
Here’s a quick comparison with the built-in TwentySeventeen theme (without any other plugin).
We placed a default Youtube video embed code in a new and empty page, ran the tests and then replaced it with our solution before running the tests again.
Total page size with the traditional Youtube embed code: 2.18MB
Total page size with our lightweight & responsive embedder: 472KB
Page load time with the traditional Youtube embed code: 5.33s
Page load time with our lightweight & responsive embedder: 2.52s

延伸相關外掛

文章
Filter
Mastodon