13 January 2013
Comments: 1

How it Works? WordPress Infographic

Have you wondered before if you will ever have WordPress themes all figured out? Or do you keep discovering new WordPress theme stuff that you have not seen before? That’s actually pretty common thoughts.

You see, with over 57 million WordPress sites around the world, this content management system (CMS) has one of the most number of themes available. And with the advancement of technology, there are constantly new tools being developed.

But the basic remains the same. Once you manage to grasp the basic, theme customization and control will become easier.

WordPress infographic
Click on the above infographic for a full size and full resolution view!

So for all those blog novices who are still trying to find their way around WordPress, here’s a cheat sheet on how your blog works. I have even designed an infographic to better illustrate the workings of WordPress.

WordPress Themes Infographic

The first thing you should know is that a theme is like a folder. This folder is called a directory. In this directory are, among others, templates files which define different sections of your blog or website.

Some parts of your website are dynamic while others are static. Static sections include the header, sidebar and footer. Here’s a brief explanation of the few key sections of a WordPress theme.

  • The Header

    The header PHP template is placed above the main content area. Here lies your blog title or website name, your logo, background image and main navigation menu. The header gives your readers the first impression of your blog or website. Determine your target audiences and then customize your header to attract these groups.

  • The Loop

    The content is by far, the most important section of your WordPress theme. And it’s control by what’s called “The Loop“. In simple terms, The Loop refers to codes that will retrieve and display the content of your posts or pages on your blog or website. On the homepage, this usually displays a list of your posts’ excerpts, while in an individual post or page, it displays the full post or page content – including all the images and videos if available.

    If you would like to change your post’s layout or content, then you should usually look in this section. Remember to always make a back up first!

  • The Sidebar

    This is another PHP file and this time, it controls the codes for that narrow and vertical column by the right or left or both sides of your blog or website. Sidebar contents can be easily customized to fit your requirements.

    You can also customize your sidebar within WordPress Dashboard itself, without touching the PHP codes. You can do so by adding or removing widgets (such as latest comments, post archives, categories, Facebook fans, recent posts, rss feeds and etc, depending on your theme and what plugins you have installed).

    Get hold of your widgets by navigating to the following in your WordPress Dashboard:
    Dashboard > Appearance > Widgets

  • The Footer

    This section of the theme can have a variety of information. The “traditional” footer contains closing information like privacy or copyright statement and some important links.

    Recently, more websites have begun to jazz up their footer with more content-like information, which is absolutely fine. WordPress is flexible enough for that. These content-like information are such as recent posts, selected pages, categories, tags, Facebok likes and other widgets as you wish.

  • Extras

    Besides the above, there are plenty of other files that you can edit and apply onto your blog or website. Take for example, functions.php. It allows you to have your own unique PHP codes which you can then use to customize your theme’s core elements.

    Meanwhile, comments.php controls the way your comments section in both your posts and pages looks like as well as how it functions.

    The styles.css is your main style sheet for your theme. Learn how to use these controls and you will be able to control the style and layout of your website or blog.

    Plugins are third party developed applications that you can rely upon to help you perform certain functions. These functions are generally not found in the core WordPress installation. There are tons of plugins available on the Internet, both free and premium. Some examples of plugins are galleries and anti-spams filter.

    Last but definitely not least are the widgets. These little modules that stay at your sidebars may look small but they do pack a punch. They are somewhat similar to plugins but generally, do not require changes to your codes. Examples include ads managers and a search bar.

Final Notes

So you see, WordPress is not complicated at all. All you need is a basic understanding of what each file controls and you have more or less be able to customize your blog or website in any way you wish. I hope that the above WordPress infographic can help you to better understand the workings of WordPress, and in particular a WordPress theme.

If you have a blog, you can re-post this infographic so that your readers can benefit from it too!

Of course, there are many other things that you need to know but the information presented in the infographic are the foundation which you should be familiar with before you embark on your website’s theme development and customization journey. One last advice – remember to make a backup before making any changes and to debug once everything’s completed.

One response on “How it Works? WordPress Infographic

  1. hamayon says:

    Really informative infographic Alicia, it contains all the “definitions about all the parts of the WP theme”.