WordPress Child Themes: Customize Safely Without Losing Changes

Child themes are the WordPress-approved way to customize themes safely. When you customize directly in a parent theme and update it, your changes disappear. Child themes solve this: you inherit the parent theme's functionality but store your modifications separately, surviving updates.

Why Use Child Themes?

Problem without child themes:

• Edit parent theme CSS → theme updates wipe out your changes
• Customize template files → next update overwrites them
• Add functions.php code → lost on update
• You're stuck choosing: keep customizations OR keep theme updated

Solution with child themes:

• Customize child theme (child stays intact during parent updates)
• Parent theme updates include security fixes, new features
• You get both: customization AND updates ✅

How Child Themes Work

WordPress loads theme files in this order:

1. Child theme folder (your customizations) ← checks here first
2. Parent theme folder (original theme) ← if not found in child, uses this

So you only need to include files you're changing. Everything else inherits from parent.

Create Child Theme Manually

Step 1: Create folder structure via FTP or File Manager

/wp-content/themes/twentytwentythree-child/
  ├── style.css
  ├── functions.php
  └── (other override files)

Step 2: Create style.css with header (required):

/*
Theme Name: Twenty Twenty Three Child
Theme URI: https://yourdomain.com
Description: Child theme for Twenty Twenty Three
Author: Your Name
Template: twentytwentythree
Version: 1.0.0
License: GPL v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentythree-child
*/

/* Import parent theme stylesheet */
@import url( '../twentytwentythree/style.css' );

/* Add your custom styles below */
body {
    font-family: 'Georgia', serif;
}

.site-title {
    color: #0066cc;
}

Key line: Template: twentytwentythree tells WordPress which parent theme this is a child of.

Step 3: Create functions.php (optional but common):

<?php
/**
 * Child theme functions
 */

// Enqueue parent theme stylesheet
add_action( 'wp_enqueue_scripts', 'child_theme_enqueue_styles' );
function child_theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style',
        get_template_directory_uri() . '/style.css' );
}

// Add custom theme support
add_theme_support( 'custom-logo' );
add_theme_support( 'post-thumbnails' );
?>

Step 4: Activate in WordPress

1. Log into WordPress admin
2. Go to Appearance → Themes
3. Find your child theme
4. Click Activate

Generate via Tools

No-code option: Use child theme generators

• WordPress.org Child Theme Generator: Online tool creates downloadable ZIP
• Neve Child Theme Generator (plugin): Generate inside WordPress admin
• GeneratePress: Built-in child theme generator

Upload generated ZIP via Appearance → Themes → Upload Theme, activate, done!

Customize Styles (CSS)

Add custom CSS to child theme's style.css:

/* Change header background color */
.site-header {
    background-color: #1a1a1a;
}

/* Modify button styles */
.button, button, input[type="button"] {
    background-color: #ff6b35;
    color: white;
    border-radius: 5px;
    padding: 10px 20px;
}

/* Adjust sidebar width */
.sidebar {
    width: 30%;
}

Use browser DevTools to find CSS selectors:

1. Right-click element → Inspect
2. Find the CSS class/ID
3. Add override to child theme style.css

Override Template Files

Copy files from parent to child to customize them

Example: Customize homepage layout:

# Parent theme path
/wp-content/themes/twentytwentythree/home.php

# Copy to child theme
/wp-content/themes/twentytwentythree-child/home.php

Edit the child copy. Your version will load instead of parent's version.

Common files to override:

• header.php - Site header/navigation
• footer.php - Site footer
• home.php - Homepage
• single.php - Single post page
• archive.php - Category/tag pages

Add Custom Functions

Add custom hooks and filters in functions.php:

# Remove default theme footer
add_action( 'wp_footer', function() {
    remove_action( 'wp_footer', 'my_theme_footer' );
}, 1 );

# Add custom widget area
add_action( 'widgets_init', function() {
    register_sidebar( array(
        'name' => 'Custom Sidebar',
        'id' => 'custom-sidebar',
    ) );
} );

# Modify post excerpt length
add_filter( 'excerpt_length', function() {
    return 25; // Show 25 words instead of 55
} );

Best Practices

• Always use child themes: Never edit parent theme directly
• Keep functions.php organized: Use comments to separate sections
• Test changes: Use staging before applying to live site (see WordPress staging)
• Minify CSS/JS: Reduce file sizes for performance
• Document changes: Add comments explaining customizations
• Backup before updating: Always backup before parent theme updates

Related: WordPress SEO basics-Yoast, Rank Math, sitemaps, and speed | Backup strategy | WordPress Page Builders: Comparison & Setup Guide

Related articles