How to create a Child theme in WordPress to enjoy its benefits

At some point in your use of WordPress, you may sometimes need to modify the look, feel, and features of your website template. This may involve modifying the source code of the template itself. But the modifications you make to the WordPress website template will be lost when you update this template to a new version!

The Child theme helps you overcome this problem easily, because when you create a child theme from a parent theme, you will be able to modify the source codes of the child theme as you wish, and at the same time you can update the parent theme to a newer version at any time you want without losing the codes or modifications that you made. In this article, you will learn about the importance of the child theme and the benefits of using it alongside the site’s basic template. You will also learn how to create a child theme from the basic template of your WordPress site in simple steps, activate it on your site, and customize its look and feel however you want.

The importance of using the Child theme on your WordPress site

The most important benefits and features that you get if you create a secondary template Child theme from the primary template already installed on your site: Instead of creating a WordPress template from scratch, which is a tiring theme and requires a lot of time, you will be able to create a child theme template in a very simple time, and without the need to put in a lot of effort or possess complex programming skills. The child template helps you take advantage of all the features, tools, and options provided by the parent template or the primary template used on the site, because the child template calls and uses all the functions, features, and properties that the parent template uses. You can update your primary website template any time a new update is available, without fear of losing the modifications that were made to the template before the update was made, because you have actually made the updates to the secondary template on your site, and updates to the primary WordPress template will not affect the modifications that you have made.

If you are using a child theme and there is a problem that causes the site to lose its appearance, you can freely delete the child theme entirely, and the design and features of the parent theme will be automatically displayed. The Child theme helps you gain more skills related to editing WordPress themes.

Read also: What is Child theme?

What are its uses for WordPress website owners? A comprehensive explanation for beginners: How does the Child theme work? Perhaps you once noticed when you were installing a WordPress theme that a template with the same name appeared next to the main template, followed by the word Child theme.

The reason the child template is called this name in the first place is that it inherits the attributes, files, and data of the base template just as the child inherits from its father! Therefore, when we create a child template on a WordPress site and activate it, the site will appear with the same appearance and design as the parent template. Therefore, the idea of ​​​​working the child template depends on using all the files and codes that are present in the parent template, which means that the template now exists in two copies instead of one copy, so to speak, and one copy is preserved and far from modification or change, and the other copy, which is the child theme, is prepared to apply any required modifications to the site without fear of the parent template collapsing or being destroyed.

Note: When you enter the site, WordPress automatically displays the child template if it is already available, and if it is not available, it displays the parent template or the primary template. The basic components of the child theme - When you enter the file manager of your WordPress site within the Cpanel control panel and browse the Themes/ folder, you will find within it the folders for all the templates installed on your site. When you enter any folder for one of the templates, you will find that it contains a set of files for the template as shown in the following image: The image above shows the basic components in most WordPress templates (the parent template), and some templates may include other additional files for further customization.

While the following image shows the basic components of the Child theme template so that it is ready to work and activate on the site: As you can see in the image above, you will not need more than these three files to create a Child theme WordPress template, and we will explain these files to you in detail within the article. Here is a simple definition of it: Functions.php file: It is a software file used to link the parent template and the child, and we talked about it in detail before.

style.css file: which is the formatting file that is used to add codes for modifying the shape, appearance and design of the template (and if you want to Arabize the template, it is preferable to put the formats for the Arabic language in a separate format file rtl.css) Screenshot.png file: which is an image file that we add in the folder for the child template so that it appears next to the name of the template inside the WordPress control panel, as the following image shows: Thus the child template contains only a very small number of files, and this is because we are not creating a new template from scratch, but the child template does Inheriting or using all the files and codes of the main template (the parent), so the parent template must be installed on the site as well in order for it to work correctly. Note: In the following explanation, we will create a child template from the famous Sydney template. The same explanation can be applied to any WordPress template to create a (child template) from it in the same way.

Steps to create a Child theme: You can create a Child theme for any WordPress template installed on your site through the following steps easily and without having high programming skills, but it is preferable to have a good background in dealing with programming codes for the following languages: HTML - CSS - PHP. We also advise you to take a backup copy of your site before taking the step of creating a template built from any WordPress template you have. Creating a folder for the child theme inside the file manager The first step to creating the child theme is to create a folder with the name of the template inside your site’s file manager, where you can enter the site’s file manager by clicking on File Manager from the cPanel hosting control panel: After entering the file manager, you can enter the Public_html folder, then to your site’s WordPress installation folder, then open the Wp-content folder, and finally open the Themes folder that contains all the folders belonging to the WordPress templates already installed inside the site: As the previous image shows you, when Go to the Themes folder and you will find the option to create a new folder at the top of the page, Folder+, choose it and name the new folder Child or any other name you want.

Create a style.css file for the child template. The next steps are to create the basic files for the child template, which are the style.css file and the functions.php file. After creating the Child folder for the child template, go to it and click on the Create a new file button at the top left of the screen. A pop-up window will open for you, in which write the name of the formatting file (style.css) and then click on the Create new file button. After that, the style.css file will be successfully created inside the Child folder.

Now right-click on the file name and choose Edit, to open the style.css file editing page. Paste the following text into it: /* Theme Name: Child Theme URI: http://example.com Description: This is a child template from the parent template Author: WordPress in Arabic Author URI: http://example.com Template: sydney Version: 1.0.0 */ */ Once you paste this text into the style.css file and save the file, you will notice the name of the template appears inside the WordPress control panel < المظهر < قوالب . وقبل أن نطلع على شكل القالب داخل لوحة تحكم الووردبريس، دعنا أولاً نشرح لك باختصار النص السابق المكون من 7 أسطر كالتالي: Theme Name : وفيه نقوم بكتابة اسم القالب كما نريد أن يظهر داخل لوحة تحكم الووردبريس، في المثال هذا قمنا بإعطاءه الاسم Child ويمكنك إعطاء أي اسم تريده.

Theme URI: In this line, we write the link to the template’s website if it is available. It is certainly a formatting line and does not affect the work of the template at all. Description: In this line, write a brief description of the template. This descriptive text appears on the template information page only. Author: In this line, you can write the name of the template developer. This name also appears on the template information page, and it does not affect the work of the template in any way.

Author URI: You put the link to the template developer’s website. Template: This is the most important line of all, where we write the name of the parent template or the primary template for which we want to create the child template. You must write the name of the template exactly as it appears in its folder name within the WordPress file manager. Version: You can write the current version of the template.

This is also secondary information and does not affect his work. So, by explaining the functions of the codes for the style.css file, we can say that the line for writing the name of the template is the most important line, so pay close attention when writing the name of the primary template for which you want to create a child template because this ensures that the child template appears correctly.

So, go to the Themes folder inside the site’s file manager, make sure the name of the template is as it appears in its folder name, and write it as it is and in the same case, because if you write the name in uppercase letters instead of lowercase, the child template will not work for you. Create a functions.php file for the child template in the same way you created the style.css file. Go into the child template folder again and create another file named functions.php: Then open the Edit page for the functions.php file: Then paste the following code into the file: