Your Own Template in Wordpress

The vast majority of websites are built on different CMS systems that are meant to make content management easier. One of the most popular is Wordpress. Today, let us look at how to build a basic template for Wordpress.

Acacia

From this article you will learn:

  • What are the most important features of Wordpress?
  • What does the directory structure look like in a Wordpress project?
  • How do we configure our own template?
  • How do we use resources available from the panel in our template?

According to statistics, 35% of websites in the visible part of the Internet were built on Wordpress. Every month, the word "wordpress" is searched for around 2.8 billion times. In one of the most popular stores with Wordpress templates, we can choose from more than 11,000 themes.

In my opinion, the strength of Wordpress comes from 4 things:

  • it has a very simple and intuitive admin panel - much simpler than Drupal or Joomla,
  • it is very flexible and easy to extend through hooks, actions, and filters,
  • it has a large number of free and paid plugins that make adding new features easier,
  • users have a very large choice of free and paid templates.

Wordpress also has many disadvantages, but I would not like to discuss them in this article. In fact, you do not need to be a programmer to build your own site on Wordpress. Installing a ready-made template should not be a challenge. Building your own template is a little more demanding. Today I would like to develop this topic a bit.

Directory Structure

When we log in to our server and go to the directory where Wordpress is installed, we will see 3 main subdirectories: wp-admin, wp-includes, and wp-content. The last one contains two more subdirectories: plugins and themes. In plugins we will find all plugins that have been added to our site. Similarly, in themes we will find all templates.

What Goes in the Template Directory?

Every template must have two files: index.php and style.css. The index.php file is the file that will load the view, so this is where we will place the code of our page. The style.css file is the file that will contain the settings of our template. It may also contain styles, because after all it is a CSS file, but this is not required.

Style.css

In the previous paragraph I mentioned that the configuration of our template should be placed in the style.css file. The whole configuration should be placed as a comment at the beginning of the file. Each rule should be written on a new line.

What Can I Change in style.css?

Quite a lot, actually. Starting with the template name, author, or links leading to the template / author page, through description, license, and version, and ending with the key for translating our localization strings and tags. There are quite a few possibilities. An example style.css file could look like this:

css
/*
Theme Name: My template
Theme URI: https://address-of-my-template.pl
Description: Description
Author: Mateusz Jabłoński
Author URI: mateuszjablonski.com
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Version: 1.0.0
Text Domain: 'mj'
Tags: custom-theme, translation-ready, post-formats
Domain Path: /lang
*/

Only the last two entries are not required (Tags, Domain Path). The remaining ones should be filled in.

Pages and Posts

Every Wordpress user has certainly noticed two tabs in the admin menu: Pages and Posts. Posts are blog articles, while Pages are static pages where we can present our offer, a few words about ourselves, or contact details. This distinction helps separate content - the dynamically created content that appears with some regularity, and the content whose content is stable.

In the index.php file, we could distinguish them appropriately by using built-in Wordpress mechanisms, but this would not be the nicest solution. It is much better to add two more files to our template: single.php and page.php. If Wordpress has to load a Page, it will start looking for the page.php file, and only when it does not find it will it load index.php. It is similar with Posts - only then Wordpress will look for the single.php file.

Tags, Categories, Archives, Search Results, Author

Just like with Pages or Posts, Wordpress works with other kinds of content that we can create in the panel. Each resource can have its own file that will be loaded when the user sends a request for specific access.

  • for tags: tag.php
  • for search results: search.php
  • for categories: category.php
  • for archives: archive.php
  • for author page: author.php
  • for the 404 error page: 404.php

Reusable Files

Most of our files will have a similar beginning and ending. Every page has a header and a footer, after all. In addition, every PHP file should have a correct HTML structure, so according to good practices it should contain the head tag. For this purpose, we can prepare two files: header.php and footer.php, which will contain shared code for the header and footer. For these files to work, they need to be called properly. An example PHP file with calls to these files could look like this:

php
<?php get_header(); ?>
/* page content here */
<?php get_footer(); ?>

The comments.php file can also be included among reusable files. It would contain the template for the comments structure.

wphead() and wpfooter()

In addition, there are two functions that our template should have called. Both are responsible for letting Wordpress place additional libraries in our output files, such as jQuery or our CSS and JS files added through functions.php. wp_head should be placed in the header, right before the closing head tag. wp_footer, respectively, should be placed in the footer, right before the closing body tag.

php
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
	<meta charset="<?php bloginfo( 'charset' ); ?>">
	<?php wp_head(); ?>
</head>
<body>
php
<?php wp_footer(); ?>
</body>
</html>

The Brain of Our Template

We have already met the heart and body of our template. The functions.php file is responsible for all the logic that our template will contain. In this file we can connect new CSS and JS files, add new actions and filters, and write functions that we will want to use within our template. The functions.php file is also responsible for enabling appropriate Wordpress features, such as menus, in our template, because not all possibilities are enabled automatically.

Summary

Our template already works and has gained a simple structure. As we can see, preparing your own template in Wordpress is also not very complicated. Of course, some more advanced work will require knowledge of PHP and knowledge of Wordpress implementation details, so I encourage you to read the Wordpress documentation in order to develop your template with many additional interesting features.

Sources

Share this article:

Comments (0)

    No one has posted anything yet, but that means.... you may be the first.

You may be interested in

If this article interested you, check out other materials related to it thematically. Below you will find articles and podcast episodes authored by me, as well as books I recommend that expand on this topic.

Optimizing with Memoization by jarmoluk
Article
2026-06-14

Optimizing with Memoization

Cache is tempting because it sounds like a quick answer to unoptimized code. But remembering the result is only the beginning. You still need to know what the key is, when the result becomes invalid, and whether you might return data to the wrong user. That is what memoization is about.

Read more
another plugin by
Article
2022-09-22

Another Wordpress Plugin

Wordpress as a CMS has many advantages. One of them is the ability to easily extend its functionality by adding new plugins. Today I would like to talk about whether and when it is worth adding another plugin to Wordpress.

Read more

Zapisz się do newslettera

Bądź na bieżąco z nowymi materiałami, ćwiczeniami i ciekawostkami ze świata IT. Dołącz do mnie.