WordPress Theme Cheat Sheet for Beginners
Are you looking for a WordPress theme cheat sheet to quickly modify your theme or create a new custom theme? WordPress comes with many built-in template tags that you can use to get a head start. In this article, we will share a WordPress theme cheat sheet for beginners.
Before Getting Started
WordPress comes with a powerful templating engine that allows theme developers to create beautiful designs for WordPress powered websites. There are both premium and free WordPress themes that you can install on your website.
Each WordPress theme comes with a number of customization options. These options allow you to change colors, add header images, setup navigation menus, and more.
However, you are still limited to what features your theme supports. Sometimes you may want to make slight changes to your WordPress theme that require some coding. To do that, you will need to know some basic PHP, HTML, and CSS.
First thing you would want to do is to familiarize yourself with how WordPress works behind the scenes and WordPress theme templates.
After that there are some best practices you may want to follow. For example, creating a child theme instead of making your changes directly into your theme files.
You can also practice on your theme by installing WordPress on your computer.
Basic WordPress Theme Templates
Each WordPress theme is made up of different files called templates. All WordPress theme must have a stylesheet and an index file, but usually they come up with a lot of other files.
Below is the list of basic files that every theme has:
If you are building your own theme, then you can start with one of the WordPress starter themes. These themes come with ready to use WordPress template files and CSS that gives you a framework to build upon.
Template Tags in Header
WordPress comes with a lot of handy functions that can be used to output different things throughout your theme. These functions are called template tags.
First and probably the most important function that is required in all standard compliant WordPress themes is called wp_head, and it looks like this:
This code fetches all the important HTML WordPress needs to add in the
<head> section of every page on your website. It is also essential for many WordPress plugins to work properly on your website.
Following is a list of template tags that you will commonly find and use in your theme’s header.php file. However, they can also be used elsewhere on your theme when you need them.
Template Tags Used in Other Theme Files
Now let’s take a look at some other commonly used template tags and what they do.
Following template tags are used to call and include other templates. For example, your theme’s index.php file will use them to include header, footer, content, comments, and sidebar templates.
Following template tags are used inside the WordPress loop to display content, excerpt, and meta data from your posts.
WordPress themes come with widget-ready areas called Sidebars. These are locations in your theme files where users can drag and drop WordPress widgets. Often a theme has multiple locations where users can add widgets.
However, most commonly these widget areas are located in the right or left sidebar of the theme layout. To learn more, see our guide on how to add dynamic widget ready sidebars in your WordPress theme.
Here is the code used to display a sidebar in your theme.
You will need to replace sidebar-1 with the name defined by your theme for that particular widget-ready area or the sidebar.
Template Tags to Display Navigation Menus
WordPress comes with a powerful menu management system that allows users to create navigation menus for their website. A WordPress theme can have more than one navigation menu location.
See our guide on how to create your own custom navigation menus in a WordPress theme.
Following is the code that will be used in your theme to display a navigation menu.
Theme location depends on the name your theme used to register the navigation menu. The CSS container class can be called anything that you like. It will surround your navigation menu, so that you can style it accordingly.
Miscellaneous Template Tags
Following are some of the tags that you’ll commonly use throughout your WordPress theme.
Conditional Tags in WordPress Themes
Conditional tags are functions that return results in True or False. These conditional tags can be used throughout your theme or plugin to see if certain conditions are met and then do something accordingly.
For example, if the current post has a featured image or not. If it doesn’t have a featured image, then you can show a default featured image instead.
Following are a few more conditional tags that you can use.
There are many more conditional tags that you can use. The full list of conditional tags can be found in the WordPress codex page about conditional tags.
The WordPress Loop
The Loop or the WordPress loop is the code used to fetch and display posts in WordPress. Many WordPress template tags may only work inside the loop as they are associated with the post or post_type objects.
Following is an example of a simple WordPress loop.
To learn more about the loop check out What is a Loop in WordPress (Infographic).
That being said, let’s dive into our WordPress theme cheat sheet for beginners.
Source: WP Beginner