How to Create a WordPress Child Theme (Without Losing Your Customizations)

WebLearnCraft — Sat, 14 Nov 2026 19:02:41 +0000

You tweak your theme's CSS, the site looks perfect — then an update arrives and every change is gone. That happens because your edits lived in the parent theme's files, and the update replaced those files.

A child theme fixes this. It is a small, separate theme that inherits everything from the parent but keeps your edits in their own folder. Updates replace the parent, never the child.

Do you actually need one?

If you only build pages in Elementor, probably not — Elementor settings live in the database, not in theme files. But the moment you want to edit a theme file — CSS in style.css, a PHP function, or a template like header.php — a child theme is the safe way to do it.

Before you start

Back up your files and database first. If your host offers a staging site, do this there first. And make sure you can reach your files (File Manager or FTP) — a PHP typo can lock you out of the dashboard, and you will need file access to fix it.

Step 1: Find the parent theme's folder name

Open wp-content/themes/ in File Manager or FTP and find your parent theme's folder. For Hello Elementor it is hello-elementor. For Astra it is astra. Write down the exact folder name, hyphens and all — you will need it in a minute.

Step 2: Create the child folder

Next to the parent folder (not inside it), create a new folder called hello-elementor-child. It needs just two files to start:

hello-elementor-child/
├── style.css
└── functions.php

Step 3: Write style.css

style.css starts with a comment header that tells WordPress this is a child theme. The line that matters most is Template — it must match the parent folder name exactly:

/*
Theme Name: Hello Elementor Child
Description: Child theme for Hello Elementor
Author: Your Name
Template: hello-elementor
Version: 1.0.0
*/

Template: hello-elementor — not "Hello Elementor", not the child folder name. Get this wrong and WordPress will say the parent is missing. Your own CSS goes below this comment.

Step 4: Add functions.php

This file loads the child's stylesheet. For Hello Elementor, the parent already loads its own stylesheet, so we only enqueue the child's CSS, listing the parent's style as a dependency:

<?php
if ( ! defined( 'ABSPATH' ) ) {
    exit;
}

function wlc_child_enqueue_styles() {
    wp_enqueue_style(
        'wlc-hello-child-style',
        get_stylesheet_uri(),
        array( 'hello-elementor-theme-style' ),
        wp_get_theme()->get( 'Version' )
    );
}
add_action( 'wp_enqueue_scripts', 'wlc_child_enqueue_styles', 20 );

Two details: the file must start with <?php and nothing before it, and the dependency handle (hello-elementor-theme-style) is specific to Hello Elementor — other themes use different handles, so check your theme's docs before copying this.

Step 5: Upload and activate

Zip the hello-elementor-child folder, then in WordPress go to Appearance → Themes → Add New Theme → Upload Theme and pick the ZIP. (FTP works too — upload the folder straight into themes/.) Find the child theme in the list and activate it. Keep the parent theme installed — the child cannot work without it.

Step 6: Check everything

Visit your homepage, a post page, and the mobile view. Check menus, widgets, logo, header and footer — a child theme can have its own settings, so something may need re-selecting. If the layout looks off, re-activate the parent; your child folder stays safe, it just won't be used while the parent is active.

Mistakes to avoid

Deleting the parent theme (the child depends on it).
Misspelling the Template value.
Copying the parent's whole functions.php into the child — WordPress loads both, so duplicate functions cause a fatal error.
Loading the parent stylesheet a second time.
Editing without a backup or a way back into your files.

That's the whole setup: two files, one exact folder name, and your customizations survive every update. If you want the longer version with troubleshooting, template overrides and FAQs, the full step-by-step guide is on WebLearnCraft: How to Create a WordPress Child Theme Step by Step.

And if your next customization is a script rather than CSS, here's the safe way to add JavaScript to WordPress without a plugin.

DEV Community: WebLearnCraft