
內容簡介
Smart LazyLoad 是一款免費、簡單且輕量的延遲加載外掛,能有效提升 WordPress 網站的頁面速度、性能及 Core Web Vitals 分數。它不僅延遲加載圖片,還支援影片、iframe 及其他多種媒體格式。
【主要功能】
• 延遲加載圖片、影片及 iframe
• 支援響應式 <picture> 來源延遲加載
• 自動處理 Gravatars 和作者照片
• 提供全站及單篇文章的控制選項
• 簡單設定,啟用即刻生效
• 可選擇 YouTube 點擊播放縮圖
外掛標籤
開發者團隊
② 後台搜尋「Smart LazyLoad – Lazy Load Images, Videos and Iframes」→ 直接安裝(推薦)
原文外掛簡介
Smart LazyLoad is a free, simple, and lightweight lazy loading plugin. Lazy load WordPress images, videos, and iframes to improve page speed, website performance, and Core Web Vitals scores.
Most lazy load plugins stop at optimize images. Smart LazyLoad also defers responsive
A Master Switch for the whole site.
A per-post override, so a single post or page can behave differently from everything else.
The rest lives on one settings screen: choose what to lazy load, tune performance, decide how placeholders look, and exclude anything that shouldn’t be touched.
📦 What gets lazy loaded?
Images — post and page content, featured images, widget images, and comments. Switch on Full-Page Lazy Loading and it also covers markup hardcoded in your theme’s templates.
Responsive . The browser still picks the format and crop it wants; only the timing changes.
Avatars — Gravatars and author photos, which usually sit far below the fold in long comment threads.
Smilies — text smilies (e.g. :mrgreen:) that WordPress renders as image files. Smilies rendered as Unicode emoji are left untouched.
Background images — an inline style="background-image" built from a single url(), or a manual data-bg attribute. Gradients, image-set(), and multi-layer backgrounds are deliberately left untouched.
Iframes — any embedded iframe, including YouTube and Vimeo players.
YouTube click-to-play thumbnails — an optional mode that swaps the YouTube iframe for a light, clickable thumbnail until someone actually wants to watch. Thumbnails are served as WebP, with an automatic fallback.
Native
🎛️ Two layers of on/off control
A Master Switch turns the whole plugin on or off for the site
Switch it off and every other setting is dimmed, so nothing gets changed by mistake. Nothing is cleared either — turn it back on and your configuration is exactly as you left it
A Lazy Load dropdown in the post editor sidebar — Default, Enable, or Disable — lets one post override the site-wide setting, leaving every other post alone
⚡ Performance tuning
Skips the first image on the page, and any image WordPress marks as your largest above-the-fold image, to protect your Largest Contentful Paint (LCP)
Excluded elements also lose WordPress’s own loading="lazy", so they really do load straight away
Adjustable distance-from-viewport threshold, so loading starts as early or as late as you like
Use the plugin’s IntersectionObserver engine, or hand the job to the browser’s native loading="lazy"
Scan the whole page, or only post content, widgets, and comments — full coverage or the lightest possible footprint
Always loads its script in the footer, with an optional defer on top, so it never blocks rendering
Can be turned off for logged-in users, so you always see full-quality content while editing
🎨 Appearance while content loads
Low-quality image placeholder (LQIP): a tiny blurred preview of the real image instead of a blank box
Previews are built in the background and cached, so no visitor ever waits for one
Pick which registered image size the preview is built from
Adjustable fade-in for the moment content arrives, skipped for visitors who prefer reduced motion
Every deferred image holds its exact final size from the first paint, so nothing jumps when it arrives
Optional placeholder background colour, shown only until the real image is there
🧩 Compatibility and control
A custom exclude field — list your own CSS classes, one per line or separated by commas. No code needed
Recognises the usual exclusion markers already: no-lazyload, skip-lazy, data-no-lazyload, data-no-lazy, data-skip-lazy
Stays out of the way inside page builder editors (Elementor, Avada, Divi, Beaver Builder, WPBakery, Oxygen) and on feeds, previews, and REST requests
Developer filters for placeholders, threshold, exclusions, YouTube thumbnails, and the final markup
WP-CLI commands to build or clear image previews across the whole media library
One-click “Reset to Defaults” whenever you want to start over
🛠️ Built the right way
No jQuery. The frontend script is plain JavaScript built on IntersectionObserver
noscript fallbacks, so content is never lost for visitors or crawlers without JavaScript
A responsive, card-based settings screen
Clean uninstall: removes its own options and post meta when you delete the plugin, and nothing else
Configuration
Site-wide settings: Settings → LazyLoad
The settings screen is organized into five cards:
Master Switch — the single toggle that turns Smart LazyLoad on or off for the entire site. When it’s off, every card below it is dimmed and cannot be edited, but nothing about your saved configuration changes.
What to Lazy Load — a separate toggle for each type: Images, Responsive
Performance — Skip First Image (for LCP), Threshold Distance, Use Native Browser Lazy Loading, Defer LazyLoad JavaScript, and Disable for Logged-in Users.
Appearance — Low-Quality Image Placeholder and its source size, an optional Placeholder Background Colour, and the Fade-in Duration.
Advanced — Full-Page Lazy Loading, and a Custom Exclude Selectors box where you list CSS classes to skip — one per line, or separated by commas.
A Reset to Defaults button at the bottom restores every option to its original value in one click.
Per-post override
Open any post, page, or public custom post type in the block editor and look for the Smart LazyLoad panel in the sidebar. Its Lazy Load dropdown has three choices:
Default (On) or Default (Off) — label reflects the current Master Switch state; this post simply follows the site-wide setting
Enable — lazy loading is always on for this post, even if the Master Switch is off
Disable — lazy loading is always off for this post, even if the Master Switch is on
The choice is saved as post meta and applies only to that single post — nothing else on the site is affected.
Developer filters
Every filter is prefixed smart_lazyload_.
smart_lazyload_enabled — return `false` to disable lazy loading for the current request.
smart_lazyload_svg_placeholder — replace the default inline SVG placeholder used for images.
smart_lazyload_placeholder — replace the placeholder value used for deferred iframes (default: `about:blank`).
smart_lazyload_excluded_attributes — extend the list of strings that exclude an image, video, or background-image tag from lazy loading.
smart_lazyload_iframe_excluded_patterns — extend the list of strings that exclude an iframe tag from lazy loading.
smart_lazyload_excluded_src — extend the list of substrings checked against an image or background-image URL itself (not just its surrounding tag) to exclude it from lazy loading; useful for dynamic image generators or known placeholder assets.
smart_lazyload_threshold — override the distance-from-viewport threshold, in pixels.
smart_lazyload_youtube_resolution — choose the YouTube thumbnail resolution: `default`, `mqdefault`, `hqdefault` (the default), `sddefault`, or `maxresdefault`.
smart_lazyload_exclude_youtube_thumbnail — return an array of strings; any YouTube iframe whose markup contains one of them keeps a real iframe instead of the click-to-play player.
smart_lazyload_html — filter the processed markup after every lazy-load pass has run.
The former do_smart_lazyload and smll_threshold names still work, so existing snippets keep running.
