WordPress 兒童主題設計 – 提示和技巧

已發表: 2020-12-25

WordPress 主題是所有 WordPress 驅動的網站都需要的。 在某個時間點,我們需要改造網站以改善其外觀和性能。 我們在博客中收集了各種 WP 主題。 每個網站所有者都應該查看這些主題,看看它們中的任何一個是否符合他們的網站及其要求。 但是,還有一個概念稱為 WordPress 子主題。 子主題是一個 WordPress 主題,它從另一個主題中獲取模板文件和功能。 這裡,提取特徵的主題稱為父主題。 使用子主題有很多好處,但最重要的是,當父主題的核心功能更新時,您在子主題中的自定義設置保持不變。

目錄隱藏
1. 定義 WordPress 子主題:
2. 在您的網站上激活兒童主題的好處:
3. 創建 WordPress 子主題:
1. 使用子主題生成器:
2. 使用插件創建子主題:
3.建立你的孩子主題:
1.創建主題目錄:
2.樣式.css:
3.函數.php:
4. 安裝 WordPress 子主題的方法:
5.自定義子主題:
一個。 在子主題中應用自定義:

讓我們深入一點,了解兒童主題的含義和重要性。 此外,我們還將了解在 WordPress 中設計子主題時的提示和技巧。

1. 定義 WordPress 子主題:

定義 WordPress 子主題 別針

因此,您一定想知道 WordPress Child 主題的含義。 子主題是從另一個主題借用或提取模板和文件的主題。 因此,子主題繼承了父主題的功能和特性。 因此,從另一個主題中提取特徵的主題稱為子主題。 為子主題提供文件和功能的稱為父主題。

WordPress 子主題的文件夾可以包含一個 CSS 文件。 而且,父主題往往會在每隔一小段時間後得到更新。 但是,您可以自定義主題的代碼,將其變成您網站所需的內容。 在這種情況下,如果您更新主題,您將丟失所有自定義項。 您可以選擇忽略更新,但這意味著安全性會降低。

據說子主題以類似於父主題的方式工作。 發生這種情況是因為我們提到子主題佔用了父主題的功能。 主題仍然像父主題一樣運行,而無需將文件從父主題複製到子主題。 秘訣在於父主題的 style.css 文件。 要創建子主題,您必須在 WordPress 主題主目錄中構建一個文件夾。 相應地命名文件夾。 並將以下代碼行放入子主題文件夾中的 style.css 文件中:

/*

主題名稱:子主題的名稱(例如,WordPress 子主題)

主題 URI:http://www. 子主題示例 .com(您的子主題的 URL)

描述:兒童主題的簡短概述

作者:這裡是子主題開發者的名字

模板:父主題的目錄名稱(例如,Parent-Theme、Main-theme 等)

版本:1.0.0

*/

現在,編輯上面給出的代碼中的第六行並放置以下代碼:

模板:父主題目錄的名稱

這讓 WordPress 子主題知道哪個是它的父主題。 這就是子主題可以從中獲取功能和特性的主題。 完成此操作後,子主題會從指定的父主題中獲取功能和文件。 並且子主題已成功安裝在您的平台上。 簡而言之,模板行決定了子主題被觸發時對父主題的繼承。

2. 在您的網站上激活兒童主題的好處:

在您的網站中激活子主題的好處 別針

正如我們已經確定的那樣,父主題在子主題中提供了一些或更多的特性和功能。 這使您可以在升級可用時更新父主題。 在這種情況下,您可以在子主題中使用父主題的功能。 因此,隨著父主題升級,您可以安全地更新父主題。 並且在這個過程中完全不會干擾兒童主題。

兒童主題帶來的靈活性是數不勝數的。 它允許您構建不來自父主題的新模板。 此外,還可以添加新特性和擴展功能。 為此,您可以訪問商業和免費提供的工具。

在使用子主題時,最好的一點是,很容易處理錯過代碼行時出現的問題。 WordPress 使用父主題快速為此類問題提供解決方案。 但如果父主題中也存在代碼行,則這是可能的。

3. 創建 WordPress 子主題:

儘管看起來令人生畏,但構建兒童主題的過程卻毫不費力且簡單明了。 您可以訪問空子主題的子主題構建器、使用插件或創建您的子主題。 讓我們詳細了解一下。

1. 使用子主題生成器:

使用子主題生成器 別針

Divi Space 提供了一個很棒的工具,您可以使用它來使用子主題構建器來構建一個。 您可以免費使用該工具。 在此工具中,您必須在提供的文本框中輸入所有詳細信息,然後下載所有內容。 完成後,您所要做的就是將 zip 文件夾上傳到 WordPress 控制台。 這應該在主題的安裝和激活完成後完成。

2. 使用插件創建子主題:

使用插件創建子主題 別針

為了使該過程更加簡單,您可以使用一個插件來支持構建子主題的過程。 下載並安裝相關插件後,子主題構建器會顯示在菜單項中。 這一切都發生在 WordPress 控制台的設置菜單中。 當您到達這一點時,為生成的子主題和描述一起指定一個新標題。 現在點擊“創建孩子”。 執行此操作時,會生成一個空主題。

