在Pingdom、GTmetrix或Google PageSpeed Insights中看到“合併外部CSS”警告？對於許多WordPress網站來說，這是一個非常常見的錯誤。當您從CDN 和/或子域（外部域）載入10個或更多CSS檔案時，通常會顯示此警告。解決此問題的一種方法是串聯您的CSS檔案，或將它們組合起來，以便在單個請求中載入它們。
注意：如果您使用支援HTTP/2的提供程式通過HTTPS執行，現在通常可以安全地忽略此警告。使用HTTP/2，現在可以通過單個連線並行載入多個CSS檔案。
Pingdom合併外部CSS警告
如果您仍在通過HTTP執行並且還沒有遷移到HTTP/2，您可以按照下面的教程學習如何合併外部CSS檔案。同樣，串連（concatenation）現在是一種通常被認為已棄用的技術。現在，超過77%的瀏覽器在通過HTTPS以及許多CDN和網路託管提供商執行時支援HTTP/2。
使用CDN時通常會看到合併外部CSS警告，因為您將CSS檔案託管在外部域（例如 cdn.domain.com）上。您可以做的只是將您的CSS檔案連線到您的Web伺服器上。一旦它們組合在一起，您將不再看到此警告，因為它將在單個請求中載入它們。最簡單的方法之一是使用由Frank Goossens開發的名為Autoptimize的免費WordPress外掛。
Autoptimize外掛
這個外掛非常輕巧，準確地說只有176KB。在撰寫本文時，它目前有超過1,000,000次活躍安裝。該外掛可幫助您串聯指令碼、縮小、新增過期標頭，以及將樣式移至頁首和將指令碼移至頁尾的能力。
您可以從WordPress外掛庫下載它 ，也可以在WordPress儀表盤中的“安裝外掛”外掛下搜尋它。安裝後，您將需要進入設定並啟用“Optimize CSS Code”選項。這將串聯（組合）您的 CSS 檔案。如果您使用的是CDN，請確保輸入您的CDN URL。這樣，您的CSS檔案將作為單個請求載入到CDN上。
合併外部CSS檔案
在啟用上述設定後，你將看到一個“autoptimize_xxxxx.css”檔案的CSS檔案。
組合CSS檔案
評論留言