How to create a WordPress theme?

Themes allow you to present a consistent format for each page or article published on your site. The themes provided by WordPress and its community may have some limitations in suggested designs, and you may want or need your own theme to customize your site to your needs. By creating your own theme, you can quickly improve the look of your website: style and add new menus, change some tags or add HTML and CSS code, tweak the design, customize the footer…

Requirements for creating a WordPress theme

Although it is not really necessary to create a WordPress theme, it is recommended to install your WordPress site on a remote or local server to which you have access. This WordPress will be used in part to test the theme you just created and verify that it works properly.

To create a complex theme, it is best to know the basic web languages such as HTML and CSS, as well as the PHP programming language used in WordPress and the template files for “a” theme.

Create your theme folder

To create a WordPress theme, you must first create a folder in the WordPress directory on your server: wp-content/themes. A unique and short name is recommended for easy identification. Do not use special characters, accents or spaces. For example, if you called it “untheme”, the path would look like this: wp-content/themes/untheme.

This folder must contain at least three files that are essential for the proper functioning of your site:

• style.css file: used to configure and add style rules,
• index.php file: used to display the content of your site,
• Functions.php file: used to add WordPress functions to your theme.

Style.css file

The style file “style.css” is necessary for the theme, because it will allow WordPress to recognize your theme and display it in the site administration interface. Then for all the style files, this file will allow you to add style rules to modify the formatting of the theme elements.

After creating the “style.css” file, open it and add the following lines of code replacing the generic information by information related to your theme and your personal information:

/*
Theme Name: name of the theme
Theme URI: https://www.monsite.fr/
Author: Name of the author
Author URI: https://www.site-auteur.fr/
Description : Describe the theme in a few words
Version : 1.0
*/

Following the declaration of these few lines of code, you will be able to add CSS style rules as you would on any CSS style sheet.

Creating an index.php file

WordPress themes use a template system that corresponds to .php files whose names allow the CMS to know which file to load depending on the context of the page being displayed. This is called a template hierarchy. In order to display any content, WordPress will always use the index.php file as a last resort. This is why it is essential and why you should at least create it. Template hierarchy diagrams can be read from left to right. If you want to create a specific template file for a given page type, start on the left side of the chart and work your way to the right until you find the file name that meets your needs.

It is strongly discouraged to fall into the trap of overly specific templates. Instead, try to choose as general a template as possible first (a primary template in blue or a secondary template in green). If more specific needs arise during development, you can simply rename the template to a more appropriate one, and possibly make some minor adjustments. By doing so, you will avoid unnecessary duplication of code, which will make it easier to maintain your WordPress theme.

Functions.php file

The functions.php file is not needed to activate the theme on your WordPress site, but it is needed to add features to your theme or to activate common features of WordPress themes.

In the next part of this tutorial, you will learn how to create menus for your theme by adding functions to the functions.php file.

Activating the Created Theme

Once you have created the important theme files, you can activate the newly created theme on your WordPress site.

To do this, do this for any theme, then go to Appearance > Themes (1) from your WordPress admin panel. Then click on the Activate (2) button of the theme you just created to make it active on your website.