建立子佈景主題

使用 WordPress 之後選擇了一款你喜愛的佈景主題之後，總會發覺使用上就是怪怪的不合適，可能字太小字太密看了就想要改。但是主題又會更新，不想要辛苦調整的心血隨者更新而消失就是利用子佈景主題的時候了。

當然，如果你跟我一樣是工程師是技術宅，歡迎跟我一樣使用全手動的方式來建立主題來達成你所有的願望。

不過當然有更多的使用者不是我們這類的人，就推薦你們使用現成的外掛來達成目標。

以下這款外掛，就是讓你在後台簡單輸入一些資料，滑鼠點幾下就可以建立出子佈景主題。且這款有完整的台灣繁體中文化，使用上可以輕鬆容易不少。不過因為設定調整佈景主題本身就是一件很需要網站開發相關知識的工作，所以就算有中文也可能難上手！

以下就是進入工程宅的領域啦！如何手動建立出一個 WordPress 的子佈景主題。

說明部分將會以要建立 Storefront 的子佈景主題為範例。

首先在 /wp-content/themes 底下建立一個新的資料夾並且命名為 storefront-child。
嚴格說這資料夾的名稱並沒有規定一定要如何，只是習慣上會用原始名稱加上 -child 為名稱。

在 storefront-child 目錄之下新增 style.css 檔案而內容為

/*
Theme Name: Storefront child
Template: storefront
*/

這邊說明的檔案內容是最低限的內容，其中 Theme Name 後面就是你新建立的佈景主題的名稱，而 Template 說明這一個佈景主題是依附什麼佈景主題而來的子佈景主題。
如此一來你新建的子佈景主題就可以使用了。

正常情況下，你會發現佈景主題的相關 CSS 檔案沒有被載入到網站中，這時候你需要在 storefront-child 目錄之下新增 functions.php 檔案而內容為

<?php
add_action('wp_enqueue_scripts', 'storefront_child_style', 30);
function storefront_child_style() {
	wp_register_style('parent_style', get_template_directory_uri() . '/style.css'); // 原始主題的 CSS
	wp_enqueue_style('child_style', get_stylesheet_uri(), ['parent_style']); // 子主題的 CSS
}

就可以順利的將你的佈景主題的相關 CSS 檔案順利載入完成。

不過以範例的 Storefront 主題來說，functions.php 的相關內容是不需要的，設計者已經有想到子佈景主題的問題，已經很貼心的會確保原本的 CSS 會載入，且子佈景主題的 CSS 也會載入，並且會在正確的順序下載入，免得你的 CSS 檔案的內容無法去修改內容。