Theme

Home » Theme

A WordPress theme is what defines the appearance and layout of your WordPress website. All themes are different but generally consist of template files, stylesheets and media.

You can add, remove and manage themes in the WordPress admin appearance area. There are also options in the appearance menu to customize your installed theme in the theme customizer as well as making modifications in the theme editor.

There are thousands of free and paid WordPress themes available at wordpress.org and other premium themes available at places like ThemeForest and Elegant Themes. We also have our own theme called Trisense.

Themes come in different design layouts with varying features. Anyone with the technical know-how can make a WordPress theme with varying features and complexities.

When you are choosing your theme, you can filter down your options by selecting a theme that has specific features. If you can not find the theme that suits all of your needs then you can extend your websites features with plugins.

Themes are designed to serve certain purposes or niches. For example, a wedding WordPress theme is designed for people in the wedding industry or wedding invites.

Themes can be modified in three ways. You can:

  • Install a plugin that has the features you need.
  • Add the code to the themes functions.php in you child theme.
  • Modify the themes template files by moving them to the child theme.

Common WordPress theme files

Themes includes a mix of files that make up the theme. These files include .php template themes, CSS stylesheets and media files like images or font files.

All WordPress themes require a style.css stylesheet. WordPress reads the very top part of style.css which has information about the theme in it. Some of the information includes the:

  • Theme name. Each theme has a name to help differentiate it from others.
  • Theme author. The name of the person/company who made the theme.
  • Theme URI. The website where the theme is distributed from.
  • Author URI. The website where the theme author is from.
  • Description. A brief description describing what the theme is about.
  • Version. Themes get updated and when they do, the version of the theme gets increased.
  • License. Themes are distributed through different copyright licenses that help protect their rights.
  • Text Domain. When WordPress is translated into other languages, it uses this snippet of text to help translate it.

The theme structure is generated through theme template files. WordPress uses a template hierarchy that determines what gets displayed on what pages.

header.php is an optional template file that gets added at the top of your site. It usually houses all of your meta tags and stylesheets. It is also common in many themes to put the beginning part or the header of a theme in the header but is not always the case.

footer.php is an optional template file that gets added at the very bottom of your site. it usually houses all of your JavaScript files. It is also common in many themes to put the bottom part of your site or the footer of your theme in footer.php but is not always the case.

index.php is the most generic template file and is inherited by all post types if there is not a more appropriate template file to use.

functions.php is the file where you can put all of your code functions in. If there are modifications you want to make in your theme then you can put the functions in this file to make the modifications.

Default Theme

When you install WordPress, it will automatically come with a default theme installed for you. WordPress needs that theme installed and activated to display your site. You can add your own theme at any time after WordPress is installed.

The default themes main purpose is to showcase the features of WordPress. It is often used as a starting point for users to edit and ensure their themes are following the latest standards.

Default themes are also there to ensure there is a fallback available in case something happens to your selected theme, WordPress will be able to continue displaying your websites content using the default theme.

If you have installed your website later than 2010 then you will likely have seen the “Twenty” series of default themes. Each year, WordPress has come out with a new theme and called it TwentyTen, TwentyEleven, TwentyTwelve etc. after the year it was released since 2010. Each year, there is a new theme released for that year.

Before 2010, Matt Mullenweg created the first default theme in 2003. You could not change this theme and there was very little customizations available. Gradually after each release, WordPress themes became more and more customizable.

The WordPress Classic theme was added to WordPress version 1.2 but it wasn’t until WordPress version 1.5 when the Kubrick theme was released that the ability to switch themes became available to users. Kubrick remained the default theme until it was replaced by TwentyTen in 2010 on WordPress version 3.0.

Parent Themes and Child Themes

Parent themes are simply WordPress themes that have been declared the ancestor or inherited theme of a another theme called a child theme. Parent themes are used by designers and developers to take advantage of a theme whilst being able to make modifications.

The parent theme can be used on its own as a normal theme or it can be used in parent form where it will pass all of its functionality, features and styles to the child theme. Sure you can make modifications to a parent theme but when an update comes through, the modification will get overwritten that is why parent themes are kept untouched from modifications and are updated without causing any issues to your site.

Parent themes usually have a number of hooks and filters that enable it to be easily modified in a child theme.

A child theme is a sub theme that inherits everything from its parent theme. It will use the same functionality, media, features and styles of its parent theme but allows you to create variations or modifications to your parent theme without changing any of your parent themes files.

Child themes are considered the proper way to make changes to your parent theme as the changes you make in your child theme are untouched when your parent theme is updated. If you were to make the changes to the parent theme and then you updated the parent theme, none of the changes would be preserved. That is why it is important to install a child theme if you are wanting to make any modification to your theme that is not given to you by default.

Child themes allow you to override the functionality and styling of your parents theme.

Creating a child theme
To create a child theme, you need to create a folder next to your parent themes folder with any name you want to give your child theme.

The only required file in your new child theme is a style.css file. The style.css file needs to contain certain information at the top of this file to be correctly setup as a valid child theme.

The information that you should include in the head of your child themes style.css file includes the following:

/*!
Theme Name: My Child Theme Name
Theme URI: https://example.com/my-theme
Description: A brief description about this child theme and possibly how it links to the parent theme
Author: My Name Here
Author URI: https://example.com
Template: parent-theme-folder-name
Version: 1.0
*/

An example of the Trisense themes child themes style.css header is:

/*!
Theme Name: Trisense Child
Theme URI: https://trisense.web3.com.au
Description: Customisations to Trisense parent theme
Author: Web3 Brisbane Web Design
Author URI: https://web3.com.au
Template: trisense
Version: 3.0
*/

Child themes add their stylesheet after the parent themes stylesheet. This means that anything that you add to the child theme will be able to overwrite any of the style changes that the parent theme applies.

Once you have created your style.css with the appropriate header details, you can then activate it as a new theme on the Appearance > Themes page.

To overwrite any of the parent themes templates, you can either apply any hooks or filters in a new functions.php file that you can create in your child themes folder. You can also overwrite template files by copying the template file to the child theme.

Example: You can copy the header.php file from the parent themes folder to the child theme. Any changes you make in the child theme will reflect instead of the same file in the parent theme. Be careful with copying template files to child themes. If you have a parent theme that gets changed often, you will want to make sure you are careful with the files you move to your child theme. You may find that there are child theme file incompatibility issues with files that are not updated along with the parent theme file updates. This can lead to broken themes if you are not careful.

It is always recommended that you create a backup before you update your theme so you can restore it if needed.

Posted on