Tutorial

Under the Hood with WordPress, Part 1: Knowledge is Power

This is Part 1 of a 6-part series on diving “under the hood” with WordPress.  Other posts in this series:

There’s no doubt about it: WordPress is a powerful CMS.  Whether you’re wanting to run a world famous restaurant site, the next big craft blog, or a membership site to inspire millions… WordPress can handle it.  But, it’s not something that just “works” out of the box – to truly make a WordPress site your own, you have options to set, plugins to install, and tweaks to the template to make.  And the idea of tinkering under the hood with a WordPress site – any website, in fact – is intimidating to non-technical users.

I’m not saying that every WordPress user needs to be a full-blown web developer.  On the contrary, actually – there are so many other things that a person has to do during a daily basis that it’s impossible to expect someone to do it all.  But being able to do it all, and being able to understand it in the least, is what separates a good website administrator with a great one.

Over this week, we’re going to explore the fundamental building blocks to a successful WordPress site.  This isn’t options or settings; this is the code that runs, displays, and formats the data you see on the screen.

The key to understanding another language is immersion – the more you immerse yourself in a culture, the faster you pick up on their language (and the nuances that go along with it).  By immersing ourselves in the WordPress code with real examples we can understand what’s going on under the hood – and the special nuances that make WordPress exactly what it is today.

Under The Hood: The 4 Fundamental WordPress “Languages”

HTML

HTML (HyperText Markup Language) tags are the building blocks of the web.  Even if other languages are used to process the data, it’s rendered in some form of HTML.  HTML takes the content you write and sorts it into its fundamental types – headlines, paragraphs, lists, images, and anything else you can think of.

CSS

CSS (Cascading Style Sheets) take the HTML tags and format them into the beautiful designs we see on the web.  Most browsers have CSS built in to help with basic rendering, but we can take it a step further by modifying layout, color, size, and orientation of the various elements.

PHP

PHP (PHP: Hypertext Preprocessor – yes, it’s recursive) does the computations and database searching of all the various options, content, and posts in WordPress.  Aside from using standard functions, WordPress utilizes a series of custom functions to display posts, add content, organize widgets, and more!  PHP is what separates WordPress from a standard HTML site.

jQuery / JavaScript

There are certain things that a site can only do post-processing – after the HTML, CSS, and PHP has processed, rendered, and displayed.  That’s where JavaScript comes in.  WordPress utilizes jQuery – a JavaScript framework – to do a lot of heavy lifting both in the back-end and on the front-end of many popular themes.  Think of jQuery as the icing on the WordPress cake – it would still be WordPress without it, but jQuery’s modifications make WordPress better and more usable.