內容簡介
此外掛可提升頁面載入速度，因為它只會在頁面載入時載入 YouTube 影片預覽圖片。並且還提供了一個選項/功能，讓您的影片可以在用戶滾動視窗時粘在視窗的側邊（頂部/底部）。
功能
– 延遲加載影片。不需要擔心複雜的設置。
– 支持在單個頁面上瀏覽多個影片。同時只會播放一個影片。如果您播放其他的影片，本影片會暫停播放。
– 當您滾動視窗並移出影片視窗時，本影片會自動粘在視窗底部/頂部。
– 您也可以添加自己的自定義樣式。
使用方法
– 在文章/頁面（WP 編輯器）上點擊“LLVASC”按鈕，生成 shortcode。這將顯示一個彈出窗口，在其中可以添加 YouTube 影片 ID；「Video ID」是您的 YouTube 影片末尾的唯一字母數字代碼。例如：https://www.youtube.com/watch?v=iXGoAj7IEys，那么 iXGoAj7IEys 就是影片 ID。添加 ID 後，點擊「確定」，然後 shortcode 將添加到您的內容中。
– 將 shortcode 添加到您的頁面/文章/內容類型上：[lazy-load-videos-and-sticky-control id=”Youtube-video-ID”]。因此，在您的內容中，應使用 [lazy-load-videos-and-sticky-control id=”iXGoAj7IEys”]。
– 儲存/更新。
– 預覽您的頁面。如果您想要調整一些樣式，可以從「概述」選項卡中添加您自己/自定義的 CSS。
示範: https://preview-plugin.web.app/lazy-load-videos-and-sticky-control.html
外掛標籤
開發者團隊
② 後台搜尋「Lazy load videos and sticky control」→ 直接安裝（推薦）
原文外掛簡介
This plugin improves page load times by lazy loading videos and displaying only the video preview image until playback begins. It now supports YouTube, Vimeo, Wistia, Dailymotion, JW Player, and self-hosted HTML5 videos, with built-in sticky video functionality that keeps videos visible at the top or bottom of the screen when users scroll away from the video viewport.
Features
Lazy Load Videos: Reduce initial page load by showing only video thumbnail preview image first.
Multiple Video Support: Add more than one video to a page. Only one video plays at a time, and the other video pauses automatically.
Sticky Video: Keep videos visible as you scroll by pinning them to the top or bottom of the screen.
Multi-Platform Support: Use YouTube, Vimeo, Wistia, Dailymotion, JW Player, or self-hosted HTML5 videos.
Custom Styling: Adapt the video presentation with your own CSS.
Usage
Method 1: Using the Classic Editor (WP Editor)
Generate Shortcode in WP Editor:
Open the post/page where you want to add your video.
In the WordPress editor, click on the LLVASC icon. This will open a popup window.
In the popup, add your video ID. For YouTube, Vimeo, Wistia, Dailymotion, and JW Player, use only the video ID, not the full URL.
After entering the video ID, click “Ok”. This generates and inserts a shortcode into your content.
Shortcode Format:
The shortcode added to your content will look like this:
[lazy-load-videos-and-sticky-control type=”youtube” id=”iXGoAj7IEys”]
Example shortcodes:
[lazy-load-videos-and-sticky-control type=”vimeo” id=”76979871″]
[lazy-load-videos-and-sticky-control type=”wistia” id=”26sk4lmiix”]
[lazy-load-videos-and-sticky-control type=”dailymotion” id=”x75iqs7″]
[lazy-load-videos-and-sticky-control type=”jwplayer” id=”hWF9vG66″]
[lazy-load-videos-and-sticky-control type=”html5″ url=”YOUR_VIDEO_URL”]
Save/Update:
Save or update your post/page to apply the changes.
Preview and Customize:
Preview your page to see the embedded video.
If you need to adjust the styling, you can add custom CSS in the General tab of the plugin settings.
Method 2: Using Gutenberg Block
Add a Block:
Open the post/page where you want to add your video using the Gutenberg editor.
Click on the “+” icon to add a new block.
Select the LLVASC Block:
Search for the “LLVASC” block in the block library.
Add this block to your content.
Enter YouTube Video ID:
In the LLVASC block settings, select your video platform and enter the matching video ID. For HTML5, use the media picker to choose the video file.
Save/Update:
Save or update your post/page to apply the changes.
Preview and Customize:
Preview your page to see the embedded video.
Customize the block settings as needed to adjust the appearance and functionality.
Demo Preview
Demo
