WordPress Theme Files and Functions
A classic WordPress theme can be very small. It needs only two files: style.css and index.php. In real themes we split the code into more files. We will build a tiny theme and see it work on the site.
The theme files
| File | Purpose |
|---|---|
| style.css | Required. The comment at the top gives the theme name and details. It also holds the CSS |
| index.php | Required. The fallback template, used when no better one is found |
| header.php | The top part of every page, until the opening of the main area |
| footer.php | The bottom part of every page |
| functions.php | Your PHP code for the theme: support features, menus, scripts |
| single.php, page.php, archive.php | Templates for one post, one page and archive lists |
| screenshot.png | The preview image in the themes screen |
style.css
/*
Theme Name: TC Demo Theme
Description: A very small theme to learn WordPress
Author: Tutorials Class
Version: 1.0
*/
body { font-family: sans-serif; margin: 2rem; }header.php and footer.php
The header has the HTML start and the two most important functions: wp_head() and body_class(). The footer must have wp_footer() before the closing body tag. Without them, plugins and scripts will not work.
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>">
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<header>
<h1><a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php bloginfo( 'name' ); ?></a></h1>
</header><footer>
<p>© <?php echo esc_html( date( 'Y' ) ); ?> <?php bloginfo( 'name' ); ?></p>
</footer>
<?php wp_footer(); ?>
</body>
</html>index.php
<?php get_header(); ?>
<main>
<?php if ( have_posts() ) : ?>
<?php while ( have_posts() ) : the_post(); ?>
<article>
<h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<?php the_content(); ?>
</article>
<?php endwhile; ?>
<?php else : ?>
<p>Nothing found.</p>
<?php endif; ?>
</main>
<?php get_footer(); ?>functions.php
In functions.php we tell WordPress what the theme supports. The title-tag support lets WordPress write the page title, so we do not need to write a <title> tag by hand.
<?php
function tc_theme_setup() {
add_theme_support( 'title-tag' );
add_theme_support( 'post-thumbnails' );
add_theme_support( 'html5', array( 'search-form', 'comment-form', 'gallery' ) );
}
add_action( 'after_setup_theme', 'tc_theme_setup' );Activate and test the theme
$ wp theme activate tc-theme
Success: Switched to 'TC Demo Theme' theme.
$ wp theme list –fields=name,status
name status
tc-theme active
twentytwentyfive inactive
twentytwentyfour inactive
twentytwentythree inactive
$ curl -s http://example.com/ | grep -E "<title>|<h1|<h2|<footer|<p>"
<title>Demo Site</title>
<h1><a href="http://example.com/">Demo Site</a></h1>
<h2><a href="http://example.com/hello-world/">Hello world!</a></h2>
<footer>
<p>© 2026 Demo Site</p>
Important template functions
| Function | What it does |
|---|---|
| get_header(), get_footer() | Load header.php and footer.php |
| get_sidebar() | Load sidebar.php |
| get_template_part( ‘parts/card’ ) | Load a smaller reusable file |
| bloginfo( ‘name’ ) | Print site details (name, description, charset, url) |
| home_url(), site_url() | Addresses of the site |
| get_template_directory_uri() | URL of the theme folder (for images and files) |
| the_title(), the_content(), the_permalink() | Details of the current post inside the loop |
| wp_head(), wp_footer() | Hooks for plugins and scripts. Do not forget them |
| Exercises & Assignments |
|---|
| No Content Found. |
| Interview Questions & Answers |
|---|
| No Content Found. |