theme structure Archives - Developry Plugins https://developryplugins.com/tag/theme-structure/ Mon, 24 Nov 2025 11:18:19 +0000 en-US hourly 1 https://developryplugins.com/wp-content/uploads/2025/11/cropped-favicon-32x32.png theme structure Archives - Developry Plugins https://developryplugins.com/tag/theme-structure/ 32 32 WordPress Theme Development from Scratch: Complete Tutorial 2025 https://developryplugins.com/wordpress-theme-development-from-scratch-complete-tutorial-2025/ Mon, 15 Dec 2025 09:00:00 +0000 https://developryplugins.com/?p=181 WordPress theme development transforms design concepts into functional WordPress interfaces through template files, functions.php, style.css, and template hierarchy. From basic index.php and style.css requirements to advanced custom templates, post types...

The post WordPress Theme Development from Scratch: Complete Tutorial 2025 appeared first on Developry Plugins.

]]>

WordPress theme development transforms design concepts into functional WordPress interfaces through template files, functions.php, style.css, and template hierarchy. From basic index.php and style.css requirements to advanced custom templates, post types integration, and theme customization APIs, custom themes provide complete design control beyond pre-built options. This comprehensive guide teaches theme file structure, template hierarchy, WordPress loops, navigation menus, widget areas, and modern theme development workflows.

Theme File Structure

Minimum Required Files:

mytheme/
├── style.css       (required)
├── index.php       (required)
├── screenshot.png  (recommended)

Complete Theme Structure:

mytheme/
├── style.css
├── index.php
├── functions.php
├── header.php
├── footer.php
├── sidebar.php
├── single.php
├── page.php
├── archive.php
├── search.php
├── 404.php
├── comments.php
├── screenshot.png
├── template-parts/
│   ├── content.php
│   └── content-none.php
├── inc/
│   ├── custom-header.php
│   └── template-tags.php
├── js/
│   └── custom.js
├── css/
│   └── custom.css
└── languages/
    └── mytheme.pot

Style.css Header

Required Theme Metadata:

/*
Theme Name: My Custom Theme
Theme URI: https://example.com/my-theme
Author: Your Name
Author URI: https://example.com
Description: A custom WordPress theme built from scratch
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.4
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mytheme
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments
*/

Only Theme Name required, but all recommended.

Index.php Template

Basic index.php Structure:

<?php get_header(); ?>

<div id="primary" class="content-area">
    <main id="main" class="site-main">

        <?php
        if (have_posts()) :
            while (have_posts()) :
                the_post();
                ?>
                <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
                    <header class="entry-header">
                        <h2 class="entry-title">
                            <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
                        </h2>
                    </header>

                    <div class="entry-content">
                        <?php the_excerpt(); ?>
                    </div>

                    <footer class="entry-footer">
                        <span class="posted-on"><?php echo get_the_date(); ?></span>
                        <span class="byline"> by <?php the_author(); ?></span>
                    </footer>
                </article>
                <?php
            endwhile;

            the_posts_navigation();
        else :
            ?>
            <p><?php esc_html_e('No posts found', 'mytheme'); ?></p>
        <?php endif; ?>

    </main>
</div>

<?php get_sidebar(); ?>
<?php get_footer(); ?>

Header.php Template

Standard Header Structure:

<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
    <meta charset="<?php bloginfo('charset'); ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="profile" href="https://gmpg.org/xfn/11">
    <?php wp_head(); ?>
</head>

<body <?php body_class(); ?>>
<?php wp_body_open(); ?>

<div id="page" class="site">
    <a class="skip-link screen-reader-text" href="#primary"><?php esc_html_e('Skip to content', 'mytheme'); ?></a>

    <header id="masthead" class="site-header">
        <div class="site-branding">
            <?php
            if (has_custom_logo()) :
                the_custom_logo();
            else :
                ?>
                <h1 class="site-title">
                    <a href="<?php echo esc_url(home_url('/')); ?>"><?php bloginfo('name'); ?></a>
                </h1>
                <p class="site-description"><?php bloginfo('description'); ?></p>
            <?php endif; ?>
        </div>

        <nav id="site-navigation" class="main-navigation">
            <button class="menu-toggle" aria-controls="primary-menu" aria-expanded="false">
                <?php esc_html_e('Menu', 'mytheme'); ?>
            </button>
            <?php
            wp_nav_menu(array(
                'theme_location' => 'primary',
                'menu_id'        => 'primary-menu',
            ));
            ?>
        </nav>
    </header>

    <div id="content" class="site-content">

