Illustration: A file manager containing three files.

Creating a WordPress theme only requires three files. style.css, index.php, functions.php. However since we’ll be needing them later lets include header.php and footer.php.

Some of the code samples get a little busy in this section so I’ve provided them in a Bitbucket snippet for easier reading and download.

Tip: Before beginning consider setting wp_debug to true in wp-config.php this will expose any errors or warnings encountered during your theme building process.

Configuring WP_DEBUG to true
Configuring WP_DEBUG to true


WordPress relies on style.css to provide basic information about your theme. Some fields are required while others are optional.

Theme Name: Scratch JD
Theme URI:
Author: Joseph Dickson
Author URI:
Description: Scratch is a no thrills theme.
Version: 1.0.0
License: GNU General Public License v3
License URI:
Text Domain: scratch-jd


This is where we enqueue our theme’s stylesheet and run a simple setup function to check that our theme is calling its own functions.

 *	@since Scratch JD 1.0.0
 * 	Proper way to enqueue scripts and styles

function scratch_jd_scripts() {

	wp_enqueue_style( 'scratch-jd', get_stylesheet_uri() );

add_action( 'wp_enqueue_scripts', 'scratch_jd_scripts' );


 * The template for displaying the header
 * @link
 * @since Scratch JD 1.0.0


 * The template for displaying the footer
 * @link
 * @since Scratch JD 1.0.0


The index.php file is a primary fallback for all WordPress templates. It can be overridden by more specific files by using the template hierarchy.

Because I promised we’d keep things simple index.php will only contain four WordPress hooks and the WordPress loop.

The Loop: Retrieves a post’s content from the WordPress database and displays it on the current post, page, index or archive.

the_title(): Retrieves a post’s title from the database and allows for adding html around it

the_content(): Retrieves the post’s content from the database

get_header(): Retrieves header.php from your theme.

get_footer(): Retrieves footer.php from your theme.

// Get the Header

// The Loop
if ( have_posts() ) {
        while ( have_posts() ) {

                // Display the post title and HTML              
                // Display post content
        } // end while
} // end if

// Get the Footer

Archiving and Testing

Once all the files are ready we can either copy them directly to our localhost and test live or install it.

Copying the folder to your localhost in Ubuntu

sudo cp scratch-jd/ /var/www/html/scratch/wp-content/themes/ -r
Copy your files to localhost for testing

Create a Zip Archive in the bash terminal

zip -r scratch-jd .
Creating a zip archive in bash
Creating a zip archive

Uploading and activating and the desired results.

Uploading and activating the theme

Albeit not very interesting this theme technically works, It pulls in both the header and footer scripts a cascading stylesheet as well as The Loop.

In the next post we’ll learn about creating navigational menus.

To the extent possible under law, Joseph Dickson has waived all copyright and related or neighboring rights to Building a WordPress Theme From Scratch. This work is published from: United States.


Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.