如何創建 WordPress 子主題

通常，幾乎不可能找到完美的主題； 總有一些修改需要做。 那麼，為什麼不直接使用一個不錯的 WordPress 默認主題，例如二十五歲，並使其成為您自己的主題，使其外觀和功能都符合您的要求呢？ 創建一個兒童主題將為您節省大量時間和麻煩（相信我）。

我可以根據第一手經驗說話。 我“繼承”了一個 WordPress 網站，開發人員剛剛破解了父主題，我仍然記得我無法真正更新主題是多麼令人沮喪，因為擔心它會覆蓋賦予網站功能的自定義設置。 我不知道什麼是原始代碼，什麼是自定義代碼，所以它就在那裡，沒有更新的可能性。

不過，這個故事確實有一個美好的結局。 當時我對 WordPress 比較陌​​生，所以它確實很早就教會了我改變父主題不是一個好主意。 當網站最終重新設計時，首要任務是進行自定義並將它們放入子主題中。

子主題允許您在單獨的位置工作，而您的工作不會被未來的父主題更新覆蓋。 從技術上講，當您創建子主題時，您會創建一組單獨的文件，您可以使用這些文件來自定義主題，而不會影響原始父主題。 如果您對父主題的文件進行更改，這些更改將在您下次更新主題時被覆蓋。 這很重要，因為更新可以包括功能修改、錯誤修復和重要的安全措施。 保持父主題最新並使用子主題進行任何自定義是至關重要的。

兒童主題基礎知識

子主題是您創建的獨立主題，其基本功能依賴於父主題。 當您使用子主題時，WordPress 知道引用它並查找包含的任何功能。 這很棒，因為它允許您只修改您需要更改的父主題的部分，這使其成為向您的 WordPress 站點添加自定義項的非常有效的方式。

為了更深入地挖掘，以下是子主題在文件級別上的工作方式。 WordPress 檢查子主題中是否包含所需的文件。 如果包含，則加載該子主題文件。 如果子主題中沒有，則加載父主題中的文件。 唯一的例外是 functions.php 文件，其中加載了父版本和子版本。 通常，functions.php 文件中包含重要信息。 如果 WordPress 只加載了子主題版本（除非您將所有內容都複製過來），那麼該網站將無法正常工作。 值得慶幸的是，WordPress 會加載這兩個文件，因此您不必擔心將整個 functions.php 文件複製到您的子主題中。

請記住，如果需要，您可以隨時關閉您的子主題並使用原始主題。 雖然這是一條單行道； 您不能關閉父主題並依賴子主題。

如果您要向 WordPress 主題添加自定義，最好使用子主題。 準備好創建自己的了嗎？ 現在我們將逐步完成該過程。

創建子主題

它並不像創建一個聽起來那麼複雜。 實際上，從技術上講，您只需要兩個文件： style.css和functions.php文件。 大多數兒童主題不止於此，但從技術上講，這些是唯一需要的兩個。

要創建子主題，您需要安裝 WordPress 以及您想要使用的父主題。

創建主題目錄

首先，轉到您的主題目錄並為您的新主題創建一個文件夾。 給它一個可識別的名字。 對於這個例子，我將我的主題命名為child-example以便於查找。

製作子主題樣式表

下一個非常關鍵的步驟是創建子主題的樣式表。 創建一個style.css文件。 請記住，它必須命名為style.css才能正常工作。

接下來，您將需要包含有關您的主題的一些信息。

將其複制並粘貼到style.css file ：

/*
 Theme Name:   Child Example
 Theme URI:    http://example.com/child-exxample/
 Description:  Child Example Twenty Fifteen Child Theme
 Author:       Your Name
 Author URI:   http://example.com
 Template:     twentyfifteen
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         Tags: black, blue, gray, pink, purple, white, yellow, dark, light, two-columns, left-sidebar, fixed-layout, responsive-layout, accessibility-ready, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-images, microformats, post-formats, rtl-language-support, sticky-post, threaded-comments, translation-ready
 Text Domain:  twenty-fifteen-child
*/

這可能看起來很多，但實際上只有兩個是必需的，即Theme Name和Template 。 Theme Name告訴 WordPress 子主題的名稱。 Template告訴 WordPress 它應該將哪個主題視為父主題，這非常重要。

其他大多數都是不言自明的，但有一些可能需要更多澄清。 Text Domain和Tags可能有點混亂。 Text Domain用於翻譯字符串以實現國際化目的。 這對於您的主題來說是獨一無二的，並且應該在您使用翻譯功能時使用。 Codex 中有更多信息，可以在 I18n for WordPress Developers 主題中找到。 Tags部分是特定於 WordPress 主題的標籤列表。 對於這個例子，我查看了 25 歲的父style.css ，從那裡抓取標籤，並將它們放在子主題中。

利用父樣式

還記得 WordPress 如何首先查找子主題文件嗎？ 現在，子主題可以工作，但它看起來不是很精緻，因為你還沒有做任何樣式。 如果您激活它並重新加載頁面，它看起來會有點亂。 它可能看起來像這樣：

讓我們解決這個問題，讓它回到父主題，並且至少會應用一些樣式。 您仍將使用您的子主題進行自定義樣式，但首先，讓我們顯示父樣式。

為確保加載父文件的樣式表，我們需要將其放入子主題中。 您需要在子主題中創建一個functions.php文件來放入以下代碼段。

<?php

add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' );
function enqueue_parent_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
}

進行 CSS 自定義

現在父樣式已顯示，讓我們為您的子主題自定義更改一些​​ CSS。 對於此示例，為頁面內容設置背景元素的樣式是查看子主題的好方法。 它在父主題 CSS 中的樣式為白色，但讓我們在您的子主題中將其更改為藍色。 請記住，首先加載父樣式，然後再加載您的自定義，因此我們將看到這些樣式。

如果您是 Chrome 用戶，開發者工具對於在瀏覽器中查看樣式和實驗非常有幫助。 轉到查看 > 開發人員 > 查看源代碼並選擇頁面元素。 樣式將顯示在右側。 我檢查了具有白色背景的.hentry類的文章。 我粘貼了一個十六進制值以首先在瀏覽器中對其進行測試。

要進行此更改，請在子主題中打開 CSS 文件並添加 CSS 信息。

如您所見，可以在子主題中輕鬆更改樣式。

修改子主題的功能

調整樣式很容易，但是頁眉、頁腳、側邊欄等其他內容呢？ 假設要在頁腳中進行一些修改。 將父主題的頁腳複製並粘貼到子主題中。 footer.php文件可以在您選擇的文本編輯器中打開並進行修改。 我決定刪除“Proudly powered by WordPress”這一行，所以我從我的子主題的文件中刪除了它。 現在這是 WordPress 將首先加載的文件，因此該行文本將不會顯示。

創建子主題是創建 WordPress 主題時要養成的好習慣。 只需幾個簡單的步驟，它們就很容易創建和維護。 將自定義項與父主題分開對組織目的和使所有內容保持更新都有好處，這將在以後省去很多麻煩。