Footer.php Template

Standard Footer Structure:

    </div><!-- #content -->

    <footer id="colophon" class="site-footer">
        <div class="site-info">
            <a href="<?php echo esc_url(__('https://wordpress.org/', 'mytheme')); ?>">
                <?php printf(esc_html__('Proudly powered by %s', 'mytheme'), 'WordPress'); ?>
            </a>
            <span class="sep"> | </span>
            <?php printf(esc_html__('Theme: %1$s by %2$s.', 'mytheme'), 'My Custom Theme', '<a href="https://example.com">Your Name</a>'); ?>
        </div>
    </footer>
</div><!-- #page -->

<?php wp_footer(); ?>

</body>
</html>

Functions.php Setup

Essential Functions:

<?php
/**
 * Theme Functions
 */

if (!defined('ABSPATH')) {
    exit; // Exit if accessed directly
}

/**
 * Theme Setup
 */
function mytheme_setup() {
    // Add default posts and comments RSS feed links to head
    add_theme_support('automatic-feed-links');

    // Let WordPress manage the document title
    add_theme_support('title-tag');

    // Enable support for Post Thumbnails
    add_theme_support('post-thumbnails');

    // Register navigation menus
    register_nav_menus(array(
        'primary' => esc_html__('Primary Menu', 'mytheme'),
        'footer'  => esc_html__('Footer Menu', 'mytheme'),
    ));

    // Switch default core markup to HTML5
    add_theme_support('html5', array(
        'search-form',
        'comment-form',
        'comment-list',
        'gallery',
        'caption',
        'style',
        'script',
    ));

    // Add theme support for selective refresh for widgets
    add_theme_support('customize-selective-refresh-widgets');

    // Add support for custom logo
    add_theme_support('custom-logo', array(
        'height'      => 100,
        'width'       => 400,
        'flex-height' => true,
        'flex-width'  => true,
    ));

    // Add support for custom background
    add_theme_support('custom-background', array(
        'default-color' => 'ffffff',
    ));

    // Add support for Block Editor styles
    add_theme_support('wp-block-styles');

    // Add support for full and wide align images
    add_theme_support('align-wide');

    // Add support for editor styles
    add_theme_support('editor-styles');

    // Enqueue editor styles
    add_editor_style('style-editor.css');

    // Add support for responsive embeds
    add_theme_support('responsive-embeds');
}
add_action('after_setup_theme', 'mytheme_setup');

/**
 * Set content width
 */
function mytheme_content_width() {
    $GLOBALS['content_width'] = apply_filters('mytheme_content_width', 800);
}
add_action('after_setup_theme', 'mytheme_content_width', 0);

/**
 * Enqueue scripts and styles
 */
function mytheme_scripts() {
    // Main stylesheet
    wp_enqueue_style('mytheme-style', get_stylesheet_uri(), array(), '1.0.0');

    // Custom stylesheet
    wp_enqueue_style('mytheme-custom', get_template_directory_uri() . '/css/custom.css', array(), '1.0.0');

    // Custom JavaScript
    wp_enqueue_script('mytheme-navigation', get_template_directory_uri() . '/js/navigation.js', array(), '1.0.0', true);

    // Comment reply script
    if (is_singular() && comments_open() && get_option('thread_comments')) {
        wp_enqueue_script('comment-reply');
    }
}
add_action('wp_enqueue_scripts', 'mytheme_scripts');

/**
 * Register widget areas
 */
