當挑好主題之後,有時候也會想要自己改一些東西,例如說像是更換背景、調整導覽列顏色、或是自訂標題的背景之類的,有些主題可能會沒有修改上述所說的這些功能,所以就要自己去CSS裡面增加,但是當主題更新之後,你原本修改的內容就都會被還原了,每次都要重新再做調整,這樣很累很麻煩。所以這時候就要創一個子主題並且繼承你原本的主題,這樣當主題更新之後,你在子主題所做修改就不會被還原了。那子主題要怎麼創建呢?
下面就一個步驟一個步驟地來教大家 ~~
一、建立子主題資料夾
一開始先找好自己要的主題,我這邊就以「貳零壹柒」這個主題來做範例,打開FTP進入放主題的資料夾(wp-content/themes),會看到一個twentyseventeen的資料夾就是我用來做示範的檔案,我們先在本機建好檔案再放上去,在桌面建一個twentyseventeen-child的資料夾
二、新增style.css檔案
一個主題或是子主題一定要有一個style.css檔案,所以在child這個資料夾下面新增一個style.css檔案。
接著打開style.css,我們要在這打上子主題的資訊以及是繼承哪個主題,這邊的話可以從父主題去複製過來
/*
Theme Name: 貳零壹柒 – child (主題名稱)
Theme URI: https://wordpress.org/themes/twentyseventeen/ (主題來源)
Author: WordPress team (作者)
Author URI: https://wordpress.org/ (作者網站)
Template: twentyseventeen (繼承主題的資料夾名稱)
Description: Extends Twenty Seventeen (主題描述)
Version: 1.4 (主題版本)
*/@import url(‘../twentyseventeen(繼承主題的資料夾名稱)/style.css’); (繼承父主題的style.css)
三、將子主題壓縮(.zip)上傳
style.css檔案完成之後,將整個資料夾壓縮,副檔名選擇.zip,然後登入到你的後台
「外觀」→「佈景主題」→「新增」→「上傳佈景主題」→「選擇檔案」→「立即安裝」
最後出現這樣的畫面就代表安裝成功了
四、套用子主題
然後回到佈景主題頁面,你就會看到剛剛上傳的子主題已經在上面了,接著再啟用子主題,這時候你回到網站會發現都沒有變化,跟原來的主題一樣,這樣就是成功了
五、修改CSS樣式
子主題啟用成功之後,想要修改CSS的話,除了可以將檔案透過FTP下載下來修改完再上傳之外,也可以直接從後台去做修改,「外觀」→「主題編輯器」,在這裡就可以直接編輯CSS了
小提示、functions.php
主題的一些功能是在functions.php來做設定的,我們也可以在子主題新增一個functions.php檔案,這個檔案比較特別,不像其他header.php、index.php…之類的只要在子主題新增的話就會蓋過父主題的,而是會同時載入父主題以及子主題的functions.php,所以想額外新增一些功能的話,可以在子主題來做新增。
以上就是子主題的創建教學囉~~~
發表迴響