How To Build a Child Theme in WordPress

How To Build a Child Theme in WordPress

When we update a template in WordPress the update will replace the existing template files and delete the changes we made to the site. Child Theme provides a solution to the problem by allowing you to create a new folder that contains only the files we made changes to, so that updating the template will not affect the files with the change.

How To Build a Child Theme in WordPress?

If you have experience in the field of building websites in WordPress then you probably already know that the WordPress system is updated automatically often. In addition to the system, plugins for WordPress that you use need frequent updates in order to add new features and to solve existing security problems and vulnerabilities.So like the plugins and the system, the design template you use also requires occasional updates so that you can continue to work accordingly with the WordPress updates and plugins.If you intend to make changes to the template itself then it is recommended to create a sub-template to the existing template. A daughter template is basically another folder of the template where you load only the files of the template in which you made changes.Personally we think it is better to turn off automatic updates in WordPress and perform the updates often manually only after you have created a backup for the WordPress site . Without backup it is best not to make updates to WordPress plugins, templates or the system itselfFor example: if you want to change the content displayed on a page you can copy it to the daughter template and make the changes you want. As long as the daughter format is active then this file will replace the existing file in the original format. In many cases the main change made using the daughter template is a change in the design of the site by adding CSS code that will replace the code of the original template.For those who do not know what CSS is, this is code that allows you to change the design of the site, structure, colors, fonts, etc.Sometimes when you buy paid templates you will get along with the template folder also a folder of the daughter template and you can simply upload the two folders to the storage server and run the daughter template.

Folder template folder in WordPress

If you did not get a folder of the daughter template with the template then you can create it yourself as we will explain in the next paragraph.

Create and run a daughter template in WordPress

In order to create a child theme, you will need to log in to the storage server of your site and create a new folder there. Call the new folder the folder name of the template you are currently using and add a child after the folder name.So if the folder name of the current template is yydevelopment-wordpress you will call the new folder yydevelopment-wordpress-child . You can also set a different name for the folder but this is the practice when creating a daughter template within WordPress .Inside the new folder you created you will need to create a new file and call it style.css . Open the file using Content Editor or Notepad and insert the following code into the file:/ * Theme Name: Theme Name For Admin Panel Template: current-theme-folder-name * /@import url (“../ current-theme-folder-name /style.css”);Instead of “Theme Name For Admin Panel” you will define the name of the template you want to appear in the administration area. It is common to add the word Child to the name of the template. So if the template name is YYDevelopment WordPress you can change it to the next name YYDevelopment WordPress Child .Instead of “current-theme-folder-name” enter the folder name of the template you want to add a sub-template.If the folder name of the active template is yydevelopment-wordpress then you will define this name in the Template row and in the last row of the code and this is the template that will load together with the daughter template you just created.You can see below how the code should appear inside the style.css file after you have made the changes:/ * Theme Name: YYDevelopment WordPress Child Template: yydevelopment-wordpress * /url @import ( “../ Yydevelopment-wordpress /style.css”);In addition to the style.css file it is recommended to copy from the original template folder the screenshot file into the folder of the daughter template you created. This file actually contains the screenshot of the template that appears within the WordPress administration area . It is not necessary to copy the file but it will allow the template to be more easily identified from the administration area.Once you have finished creating the daughter template go into the template management area and run the template with the new name you have defined (note that you are activating the daughter template and not the regular template by mistake).

Running a daughter template in WordPress

Change files and view using the daughter template After running the daughter template you can copy into the folder the files you want to change.Almost any file you copy into the folder will replace the file from the original format. If you make changes in the same file the changes will apply on the site and when you make an update to the parent template which means that the changes will be saved since the file with the changes is still loaded from the daughter template and it replaces the file in the updated format.Note: It is important that the file you are replacing appears in the same location in the daughter format as it appears in the original format and that the file name is the same as the name in the regular format.For example: if in the original format there is the file.php file and it is inside a folder called functions you will need to create in the daughter template a new folder named functions and inside it insert the file.php file.The hierarchy of folders must remain the same in order for the file in the daughter format to replace the file in the parent format.Additional note: The only file that the WordPress system does not replace is the functions.php file and when you create this file in the daughter format the file will continue to load from the main template as well. Adding this file will simply allow you to create additional functions in the daughter template.If you are not building the site yourself then it is important to contact a site builder who is going to use a template that contains a sub-template in order to avoid future problems when making updates to the site.