function mytheme_widgets_init() {
    register_sidebar(array(
        'name'          => esc_html__('Sidebar', 'mytheme'),
        'id'            => 'sidebar-1',
        'description'   => esc_html__('Add widgets here.', 'mytheme'),
        'before_widget' => '<section id="%1$s" class="widget %2$s">',
        'after_widget'  => '</section>',
        'before_title'  => '<h2 class="widget-title">',
        'after_title'   => '</h2>',
    ));

    register_sidebar(array(
        'name'          => esc_html__('Footer', 'mytheme'),
        'id'            => 'footer-1',
        'description'   => esc_html__('Add footer widgets here.', 'mytheme'),
        'before_widget' => '<div id="%1$s" class="widget %2$s">',
        'after_widget'  => '</div>',
        'before_title'  => '<h3 class="widget-title">',
        'after_title'   => '</h3>',
    ));
}
add_action('widgets_init', 'mytheme_widgets_init');

Single.php Template

Single Post Template:

<?php get_header(); ?>

<div id="primary" class="content-area">
    <main id="main" class="site-main">

        <?php
        while (have_posts()) :
            the_post();
            ?>

            <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
                <header class="entry-header">
                    <?php the_title('<h1 class="entry-title">', '</h1>'); ?>

                    <div class="entry-meta">
                        <span class="posted-on">
                            <?php echo get_the_date(); ?>
                        </span>
                        <span class="byline">
                            by <?php the_author_posts_link(); ?>
                        </span>
                        <span class="cat-links">
                            <?php the_category(', '); ?>
                        </span>
                    </div>
                </header>

                <?php if (has_post_thumbnail()) : ?>
                    <div class="post-thumbnail">
                        <?php the_post_thumbnail('large'); ?>
                    </div>
                <?php endif; ?>

                <div class="entry-content">
                    <?php
                    the_content();

                    wp_link_pages(array(
                        'before' => '<div class="page-links">' . esc_html__('Pages:', 'mytheme'),
                        'after'  => '</div>',
                    ));
                    ?>
                </div>

                <footer class="entry-footer">
                    <?php the_tags('<span class="tags-links">', ', ', '</span>'); ?>
                </footer>
            </article>

            <?php
            // Previous/next post navigation
            the_post_navigation(array(
                'prev_text' => '<span class="nav-subtitle">' . esc_html__('Previous:', 'mytheme') . '</span> <span class="nav-title">%title</span>',
                'next_text' => '<span class="nav-subtitle">' . esc_html__('Next:', 'mytheme') . '</span> <span class="nav-title">%title</span>',
            ));

            // Comments
            if (comments_open() || get_comments_number()) :
                comments_template();
            endif;

        endwhile;
        ?>

    </main>
</div>

<?php get_sidebar(); ?>
<?php get_footer(); ?>

Page.php Template

Static Page Template:

<?php get_header(); ?>

<div id="primary" class="content-area">
    <main id="main" class="site-main">

        <?php
        while (have_posts()) :
            the_post();
            ?>

            <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
                <header class="entry-header">
                    <?php the_title('<h1 class="entry-title">', '</h1>'); ?>
                </header>

                <div class="entry-content">
                    <?php
                    the_content();

                    wp_link_pages(array(
                        'before' => '<div class="page-links">' . esc_html__('Pages:', 'mytheme'),
                        'after'  => '</div>',
                    ));
                    ?>
                </div>

                <?php if (comments_open() || get_comments_number()) : ?>
                    <?php comments_template(); ?>
                <?php endif; ?>
            </article>

        <?php endwhile; ?>

    </main>
</div>

<?php get_footer(); ?>

Archive.php Template

Archive Listing Template:

<?php get_header(); ?>

<div id="primary" class="content-area">
    <main id="main" class="site-main">

        <?php if (have_posts()) : ?>

            <header class="page-header">
                <?php
                the_archive_title('<h1 class="page-title">', '</h1>');
                the_archive_description('<div class="archive-description">', '</div>');
                ?>
            </header>

            <?php
            while (have_posts()) :
                the_post();
                get_template_part('template-parts/content', 'excerpt');
            endwhile;

            the_posts_navigation();

        else :
            get_template_part('template-parts/content', 'none');
        endif;
        ?>

    </main>
</div>

<?php get_sidebar(); ?>
<?php get_footer(); ?>

Template Parts

