WordPress Theme

A WordPress Theme is a collection of files that work together to determine the look and features of your blog or website.

A WordPress theme is made up of a number of different files, and they all contain a separate section of the page; the header will contain the title and navigation, then the index will contain the main content area.

Every WordPress theme has its own folder, which you may find in the wp-content/themes folder of your WordPress installation.

The bare minimum that every WordPress theme needs is an index.php and style.css file. The index.php file determines the way the home page looks like, by the so-called WordPress loop. There are also other possibilities for the home page, which we’ll see in a minute. The style.css file contains all the styling or calls for other CSS files. It also contains the name and author of the theme.

WordPress Theme Files

WordPress theme is broken up into small pieces in the theme folder which are assembled by the programming included in WordPress.

The list of the basic theme files used by WordPress themes are listed below:

index.php

The index.php file is the skeleton of the website. The index.php file for a template contains a mixture of code that will be delivered as it is, and PHP code, which will be modified before it is delivered.

From index.php, lots of different PHP files can be called. Here are a couple of the most common ones, including their meaning:

• Header.php
• Sidebar.php
• Footer.php
• Home.php
• Front-page.php
• single.php
• Page.php
• Functions.php

header.php

This contains the logic for the header of your theme, which mostly contains things such as the logo, website name, search bar, and menu. It also contains the necessary HTML head code.

In the header.php you will find the top coding for each page and post of your blog. It is inserted into each page and post on your blog through programming.

Some basic things included in your header.php file are:

• The DOCTYPE declaration for the pages/posts. This tells the browser what coding standard the theme is following.
• The character set used by the blog is fetched from the administration side of your blog and inserted via programming into the head section of your pages.
• The title set of tags for each page/post on the site are inserted based on the title you give your post/page when you create it via programming as the page is compiled before presenting to the visitor.
• You will find the path to your CSS (Cascading Stylesheet) file is also created dynamically in the header.php.

The above items plus some other lines of coding are inserted between the opening and closing head tags. ( ) Information between these tags are not visible to the visitor but is used by the browser and search engines to get information about your pages.

Also in the header.php, you will find the beginning of the coding that actually creates the visual part of your pages and posts.

• The opening tag for the body of the pages/posts. ()
• The opening tag for the container which holds the contents of the pages/posts. Usually called wrapper. e.g.
• The head section of the pages/posts. This container could include the coding for your top horizontal
• Opening tag for the container that wraps around the actual content of the individual pages/posts.

All these id names will become important to you later if you want to customize the CSS file for the theme to suit your own personal taste.

sidebar.php

This contains the definition of a sidebar, that is used to display widgets. More complex themes often give the possibility to use multiple sidebars with different content.

footer.php

This contains some closing tags for the theme. Besides that, it has become quite common to define additional widget areas in the footer as well.

home.php

This file can be used to show the latest blog posts on the landing page for your blog. Often, this is the home page of your website, but it doesn’t have to be. If WordPress is set up to use a static page as the home page, then home.php could be used for your blog.

front-page.php

If this file exists, it will be used for the home page of the website. If it doesn’t exist, WordPress will look for the home.php. If both of them don’t exist, index.php will be used.

single.php

This is used to display a single post type—often, a single blog item.

page.php

This is used to display a single WordPress page.

functions.php

This is an important one because, here, you’ll define all kinds of different functions for your theme, for instance, the widget positions, theme support for post thumbnails, and so on. Also, when creating WooCommerce themes, functions.php plays an important role. Using functions.php, you are able to add features and functions to your website. Note that for larger changes, creating a plugin is a better option though.

404.php

A 404 page is an error page presented when someone follows a broken link to your blog or types the URL to a post or page on your blog incorrectly. The 404.php template is used when a page or post is not found on your blog.

archive.php

The archive.php template is used for your blog archives. It lists all the posts (articles) you have in chronological order based on month, day or year. You may have noticed some blogs have yearly archive pages listed in their sidebar

author.php

On a blog where you have multiple authors writing articles, you may decide to show an about page for each author. The author.php template is used for this purpose..

category.php

Categories are for organizing your articles into logical groups to make it easier for visitors to get to a specific topic they wish to read about. The category.php template is used to present the list of articles in a specific category.

comments.php

The comments.php is part of your post page. It inserts the boxes for people to fill in when they wish to leave a comment on your article.

tag.php

The tag template. Used when a tag is queried.

taxonomy.php

The term template. Used when a term in a custom taxonomy is queried.

date.php

The date/time template. Used when a date or time is queried. Year, month, day, hour, minute, second.

attachment.php

Attachment template. Used when viewing a single attachment

WordPress Theme Hierarchy

WordPress uses a hierarchy system to decide which of the theme files to use when presenting a page or post to your visitors. If a specific template is not found for the page/post it defaults to the index.php template.

Home Page

Looks for a template named home.php first.

Post

A post (article) uses the single.php file.

Page

First WordPress looks for a template with the specific page name. If not found it uses the page.php template.

Category

A specific category can have its own template. WordPress looks for a template with its id attached to the name.

In instances where a specific category template is not available, WordPress will use the categpry.php template. If there is no category.php it will use the archive.php file.

Building E-Commerce Solutions with WooCommerce

This book has been written for everyone who wants to learn how to expand an existing WordPress website with e-commerce functions using the WooCommerce plugin.

Download Free eBook