Intro to WordPress Theme Development

Intro to WordPress Theme Development

 

What is a WordPress theme?

A WordPress theme is how your website is displayed to users. It is the front-facing view of your WordPress site, and can be customized infinitely depending on your use case. For comparison, think of a wordpress theme as the HTML/CSS structure you are used to developing for a standard HTML website. The key difference is the way WordPress structures these files.

 

WordPress Theme Structure

WordPress Themes live in subdirectories of the WordPress themes directory (wp-content/themes/ by default) which cannot be directly moved using the wp-config.php file. The Theme's subdirectory holds all of the Theme's stylesheet files, template files, and optional functions file (functions.php), JavaScript files, and images. For example, a Theme named "test" would reside in the directory wp-content/themes/test/. Avoid using numbers for the theme name, as this prevents it from being displayed in the available themes list.

 

Here’s an infographic that explains the basic structure: https://yoast.com/wordpress-theme-anatomy/

 

Source: https://codex.wordpress.org/Theme_Development#Anatomy_of_a_Theme

 

 

Key Differences Between an HTML site vs a WordPress theme

Now that you have a basic understanding of how WordPress themes are organized, you can get a clear insight into how WP themes are different from HTML sites. The separation of sections into different files(header.php, index.php, footer.php) allows for dynamic scripting and styling, and it gives you more control over how elements are styled and rendered. Your style.css is still the only CSS file and allows you to theme the entirety of the site. For WP theme development, it is best to think in these structured segments. For example, you would look at an HTML page you are trying to convert to a WP theme and identify each one of these segments. Then it’s simply a matter of translating certain dynamic elements into the syntax WordPress likes.

 

At the end of the day you’re still seeing the same thing as the HTML page, but you are building it in a very different way. This is the learning curve for WP theme development, and as soon as you have a firm grasp on how the theme is built you will be able to develop at incredible speed.

 

Why does this matter?

By now you’ve probably started to realize that HTML websites are pretty easy and could be sold easily as well. Now that you have a basic understanding of how simple it is to translate HTML themes to WordPress themes, you can also realize the value in creating these themes. Approximately 29% of the internet (~290 million+ sites) uses WordPress, and in the CMS market WordPress has a ~60% market share. If you are able to make WordPress themes, there’s plenty of people out there willing to pay you for them. Once you have a firm grasp on WordPress, you become an instantly more valuable member to a team. This course aims to make you as valuable as possible to a future employer.