更新 WordPress 主題時如何保留自定義 CSS
已發表: 2022-05-05主題決定了 WordPress 網站的佈局和外觀。 無論您使用哪個主題，您都可能需要對其進行一些自定義以滿足您的特定需求。
自定義主題的一種方法是使用層疊樣式表 (CSS)。 這種流行的樣式表語言將允許您更改主題的幾乎任何元素。 您可以將自定義 CSS 添加到您的主題中，以指定背景顏色、更改字體大小、創建內容之間的間距、重新定位菜單等。 不過，自定義 CSS 可能會在您下次更新主題時被刪除。
為什麼主題更新會破壞自定義 CSS
所有主題都有一個 style.css 文件。 在主題文件夾中可用，它包含 CSS。 當您更新您的主題時，您將下載一個新的、不同的版本來替換現有版本。
更新您的主題將刪除現有的 style.css 文件並將其替換為全新的 style.css 文件。 新的 style.css 文件不會包含您之前添加的任何自定義 CSS。 您可以隨時添加已刪除的自定義 CSS，但在每次主題更新後這樣做可能很乏味。
添加到定制器
您可以在更新主題時通過將其添加到定制器來保留自定義 CSS。 定制器是 WordPress 儀表板中的主題定制工具。 它具有“附加 CSS”字段。 您可以將其添加到此字段，而不是將自定義 CSS 直接添加到主題的 style.css。
WordPress 4.7 版中引入了“附加 CSS”字段，以防止自定義 CSS 在主題更新期間被刪除。 它不會影響 style.css 文件，也不會影響主題文件夾中的任何其他文件。 當您通過此字段將自定義 CSS 添加到定制器時，它將存儲在您網站的數據庫中。 然後，您可以在保留自定義 CSS 的同時更新主題。
要訪問定制器，請單擊 WordPress 儀表板中的“外觀”，然後選擇“定制”。 “附加 CSS”標籤位於底部附近。 單擊此選項卡將顯示一個字段，您可以在其中輸入自定義 CSS。 更新主題只會替換主題文件夾中的文件。 它不會替換或以其他方式影響您網站的數據庫，因此將保留自定義 CSS。
將自定義 CSS 添加到定制器允許您預覽它。 定制器具有所有更改的內置預覽功能。 無論您是設置新的小部件還是添加自定義 CSS，定制器都會顯示您網站的外觀。 然後，您可以通過單擊“發布”來選擇繼續進行自定義。 如果您的網站看起來不正確，您可以在上線之前更改自定義選項。 無論如何，定制器將使用自定義 CSS 顯示您網站的預覽。
創建子主題
另一種解決方案是創建一個子主題。 子主題本質上是您可以自定義的其他主題的副本，而不必擔心丟失更改。 它們不是完整的副本。 相反，大多數子主題僅包含幾個基本文件，包括 style.css 文件和 functions.php 文件。
子主題旨在繼承父主題的屬性。 您可以將主題用作父主題。 子主題將有自己的文件夾，其中包含自己的 style.css 文件和 functions.php 文件。 但是，子主題不包含 index.php 文件、page.php 文件、single.php 文件或其他標準主題文件。 它將利用這些屬性的父主題。
因為子主題有自己的 style.css 文件，所以它們支持自定義 CSS。 更重要的是，當父主題更新時，子主題會保留所有自定義 CSS。 更新父主題不會影響子主題的 style.css 文件。 有關如何創建子主題的說明，請訪問 developer.wordpress.org/themes/advanced-topics/child-theme。 或者，一些高級主題帶有子主題。
對於幾行自定義 CSS，您可能希望將其添加到自定義程序中。 對於大量的自定義 CSS，創建子主題可能是值得的。 子主題將為您提供一個單獨的 style.css 文件，您可以自定義該文件。
您甚至可以離線處理子主題的 style.css 文件，因為它是一個單獨的文件，您將有足夠的空間來自定義 CSS。 向定制器添加自定義 CSS 會將您限制在只能在線訪問的小字段中。 定制器提供了預覽模式的好處，而子主題提供了單獨的 style.css 文件的好處。
使用自定義 CSS 插件
您可以使用自定義 CSS 插件。 例如，Simple Custom CSS 插件就像它聽起來的那樣：它允許您輕鬆地將自定義 CSS 添加到您的主題中。 添加到插件的自定義 CSS 將覆蓋您的主題自己的 CSS。
激活簡單自定義 CSS 插件後，您應該會在 WordPress 儀表板的“外觀”下看到一個新的“自定義 CSS”選項卡。 您可以在此處添加自定義 CSS。 更新主題時，將保留自定義 CSS。 更新您的主題將替換主題的 style.css 文件，但插件將使用您的自定義 CSS 覆蓋新的 style.css 文件。
還有簡單的自定義 CSS 和 JS 插件，它支持自定義 CSS 和自定義 JavaScript。 您可以使用它來創建自定義 CSS，以覆蓋您的主題自己的 CSS。 如果您不想弄亂創建子主題，您可能需要使用自定義 CSS 插件。 下載自定義 CSS 插件是在主題更新期間保留自定義 CSS 的一種簡單方法。
結論
更新主題後丟失自定義 CSS 會令人沮喪。 即使您將自定義 CSS 保存到本地計算機，您也必須返回並添加它。 您可以通過使用 WordPress 儀表板中的定制器、創建子主題或使用自定義 CSS 插件來保留主題的自定義 CSS。