template-parts/content-excerpt.php:

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
    <header class="entry-header">
        <?php the_title(sprintf('<h2 class="entry-title"><a href="%s">', esc_url(get_permalink())), '</a></h2>'); ?>

        <div class="entry-meta">
            <span class="posted-on"><?php echo get_the_date(); ?></span>
            <span class="byline"> by <?php the_author(); ?></span>
        </div>
    </header>

    <?php if (has_post_thumbnail()) : ?>
        <div class="post-thumbnail">
            <a href="<?php the_permalink(); ?>">
                <?php the_post_thumbnail('medium'); ?>
            </a>
        </div>
    <?php endif; ?>

    <div class="entry-summary">
        <?php the_excerpt(); ?>
    </div>

    <footer class="entry-footer">
        <a href="<?php the_permalink(); ?>" class="read-more">
            <?php esc_html_e('Read More', 'mytheme'); ?>
        </a>
    </footer>
</article>

Sidebar.php Template

Widget Area Sidebar:

<?php
if (!is_active_sidebar('sidebar-1')) {
    return;
}
?>

<aside id="secondary" class="widget-area">
    <?php dynamic_sidebar('sidebar-1'); ?>
</aside>

Search.php Template

Search Results Template:

<?php get_header(); ?>

<div id="primary" class="content-area">
    <main id="main" class="site-main">

        <?php if (have_posts()) : ?>

            <header class="page-header">
                <h1 class="page-title">
                    <?php printf(esc_html__('Search Results for: %s', 'mytheme'), '<span>' . get_search_query() . '</span>'); ?>
                </h1>
            </header>

            <?php
            while (have_posts()) :
                the_post();
                get_template_part('template-parts/content', 'search');
            endwhile;

            the_posts_navigation();

        else :
            ?>
            <section class="no-results not-found">
                <header class="page-header">
                    <h1 class="page-title"><?php esc_html_e('Nothing Found', 'mytheme'); ?></h1>
                </header>

                <div class="page-content">
                    <p><?php esc_html_e('Sorry, but nothing matched your search terms. Please try again with different keywords.', 'mytheme'); ?></p>
                    <?php get_search_form(); ?>
                </div>
            </section>
        <?php endif; ?>

    </main>
</div>

<?php get_sidebar(); ?>
<?php get_footer(); ?>

Conclusion

WordPress theme development creates custom designs through template hierarchy, functions.php configuration, and modular template parts. Build themes from scratch using required style.css and index.php files, expand functionality through header.php, footer.php, single.php, page.php templates, register navigation menus and widget areas, enqueue stylesheets and scripts properly, and follow WordPress coding standards. Custom themes provide unlimited design flexibility and complete control over WordPress site appearance and functionality.

  1. WordPress Theme Handbook
  2. Template Hierarchy
  3. Theme Development Checklist
  4. WordPress Coding Standards
  5. Underscores Starter Theme

Call to Action

Custom themes need reliable backups. Backup Copilot Pro protects your WordPress theme files and database automatically. Safeguard your development work—start your free 30-day trial today!

The post WordPress Theme Development from Scratch: Complete Tutorial 2025 appeared first on Developry Plugins.

]]> WordPress Theme Template Hierarchy Explained with Examples https://developryplugins.com/wordpress-theme-template-hierarchy-explained-with-examples/ Wed, 10 Dec 2025 09:00:00 +0000 https://developryplugins.com/?p=183 WordPress template hierarchy determines which PHP template file displays content based on requested URL, following predictable fallback pattern from specific to general templates. From single-post-slug.php specificity to index.php fallback, understanding...

The post WordPress Theme Template Hierarchy Explained with Examples appeared first on Developry Plugins.

]]>

WordPress template hierarchy determines which PHP template file displays content based on requested URL, following predictable fallback pattern from specific to general templates. From single-post-slug.php specificity to index.php fallback, understanding template hierarchy enables precise control over content presentation across post types, taxonomies, and page templates. This comprehensive guide teaches hierarchy visualization, template selection logic, conditional tags, custom template creation, and debugging techniques identifying active templates.

How Template Hierarchy Works

