Create The7 Child Theme
April 2, 2025 · AI Conversations
—
### ✅ Step 1: Create the Child Theme Folder
1. Go to your WordPress installation directory.
2. Navigate to `wp-content/themes/`.
3. Create a new folder and name it something like `the7-child`.
—
### ✅ Step 2: Create the `style.css` File
Inside the `the7-child` folder, create a file named `style.css` with the following content:
/*
Theme Name: The7 Child
Theme URI: https://example.com/
Description: Child theme for The7 WordPress theme
Author: Your Name
Author URI: https://yourwebsite.com/
Template: dt-the7
Version: 1.0.0
*/
/* Import parent theme styles */
@import url("../dt-the7/style.css");
> 🔔 `Template: dt-the7` is the directory name of The7 theme. Make sure it matches the folder name exactly.
—
### ✅ Step 3: Create the `functions.php` File
Still inside the `the7-child` folder, create a `functions.php` file with the following content to properly enqueue styles:
<?php
// Enqueue parent and child theme styles
function the7_child_enqueue_styles() {
wp_enqueue_style( 'the7-parent-style', get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'the7-child-style', get_stylesheet_directory_uri() . '/style.css', array('the7-parent-style') );
}
add_action( 'wp_enqueue_scripts', 'the7_child_enqueue_styles' );
—
### ✅ Step 4: Activate the Child Theme
1. Go to **Appearance > Themes** in your WordPress dashboard.
2. You should now see **The7 Child** listed.
3. Click **Activate**.
—
### ✅ Optional: Add Screenshot
Add a `screenshot.png` file (880×660px recommended) to your child theme folder so it shows up nicely in the WordPress admin.
—
Let me know if you want a downloadable `.zip` of the child theme or want to customize it further (like overriding templates or functions).
—
### ✅ Step 1: Create a Template File
Inside your child theme folder (`the7-child`), create a new PHP file. For example:
the7-child/
└── page-custom-template.php
—
### ✅ Step 2: Add Template Header Comment
At the very top of that file, add this comment block:
<?php
/**
* Template Name: Custom Page Template
* Description: A custom page template in The7 child theme.
*/
This tells WordPress to list it as a selectable template in the Page Editor.
—
### ✅ Step 3: Add Template Code
You can copy the structure of a The7 page or create a simple one:
<?php
/* Template Name: Custom Page Template */
get_header(); ?>
<div id="primary" class="content-area">
<main id="main" class="site-main">
<section class="custom-template-section">
<h1><?php the_title(); ?></h1>
<div class="entry-content">
<?php
while ( have_posts() ) : the_post();
the_content();
endwhile;
?>
</div>
</section>
</main>
</div>
<?php get_footer(); ?>
—
### ✅ Step 4: Use the Template
1. Go to **Pages > Add New** or edit an existing page.
2. On the right side under **Page Attributes** (or Template dropdown if using Block Editor), select **Custom Page Template**.
3. Save and view the page.
—
Let me know if you’d like this template to extend or override any specific The7 layouts or elements. I can help you include The7 theme functions or design it to match the default layout.
—
### ✅ Basic Usage
if ( is_page_template( 'page-custom-template.php' ) ) {
// Do something only on this page template
}
> 💡 The path is relative to the **theme root**, so if your child theme has the template directly in it, this works fine.
—
### ✅ Example in `functions.php`
add_action( 'wp_enqueue_scripts', 'enqueue_for_custom_template' );
function enqueue_for_custom_template() {
if ( is_page_template( 'page-custom-template.php' ) ) {
wp_enqueue_style( 'custom-template-style', get_stylesheet_directory_uri() . '/custom-template.css' );
}
}
—
### ✅ Example in a Template File
<?php
if ( is_page_template( 'page-custom-template.php' ) ) {
echo '<p>This is the custom template page!</p>';
}
?>
—
### ✅ For Parent Theme Templates
If you're checking for a page template that exists **in the parent theme**, you’d use:
is_page_template( 'parent-folder/template-name.php' );
But for **child theme templates**, just the file name (e.g. `'page-custom-template.php'`) is enough.
—
Want help conditionally loading assets or functions just for that template?