The Anatomy of a WordPress Theme–Cheat Sheet

As a WordPress user and a designer, I can’t seem to leave a theme alone. I have to add my personal touch. This could be simple as adding custom web fonts or just changing the width of the content columns. Whatever changes you want to make to the design of your theme, you need to know what your theme looks in its code form and what files are used to create your theme. Once you know these things, you can  find the exact location in the code where you need to make those changes and then you can make them.

For the most part, WordPress themes use the same files (file names and structure). These files files control very specific parts of your theme. These parts of the web site are common (static) parts of the site, such as; the header, sidebar, and footer files. With these files, you can customize (hack) them to look different or do something that wasn’t originally part of the theme. There isn’t much you can’t do, all you need is to know how to do it or have a someone who knows how do it for you.

Currently,  if I need to figure out a certain feature of a site or I need to know what the designer of one my themes named an element of the theme, I would use Firebug to break down the code and tell me what each part  is and how it was coded. But earlier today, I came across a great cheat sheet by Yoast, that breaks down a WordPress theme by element (header, sidebars, content, footers and several other parts.)

This cheat sheet is great, it breaks down a theme and each part and explained what it does and why. Once you look at the cheat sheet, you should be able figure out where something is and then look for that file on your web server or WordPress editor. Of course, knowing where these things are doesn’t mean you will be able to make those changes you want. Before you make those changes, be sure to back up your files and you have some knowledge of coding and web design before making any changes.

Anatomy of a WordPress Theme

Anatomy of a WordPress Theme

Click on the image to see the complete Cheat Sheet. Also, check out the article as well, they go into more detail about what each part of the theme does.

 

 

About James

James spends most of his free time using social media and loves to teach others about design, web development, CSS, SEO, and social media. He is addicted to Wordpress, social media, and technology. You can reach him his personal website, Evolutionary Designs Blog, Do not forget to follow him on Twitter @element321

Speak Your Mind

*