Request Flow:

  1. User requests URL: example.com/category/news/
  2. WordPress identifies request type: Category archive
  3. WordPress searches for templates in order:
    • category-news.php (category slug)
    • category-5.php (category ID)
    • category.php (generic category)
    • archive.php (generic archive)
    • index.php (fallback)
  4. First matching template renders content

Fallback System:

WordPress searches from most specific to least specific until finding template file.

Example Hierarchy (single post):

single-{post-type}-{slug}.php
→ single-{post-type}.php
→ single.php
→ singular.php
→ index.php

Index.php – The Fallback

Ultimate Fallback:

index.php displays content when no specific template exists.

Required: Every theme must have index.php.

Example index.php:

<?php get_header(); ?>

<main id="main">
    <?php
    if (have_posts()) :
        while (have_posts()) :
            the_post();
            get_template_part('template-parts/content', get_post_type());
        endwhile;
    endif;
    ?>
</main>

<?php get_sidebar(); ?>
<?php get_footer(); ?>

Single Post Templates

Hierarchy:

single-{post-type}-{slug}.php
single-{post-type}.php
single.php
singular.php
index.php

Examples:

Post slug hello-world:

  • single-post-hello-world.php (most specific)
  • single-post.php
  • single.php
  • singular.php
  • index.php

Custom post type portfolio with slug web-design:

  • single-portfolio-web-design.php
  • single-portfolio.php
  • single.php
  • singular.php
  • index.php

single.php:

<?php get_header(); ?>

<main id="primary">
    <?php
    while (have_posts()) :
        the_post();
        ?>
        <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
            <header class="entry-header">
                <?php the_title('<h1>', '</h1>'); ?>
                <div class="entry-meta">
                    Posted on <?php echo get_the_date(); ?> by <?php the_author(); ?>
                </div>
            </header>

            <?php if (has_post_thumbnail()) : ?>
                <?php the_post_thumbnail('large'); ?>
            <?php endif; ?>

            <div class="entry-content">
                <?php the_content(); ?>
            </div>

            <footer class="entry-footer">
                <?php the_tags('<span class="tags">', ', ', '</span>'); ?>
            </footer>
        </article>

        <?php
        if (comments_open() || get_comments_number()) :
            comments_template();
        endif;
    endwhile;
    ?>
</main>

<?php get_sidebar(); ?>
<?php get_footer(); ?>

Page Templates

Hierarchy:

{custom-template}.php (selected via admin)
page-{slug}.php
page-{id}.php
page.php
singular.php
index.php

Examples:

Page slug about:

  • Custom template (if selected in admin)
  • page-about.php
  • page-42.php (if page ID is 42)
  • page.php
  • singular.php
  • index.php

page.php:

<?php get_header(); ?>

<main id="primary">
    <?php
    while (have_posts()) :
        the_post();
        ?>
        <article id="page-<?php the_ID(); ?>" <?php post_class(); ?>>
            <header class="entry-header">
                <?php the_title('<h1>', '</h1>'); ?>
            </header>

            <div class="entry-content">
                <?php the_content(); ?>
            </div>
        </article>
    <?php endwhile; ?>
</main>

<?php get_footer(); ?>

Custom Page Template:

template-fullwidth.php:

<?php
/**
 * Template Name: Full Width
 * Template Post Type: page, post
 */

get_header(); ?>

<main id="primary" class="full-width">
    <?php
    while (have_posts()) :
        the_post();
        the_content();
    endwhile;
    ?>
</main>

<?php get_footer(); ?>

Selectable via: Page edit screen → Page Attributes → Template

Category Archive Templates

Hierarchy:

category-{slug}.php
category-{id}.php
category.php
archive.php
index.php

Examples:

Category slug news (ID 5):

  • category-news.php
  • category-5.php
  • category.php
  • archive.php
  • index.php

category.php:

<?php get_header(); ?>

<main id="primary">
    <header class="page-header">
        <h1><?php single_cat_title(); ?></h1>
        <div class="category-description">
            <?php echo category_description(); ?>
        </div>
    </header>

    <?php if (have_posts()) : ?>
        <div class="posts-list">
            <?php
            while (have_posts()) :
                the_post();
                ?>
                <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
                    <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                    <div class="entry-summary">
                        <?php the_excerpt(); ?>
                    </div>
                </article>
            <?php endwhile; ?>
        </div>

        <?php the_posts_pagination(); ?>
    <?php else : ?>
        <p>No posts found in this category.</p>
    <?php endif; ?>
