從零開始創(chuàng)建你的第一個(gè)WordPress子主題(附代碼示例)

很多初學(xué)者在使用ワードプレス建站時(shí),希望在不破壞原主題的基礎(chǔ)上,對(duì)網(wǎng)站進(jìn)行個(gè)性化修改。這時(shí),子テーマ 就是最安全、最靈活的解決方案。下面我們來一步步講解如何創(chuàng)建你的第一個(gè)子主題。

圖片[1]-從零開始創(chuàng)建你的第一個(gè)WordPress子主題教程

一、什么是WordPress子主題

子主題是依附于主主題(Parent Theme)的主題,它繼承主ごかんけいせいぼおん的功能和樣式,但可以自由修改部分文件而不影響主主題。當(dāng)主主題更新時(shí),子主題中的定制內(nèi)容不會(huì)被覆蓋,非常適合長期維護(hù)的網(wǎng)站。

簡單理解:
主主題 = 基礎(chǔ)功能
子主題 = 自定義擴(kuò)展

二、創(chuàng)建子主題前的準(zhǔn)備

在開始之前,請(qǐng)準(zhǔn)備好以下內(nèi)容:

  1. 具備WordPress后臺(tái)和FTP或主機(jī)文件管理的訪問權(quán)限。
  2. 主主題文件夾的名稱(例如 blocksyそしてアストラそしてtwentytwentyfour).
  3. 一個(gè)文本編輯器(如 VS Code、Notepad++)。

三、創(chuàng)建子主題文件夾

進(jìn)入網(wǎng)站目錄 wp-content/themes/,在這里新建一個(gè)文件夾,命名格式通常為:

主題名-child

例如你的主主題是 woodmartそうだ。サブテーマ文件夾就命名為:

woodmart-child

這樣可以讓系統(tǒng)自動(dòng)識(shí)別父子關(guān)系,也方便管理。

圖片[2]-從零開始創(chuàng)建你的第一個(gè)WordPress子主題教程

四、編寫 style.css 文件

ある woodmart-子供 文件夾中,新建一個(gè)名為 スタイル.css 的文件,然后寫入以下代碼:

/*
Theme Name: Woodmart Child
Template: woodmart
Author: Your Name
Version: 1.0
Description: 這是Woodmart主題的子主題
*/

説明

  • テーマ名:子主題顯示名稱。
  • テンプレート:主主題的目錄名稱,一定要正確填寫。
  • 其他信息可自定義。

救われた。ワードプレス才能識(shí)別出子主題。

五、加載主主題樣式

子主題創(chuàng)建后,還需要讓它繼承主主題的CSS樣式。
在子主題目錄下新建一個(gè) functions.php ファイルに以下のコードを追加してください:

<?php
function astra_child_enqueue_styles() {
    wp_enqueue_style('parent-style', get_template_directory_uri() . '/style.css');
}
add_action('wp_enqueue_scripts', 'astra_child_enqueue_styles');
?>

役割
這段代碼讓子主題自動(dòng)加載主主題的樣式文件,保證頁面外觀一致。

六、在后臺(tái)啟用子ごかんけいせいぼおん

回到WordPress后臺(tái) → 外觀 → 主題,可以看到你剛創(chuàng)建的子主題“Woodmart Child".

圖片[3]-從零開始創(chuàng)建你的第一個(gè)WordPress子主題教程


點(diǎn)擊“啟用”,此時(shí)子主題正式生效。網(wǎng)站外觀不會(huì)發(fā)生變化,但你可以在子主題中自由修改模板文件或樣式,而不會(huì)影響主主題。

七、自定義子主題內(nèi)容

啟用后,你可以開始定制化操作:

1. 修改カスケーディングスタイルシートタイプ

に直接接続する。 スタイル.css 中編寫新樣式,優(yōu)先級(jí)高于主主題。例如:

h1 {
    font-size: 28px;
    color: #0073aa;
}

2. 修改模板文件

想修改頁面結(jié)構(gòu),可復(fù)制主主題中的文件到子主題文件夾中。例如:
のコピーを取ります。 header.php 到子主題目錄,再修改其中的代碼即可。

3. 添加功能函數(shù)

サブトピックの functions.php 中添加自定義功能,比如新增導(dǎo)航菜單或修改登錄頁Logo。

八、測(cè)試與維護(hù)

果たすサブテーマ后,務(wù)必進(jìn)行測(cè)試:

  • 打開網(wǎng)站頁面,確認(rèn)樣式與功能是否正常;
  • 檢查控制臺(tái)是否有報(bào)錯(cuò);
  • 定期更新主主題,確保兼容性。

推薦します:
每次修改子主題文件前備份一下,避免誤操作。

九、進(jìn)階技巧:添加自定義模板

如果想為某個(gè)頁面使用特殊布局,可以在子主題中新建一個(gè)自定義模板文件。
例如創(chuàng)建 ページカスタム.php,寫入:

<?php
/*
Template Name: Custom Page Layout
*/
get_header(); ?>

<h2>這是自定義模板頁面</h2>

<?php get_footer(); ?>

然后在后臺(tái)新建頁面時(shí),就能選擇這個(gè)模板,快速實(shí)現(xiàn)不同的頁面布局。

十、子主題的優(yōu)勢(shì)總結(jié)

  1. 高い安全性:主主題更新不會(huì)影響自定義內(nèi)容。
  2. 維護(hù)方便:代碼清晰、分層管理。
  3. 柔軟な拡張性:可添加或修改功能函數(shù)。
  4. 結(jié)構(gòu)獨(dú)立:更容易排查問題。

子主題不僅是初學(xué)者入門的第一步,也是專業(yè)開發(fā)者打造個(gè)性化網(wǎng)站的核心工具。只需要簡單幾步,就能讓你的ワードプレス更具可控性和可維護(hù)性。


お問い合わせ
チュートリアルが読めない?無料でお答えします!個(gè)人サイト、中小企業(yè)サイトのための無料ヘルプ!
カスタマーサービス WeChat
カスタマーサービス WeChat
電話:020-2206-9892
QQ咨詢:1025174874
Eメール:info@361sale.com
勤務(wù)時(shí)間: 月~金、9:30~18:30、祝日休み
? 複製に関する聲明
著者:Linxiulian
終わり
好きなら応援してください。
クドス109 分かち合う
linxiulianのアバター - Photon Flux|WordPress 修理サービス、プロフェッショナル、ワールドワイド、迅速対応
おすすめ
解説 ソファ購入

コメントを投稿するにはログインしてください

    コメントなし