Like most web designers, I didn’t go through school education to learn how to use WordPress. The process of learning went through reading books, trying tutorials, studying great designers themes, and finally checking some images, charts and infographics that visually gave me a better understanding of WordPress. Following are some infographics that will give you a better understanding of WordPress. We also suggest checking out the experts at at WPMUDEV.

1. WordPress database structure

Source and bigger image

Whether you create WordPress themes, edit thems, or create plugins, you may need to communicate with the database and find the information you need. This diagramm helps you to make sense of it much quicker by showing the structure and relations between the tables.


2. WP_Query vs query_posts() vs get_posts()

Source and bigger image

Despite the use of Comic Sans, this flowchart is very helpful to decide how to call for posts within or out of the WordPress loop.

Edit: according to a comment by Evert, this chart shouldn’t have been included. It’s is true that query_posts() shouldn’t be used anymore, but WP_Query can still be used. Check this discussion on Stack Exchange for more info. To make it short: Use pre_get_posts to alter your main query. Use a separate WP_Query object (method 2) for secondary loops in the template pages.

3. Basic WordPress theme anatomy

Source and bigger image

A visual dedicated to explain the basic anatomy of a WordPress theme to beginners.

4. The anatomy of a WordPress theme

Source and bigger image

Created by famous WordPress consultant Yoast, this infography goes deeper in explaining the anatomy of a WordPress theme.

5. WordPress template hierarchy

Source and bigger image

Having a good understanding of WordPress’ template hierarchy can help you save a good amount of time, at least this chart did this for me. I chose the version created by WPtuts+ because it seemed more appealing visually to me, but the WordPress Codex contains a more detailed and up-to-date version of this chart.

6. The WordPress loop

Source and bigger image

If you are not a coder, the loop can be one of the trickiest things to get around in WordPress. This chart helps you to understand how the loop works.

About the Author

author photo

Mirko Humbert

Mirko Humbert is the editor-in-chief and main author of Designer Daily and Typography Daily. He is also a graphic designer and the founder of WP Expert.