</main>

<?php get_sidebar(); ?>
<?php get_footer(); ?>

Tag Archive Templates

Hierarchy:

tag-{slug}.php
tag-{id}.php
tag.php
archive.php
index.php

Examples:

Tag slug wordpress (ID 10):

  • tag-wordpress.php
  • tag-10.php
  • tag.php
  • archive.php
  • index.php

Custom Post Type Archives

Hierarchy:

archive-{post-type}.php
archive.php
index.php

Example:

Portfolio post type:

  • archive-portfolio.php
  • archive.php
  • index.php

archive-portfolio.php:

<?php get_header(); ?>

<main id="primary">
    <header class="page-header">
        <h1>Portfolio</h1>
    </header>

    <?php if (have_posts()) : ?>
        <div class="portfolio-grid">
            <?php
            while (have_posts()) :
                the_post();
                ?>
                <div class="portfolio-item">
                    <a href="<?php the_permalink(); ?>">
                        <?php the_post_thumbnail('medium'); ?>
                        <h3><?php the_title(); ?></h3>
                    </a>
                </div>
            <?php endwhile; ?>
        </div>

        <?php the_posts_pagination(); ?>
    <?php endif; ?>
</main>

<?php get_footer(); ?>

Custom Taxonomy Templates

Hierarchy:

taxonomy-{taxonomy}-{term}.php
taxonomy-{taxonomy}.php
taxonomy.php
archive.php
index.php

Example:

Taxonomy portfolio_category, term web-design:

  • taxonomy-portfolio_category-web-design.php
  • taxonomy-portfolio_category.php
  • taxonomy.php
  • archive.php
  • index.php

Author Archive Templates

Hierarchy:

author-{nicename}.php
author-{id}.php
author.php
archive.php
index.php

author.php:

<?php get_header(); ?>

<main id="primary">
    <header class="author-header">
        <div class="author-avatar">
            <?php echo get_avatar(get_the_author_meta('ID'), 150); ?>
        </div>
        <div class="author-info">
            <h1><?php echo get_the_author(); ?></h1>
            <p class="author-bio"><?php echo get_the_author_meta('description'); ?></p>
        </div>
    </header>

    <?php if (have_posts()) : ?>
        <div class="author-posts">
            <h2>Posts by <?php echo get_the_author(); ?></h2>
            <?php
            while (have_posts()) :
                the_post();
                get_template_part('template-parts/content', 'excerpt');
            endwhile;
            ?>
        </div>

        <?php the_posts_pagination(); ?>
    <?php endif; ?>
</main>

<?php get_sidebar(); ?>
<?php get_footer(); ?>

Date Archive Templates

Hierarchy:

date.php
archive.php
index.php

date.php:

<?php get_header(); ?>

<main id="primary">
    <header class="page-header">
        <h1>
            <?php
            if (is_day()) :
                printf('Archives: %s', get_the_date());
            elseif (is_month()) :
                printf('Archives: %s', get_the_date('F Y'));
            elseif (is_year()) :
                printf('Archives: %s', get_the_date('Y'));
            endif;
            ?>
        </h1>
    </header>

    <?php if (have_posts()) : ?>
        <?php
        while (have_posts()) :
            the_post();
            get_template_part('template-parts/content', 'archive');
        endwhile;
        ?>

        <?php the_posts_pagination(); ?>
    <?php endif; ?>
</main>

<?php get_sidebar(); ?>
<?php get_footer(); ?>

Search Results Template

Hierarchy:

search.php
index.php

search.php:

<?php get_header(); ?>

