In personalizing your WordPress websitetime, but don't want to lose the tweaks you've made every time you update? With the simple guide in this article, you can learn how to create child themes in WordPress, ensuring that your customization stays safe and worry-free while easily tweaked and improved!Design of the websiteand functionality.
Prerequisites before creating a WordPress child theme
![图片[1]-如何创建和自定义 WordPress 子主题 | 手动与插件教程](https://www.361sale.com/wp-content/uploads/2024/12/20241208173312555-image.png)
Before you start creating a WordPress child theme, make sure you have the following knowledge and resources:
Request:
- CSS Basics: CSS is used to define the appearance and style of a website, and mastering it will help in customizing child themes.
- PHP Basics: PHP is the scripting language used by WordPress, and understanding it will help you modify and enhance the functionality of your child theme.
- WordPress Theme Structure: Understanding the file structure of WordPress themes, especially templates, stylesheets and
functions.php
Documentation.
Tools and resources:
- Access to the file system: You need to be able to access the filesystem of your WordPress installation, which can be done via cPanel, FTP, or a file management plugin.
- text editor: Use a text editor designed for coding (such as Notepad++, Sublime Text, or Visual Studio Code).
- FTP client: Such as FileZilla, WinSCP or ForkLift for managing and uploading theme files.
Preparation Steps:
- Backup Sites: Make sure you create a full backup of your website before you start making changes, just in case something goes wrong.
- Setting up the localdevelopment environment (computer): It is best to start with a local development environment (e.g.
XAMPP
maybeLocal by Flywheel
) in the test subtopic. - Confirmation of parent theme: Specify the parent topic to be modified and make sure you know its exact folder name.
How to Create WordPress Child Themes Manually
Creating child themes manually is the preferred method of many developers, which ensures better performance and security. By following the steps below, you will have full control over the design and functionality of your website.
Step 1: Create a child theme folder
First, create aSub-Theme Folders
and name it. The naming convention is the name of the parent topic plus "-Child.
". For example, if the parent topic is pear
The sub-theme folder is named pear-child
. Place this folder in the wp-content/themes/
Catalog.
![图片[2]-如何创建和自定义 WordPress 子主题 | 手动与插件教程](https://www.361sale.com/wp-content/uploads/2024/12/20241208174134467-wordpress-themes-directory-1.png)
Step 2: Create the style sheet file (style.css
)
Create a file in the child theme folder called style.css
file and add the following header information at the top of the file:
/*
Theme Name: Pear Child
Theme URI: http://example.com/pear-child/
Description: A child theme for the pear theme.
Author: Your Name
Author URI: http://example.com
Template: pear
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
Text Domain: pear-child
*/
included among these Template
field specifies the folder name of the parent topic, ensuring that the parent-child relationship is properly identified.
Step 3: Create the function file (functions.php
)
In the child theme folder create a functions.php
file and add the following code to ensure that the child theme loads the parent theme's stylesheet correctly:
<?php
function pear_child_enqueue_styles() {
wp_enqueue_style('pear-parent-style', get_template_directory_uri() . '/style.css').
wp_enqueue_style('pear-child-style', get_stylesheet_uri(), array('pear-parent-style'));
}
add_action('wp_enqueue_scripts', 'pear_child_enqueue_styles');
?>
Step 4: Install and activate the child theme
Compress the child theme folder into .zip
file, log in to the WordPress dashboard, and add a new file to the "Appearance > Themes
"Click on the "¡§Add New
", upload and activate your child theme.
![图片[3]-如何创建和自定义 WordPress 子主题 | 手动与插件教程](https://www.361sale.com/wp-content/uploads/2024/12/20241208175014138-image.png)
Step 5: Customize the child theme
The child theme is activated and you can start customizing it. It is possible to copy the parent theme'sTemplate filesto the child theme folder and edit it, or in the functions.php
Add customization to the
![图片[4]-如何创建和自定义 WordPress 子主题 | 手动与插件教程](https://www.361sale.com/wp-content/uploads/2024/12/20241208175107428-image.png)
How to Create WordPress Child Themes Using Plugins
If you don't want to create child themes manually, you can use plugins to simplify the process. Here are a few commonly used plugins:
- Child Theme Configurator: aeasy-to-useplugin, which has more than 300,000 active installations.
- Child Theme Wizard: Simple and efficient, with a rating of 4.9 stars.
- WP Child Theme Generator: Perfectly rated, with more than 10,000 active installations by users.
Advantages of using plug-ins include ease of operation, greater speed, and reduced risk of errors.
![图片[5]-如何创建和自定义 WordPress 子主题 | 手动与插件教程](https://www.361sale.com/wp-content/uploads/2024/12/20241208180552900-image.png)
Solving common problems
While creating child themes is usually simple, sometimes you may run into problems. Here are solutions to a few common problems:
- Style sheet not loaded::
- probe
functions.php
Whether the stylesheets of the parent theme and child theme are queued correctly in the - Make sure the file path is correct and clear your browser cache to see the latest changes.
- probe
- functional conflict::
- If you encounter a conflict, first disable all plugins and enable them one by one to see if the plugin is causing the conflict.
- probe
functions.php
, avoiding duplicate function names.
- Template overrides don't work::
- Ensure that the template file names in the child theme are the same as the parent theme and have the same folder structure.
Link to this article:https://www.361sale.com/en/29716The article is copyrighted and must be reproduced with attribution.
No comments