3.建立你的孩子主題:

建立自己的兒童主題 別針

如果您有興趣了解從頭開始構建子主題的內容,那麼您應該採取這一步。 如果您想獲得一些關於如何從頭開始構建兒童主題的智慧,那麼採取這一步是一個好主意。

此過程需要在您的系統上運行的集成開發環境 (IDE)。 然後您必須創建並保存一些相關文件。 但是 Brackets 和 Sublime 是您可以免費使用的編輯器。 它們還帶有顏色代碼,使一切變得更容易。 此外,您還可以在 MAC 系統上使用 TextEdit 或在 PC 上使用 TextEditor。 在任何一種工具中,在編寫和編輯代碼行時都必須小心。 一個錯誤,整個代碼都可能付諸東流。 所以你必須遵循以下兩個步驟:

  • 在網站的目錄中建立一個主題目錄。
  • 生成一個 style.css,其中包含子主題的詳細信息和信息。
  • 截圖。

如果您一直在使用本地主機服務器,則必須轉到網站目錄中的正確文件夾。 在這裡,您可以找到一個包含所有文件的文件夾。 但是,如果您正在處理實時服務器,請配置所有文件夾和文件,並在一切完成後使用 FTP 客戶端。 在主題文件夾下,構建一個新文件夾並為其指定與客戶端相關的標題。 例如,您可以在文件夾標題的末尾將其命名為“child-theme”。

1.創建主題目錄:

創建主題目錄 別針

在主題目錄中為您要構建的子主題創建一個文件夾。 為其添加名稱。 例如,讓我們將其命名為 DiviChild。

2.樣式.css:

樣式-css 別針

現在,為名為“style.css”的主題創建一個樣式表文件。 將以下代碼放入 IDE。 根據您的要求重命名文件。

/*

主題名稱:Divi 兒童主題

主題 URI:https://MyWebsite.com

描述:兒童主題,根據 Divi

作者:主題作者姓名

作者 URI: https://iamauthor.com // 你的網址

模板:Divi

*/

確保更改必須提供信息的詳細信息。 但代碼中的基本內容是“主題名稱”和“模板”部分。 “主題名稱”中指定的文本顯示在 WordPress 主題列表的外觀>主題中。 “模板”定義了應該從中獲取功能集的父主題的名稱。

3.函數.php:

函數-php 別針

從 functions.php 文件開始並打開 IDE。 佔用第一塊 PHP 代碼或使用下面給出的代碼:

<?php

Add_action('wp_enqueue_scripts', 'enqueue_parent_styles');

函數 enqueue_parent_styles()

{

wp_enqueue_styles('parent_style', get_template_directory_uri().'/style.css');

}

?>

將此代碼放在一個新文件中,並確保正確提及所有文件路徑和目錄。 應正確給出父文件夾和子文件夾的這些目錄路徑。 將文件另存為 functions.php 在子主題的目錄中。

4. 安裝 WordPress 子主題的方法:

安裝wordpress子主題的方法 別針

由於 WordPress 子主題已經成功構建,現在是時候安裝它並在您的網站上使用它了。 無論您是在本地服務器還是實時服務器上工作,該過程都保持不變。

要安裝它,請將所有文件放入一個文件夾並壓縮該文件夾以創建一個 zip 文件。 確保 WordPress 實例已安裝並在您的系統上運行。 使用 WordPress 儀表板的主題>添加新部分安裝 Divi.zip 文件。 完成安裝後,單擊激活。 現在,Divi 在這裡作為父主題運行。

現在,返回 WordPress 儀表板的主題>添加新部分。 選擇您構建的子主題的 zip 文件。 安裝完成後,可以激活它以使其運行。

5.自定義子主題:

構建子主題的目的是定制一個已經存在的主題。 因此,讓我們看看如何自定義 WordPress 子主題。

一個。 在子主題中應用自定義:

在子主題中應用自定義 別針

當我們創建第一個文件 style.css 時,我們應該開始更改該文件中的代碼。 在此文件中添加自定義代碼,您可以覆蓋父主題的行為和功能集。 使用 CSS 文件,可以對子主題進行各種修改。 使用此文件,您可以更改生成的子主題中的所有樣式。

為此,您必須在 WordPress 子主題的 CSS 文件底部添加自定義代碼。

結論:

使用現成的 WordPress 主題是一回事,從現有主題中創建自定義主題是另一回事。 此外,所有在線可用的主題都可以安裝。 但是如果你想要一個定制的主題,你沒有很多選擇可以讓它們現成。 為此,您必須寫下代碼行以確保您想要的主題是定制的。 因此,在 WordPress 行話中,自定義主題稱為子主題。 這背後的原因是子主題來自現成的主題。 而子主題則選取父主題或現成主題的特徵集。 因此,在推出父主題時,子主題不會獲得升級。 這可以確保自定義不會丟失。 此博客可幫助您了解使用子主題的用法、創建和好處。