前言介紹
- 這款 WordPress 外掛「ShortPixel Critical CSS」是 2022-08-01 上架。 目前已經下架不再更新，不建議安裝使用。
- 目前有 600 個安裝啟用數。
- 上一次更新是 2024-09-20，距離現在已有 226 天。
- 外掛最低要求 WordPress 4.7 以上版本才可以安裝。
- 外掛要求網站主機運作至少需要 PHP 版本 5.6 以上。
- 有 3 人給過評分。
- 論壇上目前有 1 個提問，問題解答率 100% ，不低，算是個很有心解決問題的開發者團隊了！
外掛協作開發者
外掛標籤
seo | Optimize | speed up | Critical CSS | above-the-fold |
內容簡介
使用 ShortPixel Critical CSS 外掛程式，您的網站能自動產生 「網頁視窗外CSS」 ，使網站加載速度加快，且測試工具 PageSpeed Insights 或 GTmetrix 能給出更高的分數。
如何運作？
- ShortPixel的「Critical CSS」（ CCSS ）外掛程式使用我們最新的服務生成網站頁面的「Critical CSS」。
- 生成的「Critical CSS」將被插入到網頁中，同時原本的.css檔案會被延遲。這使得頁面加載速度變快。
- 外掛程式開始對每個訪問的網頁進行CCSS生成，並從ShortPixel Critical CSS服務中檢索它。這是用 WP CRON 工作進行的，可在不干擾用戶或減慢網站速度的情況下在後台運行。
- 編輯後的頁面將自動生成「Critical CSS」 。
功能
- 可根據頁面 URL 或每個頁面模板的 Critical CSS 規則配置 Critical CSS外掛程式，以幫助優化需要的 CCSS 文件數量。
- 額外的靈活性：網站管理員可以手動配置其他需要包含在生成的Critical CSS中的Critical CSS次重要規則 。
- 如果 WP Rocket 和 Elementor存在，則我們的外掛程式將與它們集成，以便利用緩存支援並更有效地提供Critical CSS。
目前，此外掛程式在 BETA 版本時是 100％ 免費使用。只需在您的網站上安裝它，進行配置，然後使用工具如 Google PageSpeed Insights 或 GTmetrix進行測試即可。
如有任何疑問或支援需求，請直接聯繫我們，請點選此處。
原文外掛簡介
With ShortPixel Critical CSS plugin, your website can automatically generate above-the-fold CSS for your web pages.
This means your website will load faster and get better scores with online testing tools like PageSpeed Insights or GTmetrix.
IMPORTANT NOTICE: Plugin closure!
We would like to inform you that the ShortPixel Critical CSS plugin and criticalcss.co service will be closed starting December 1st, 2024, and will no longer be available.
The Critical CSS functionality has now been integrated into the FastPixel Caching plugin, and we highly recommend transitioning to this new plugin as soon as possible to ensure continued functionality and support.
If you have any questions, please feel free to contact us at [email protected].
How it works?
ShortPixel’s Critical CSS (CCSS) plugin uses our brand new service to generate the critical CSS for your website’s pages.
The generated CCSS is inserted into the web pages while the original .css files are deferred. This makes the pages load faster.
The plugin starts generating the CCSS for each visited page and retrieves it from the ShortPixel Critical CSS Service. This is done using WP CRON jobs that run in the background without user intervention and without slowing down the website.
The edited pages will have the CCSS automatically generated.
Features
The CCSS plugin can be configured to keep Critical CSS rules based on the page URL or for each page template. This can help optimize the number of CCSS files needed.
Additional flexibility: the website administrator can manually configure additional Critical CSS rules to be included in the generated Critical CSS.
Our plugin integrates with WP Rocket and Elementor, if they are present, in order to leverage the cache support and deliver Critical CSS more effectively.
The plugin was forked from the WP Critical CSS plugin, modified to use ShortPixel’s Critical CSS service and enhanced with new features.
Currently, the plugin while in its BETA version, is 100% free to use. Just install it on your website, configure it and test the results with a tool like Google PageSpeed Insights or GTMetrix
For questions or support, please contact us directly here
Other plugins by ShortPixel
FastPixel Caching – WP Optimization made easy
ShortPixel Image Optimizer – Image optimization & compression for all the images on your website, including WebP & AVIF delivery
ShortPixel Adaptive Images – On-the-fly image optimization & CDN delivery
Enable Media Replace – Easily replace images or files in Media Library
reGenerate Thumbnails Advanced – Easily regenerate thumbnails
Resize Image After Upload – Automatically resize each uploaded image
WP SVG Images – Secure upload of SVG files to Media Library
各版本下載點
- 方法一：點下方版本號的連結下載 ZIP 檔案後，登入網站後台左側選單「外掛」的「安裝外掛」，然後選擇上方的「上傳外掛」，把下載回去的 ZIP 外掛打包檔案上傳上去安裝與啟用。
- 方法二：透過「安裝外掛」的畫面右方搜尋功能，搜尋外掛名稱「ShortPixel Critical CSS」來進行安裝。
（建議使用方法二，確保安裝的版本符合當前運作的 WordPress 環境。
0.9.9 | 1.0.0 | 1.0.1 | 1.0.2 | 1.0.3 | 1.0.4 | 1.0.5 | trunk | 0.9.10 |
延伸相關外掛（你可能也想知道）
Autoptimize criticalcss.com power-up 》此外掛將 Autoptimize 擴充，以自動創建臨界 CSS 樣式規則。這些規則會將正確的臨界 CSS 寫入不同類型的頁面中，以確保在載入完整 CSS 之前即可顯示這些頁面...。
WP Critical CSS 》這個外掛會自動向 CriticalCSS.com 網站服務取得每個網站頁面所需的重要 CSS，以幫助改善使用者體驗和網站速度。這通常是 Google Pagespeed 推薦完成的最後一...。
Smart Image Loader 》Smart Image Loader 只會載入在網站初始視窗中可見的圖片，在任何位置 “Below the Fold”（超出目前視窗範圍）的圖片之前。這些圖片可以在可見圖...。
Inline JS Block for Gutenberg 》行內 JS 區塊可協助添加置於畫面上方的 JS，或滿足您的進階個人化需求。, 注意：必須添加 JS Script 標籤以執行 JS 代碼，請務必加入這些標籤以編譯您的代碼。。
Lazy Load Fix for Divi 》**總結：**, - 該外掛提供細緻的控制，手動設置 Divi 頁面上需要進行懶加載的圖片的閾值。, - 包含一個修復 Divi 錯誤的功能，該錯誤導致懶加載閾值的計算不...。
Inline CSS Block for Gutenberg 》內嵌 CSS 區塊可以幫助您添加以上折疊區的 CSS 或滿足進階自定義需求。。
jQuery & Plugins Asynchronous Loader 》載入 JavaScript 資源時應該以非同步、非阻塞的方式進行，以使您的網頁載入時間不受影響 (而不會被渲染阻塞的 JavaScript 延遲)。但使用延遲載入或非同步載入...。