<main id="primary">
    <header class="page-header">
        <h1>
            <?php printf('Search Results for: %s', '<span>' . get_search_query() . '</span>'); ?>
        </h1>
    </header>

    <?php if (have_posts()) : ?>
        <?php
        while (have_posts()) :
            the_post();
            ?>
            <article>
                <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                <div class="entry-summary">
                    <?php the_excerpt(); ?>
                </div>
            </article>
        <?php endwhile; ?>

        <?php the_posts_pagination(); ?>
    <?php else : ?>
        <div class="no-results">
            <p>No results found. Please try different keywords.</p>
            <?php get_search_form(); ?>
        </div>
    <?php endif; ?>
</main>

<?php get_sidebar(); ?>
<?php get_footer(); ?>

404 Error Template

Hierarchy:

404.php
index.php

404.php:

<?php get_header(); ?>

<main id="primary">
    <section class="error-404">
        <header class="page-header">
            <h1>404: Page Not Found</h1>
        </header>

        <div class="page-content">
            <p>The page you are looking for might have been removed, had its name changed, or is temporarily unavailable.</p>

            <h2>Try searching:</h2>
            <?php get_search_form(); ?>

            <h2>Popular Posts:</h2>
            <?php
            $popular = new WP_Query(array(
                'posts_per_page' => 5,
                'orderby' => 'comment_count'
            ));

            if ($popular->have_posts()) :
                echo '<ul>';
                while ($popular->have_posts()) :
                    $popular->the_post();
                    echo '<li><a href="' . get_permalink() . '">' . get_the_title() . '</a></li>';
                endwhile;
                echo '</ul>';
                wp_reset_postdata();
            endif;
            ?>
        </div>
    </section>
</main>

<?php get_footer(); ?>

Attachment Template

Hierarchy:

{MIME_type}.php (image.php, video.php, application.php)
attachment.php
single-attachment-{slug}.php
single-attachment.php
single.php
singular.php
index.php

Front Page Template

Hierarchy:

front-page.php
home.php (if front page displays posts)
page.php (if static front page set)
index.php

front-page.php:

<?php get_header(); ?>

<main id="primary" class="front-page">
    <section class="hero">
        <h1>Welcome to Our Website</h1>
        <p>Featured content here</p>
    </section>

    <section class="recent-posts">
        <h2>Latest Posts</h2>
        <?php
        $recent_posts = new WP_Query(array(
            'posts_per_page' => 3,
        ));

        if ($recent_posts->have_posts()) :
            while ($recent_posts->have_posts()) :
                $recent_posts->the_post();
                get_template_part('template-parts/content', 'excerpt');
            endwhile;
            wp_reset_postdata();
        endif;
        ?>
    </section>
</main>

<?php get_footer(); ?>

Debugging Template Hierarchy

Show Active Template:

// Add to functions.php
add_filter('template_include', function($template) {
    if (current_user_can('manage_options')) {
        echo '<!-- Template: ' . basename($template) . ' -->';
    }
    return $template;
});

Query Monitor Plugin:

Install Query Monitor plugin to see:

  • Active template file
  • Template hierarchy checked
  • Conditional tags active

Conditional Tags:

Determine current page type:

is_home()           // Blog posts index
is_front_page()     // Front page (static or posts)
is_single()         // Single post
is_page()           // Single page
is_category()       // Category archive
is_tag()            // Tag archive
is_tax()            // Custom taxonomy archive
is_author()         // Author archive
is_date()           // Date archive
is_search()         // Search results
is_404()            // 404 error
is_archive()        // Any archive
is_singular()       // Single post or page

Conclusion

WordPress template hierarchy determines content display through systematic fallback from specific to general template files. Master single post hierarchy flowing from post-slug specificity to index.php fallback, understand archive template selection for categories, tags, and custom taxonomies, create custom page templates with Template Name headers, and utilize conditional tags identifying page types. Template hierarchy provides predictable template selection enabling precise control over WordPress content presentation across all post types and request types.

  1. Template Hierarchy Documentation
  2. Conditional Tags Reference
  3. Template Files List
  4. Query Monitor Plugin
  5. Interactive Template Hierarchy

Call to Action

Theme customizations need reliable backups. Backup Copilot Pro protects your WordPress theme files automatically. Safeguard your template modifications—start your free 30-day trial today!

The post WordPress Theme Template Hierarchy Explained with Examples appeared first on Developry Plugins.

]]>