Advertisement
Cheat Sheets

The WordPress Coding Standards: Indentation, Space Usage, and Trailing Spaces

by

The entire purpose of this series to help expose the WordPress Coding Standards, why they matter, and how to write quality WordPress code. In order to do this, we're taking an in-depth look at each section of the WordPress Coding Standards.

So far, we've covered:

  • Naming Conventions and Function Arguments
  • Single Quotes and Double Quotes

Today, we're going to be covering the importance of white space. Specifically, we're going to cover indentation, space usage, and trailing spaces. As easy as it sounds, these are several of the most ignored or misused aspects of the codings standards.


A Word About Whitespace

Before we look at what's going on with the various coding standards, it's important to understand why white space is important not only in WordPress, but in programming languages in general.

Simply put, it's because it enhances readability.

This is why some programming languages are space or tab delimited, this is why some programming languages ask that you space out certain parts of the code such as function parameters, array indexes, and more.

When it comes to WordPress, the conventions are in place not only for readability, but also to provide a consistent reading and development experience for all who work on WordPress themes, plugins, applications, or the core application itself.

Remember: The purpose of coding standards is to make it so that source code looks as if it's written by a single developer as it sets a level of expectations for contributing developers.


Indentation

As far as indentation is concerned, there's nothing particularly new, revolutionary, or different as it relates to WordPress. Generally speaking, you'll indent each time that you start a new block.

This means that:

  • Your functions will be indented within the class
  • Your conditionals and switch/cases and other blocks will be indented within their functions
  • Your loops will be indented within their functions, within their conditionals, and so on

If you're used to writing code in C-style languages, then there's nothing particularly new here, right?

An example of what this may look like is exactly this:

function foo( $arguments ) {

	if ( 0 < count( $arguments ) {

		foreach ( $arguments as $arg => $value ) {
			echo $value;
		}

	}

}

According to the Coding Standards:

Your indentation should always reflect logical structure. Use real tabs and not spaces, as this allows the most flexibility across clients.

The key take aways are that the beginning of lines should begin with tabs, and that the code should reflect a logical structure. Don't overcomplicate or try to oversimplify things.

There's one other nuance to white space within the WordPress Coding Standards: Tabs should be used at the beginning of the line, but spaces should be used everywhere else. For the most part, this is an easy rule to follow; however, in WordPress, you're often going to be creating arrays to pass as arguments.

Ideally, we want each index of the array to line up so that readability is as high as possible but we often have a propensity to use tabs to make it easier to line them up, but this is actually a violation of the coding standards.

$args = array(
	'ID'           => 1,
	'post_title'   => 'The Title',
	'post_content' => 'The content'
);

As such, make sure that you only use tabs at the beginning of each line.


Space Usage

As it relates to WordPress, I've found that spaces have been used much more liberally than in other languages. I'm not saying this simply as an observation, as it was a personal adjustment I needed to make in coming both from .NET and Ruby.

That said, as with most other guidelines in the Codex, there's nothing that's particularly complex; however, there are some important distinctions that need to be remembered when writing code.

Spaces should be placed in the following places:

  • After commas
  • On both sides of logical operators (that is, ||, &&, and !)
  • On both sides of comparison operators (that is, <, >, ==, ===, etc.)
  • On both sides of assignment operators (namely =)
  • On both both sides of the opening and closing parenthesis of functions, conditionals, loops, and so on.
  • When a variable is being passed as an index of an array, but not when a literal value (such as a string or an integer)

Most of these are relatively straight forward, but in my experience I have found that the array rules tend to cause the most confusion among developers, so here's a quick note of what's considered correct and what's not:

// Correct spacing...
$arr[ $x ] = 'foo';
$arr[0]    = 'bar';

// Incorrect spacing...
$arr[$x]  = 'bar';
$arr[ 0 ] = 'bar';

As you can see, it's nothing terribly complicated but it's a relatively easy convention to miss.


Trailing Spaces

This rule is likely the easiest standard to remember of them all. Simply put, there should be no trailing spaces left at the end of any line of code.

Depending on your IDE, you may have this filter built in; other times, you may need to install a plugin that will perform this action for you whenever you save the file. But whatever the case, it's a relatively easy feature to integrate in whatever IDE you're using.

Additionally, most editors - regardless of if it's a glorified text editor or a full on IDE - you should have the ability to enable the display of tabs and spaces.

Viewing Tabs and Whitespace

Viewing Tabs and Whitespace in Coda 2

Again, this is one of the simplest conventions to follow and it's likely that your IDE or editor of choice has this feature or a plugin available that will allow you to automatically do this.

If not, you should be able to activate the ability to see tabs, spaces, carriage returns, and so on so that you can easily identify where the trailing spaces are.


Conclusion

Obviously, white space places a significant role in writing WordPress-based code. In this article, we've explored indentation, tabs, spaces, trailing spaces, and why and how to incorporate them into our projects.

In the next article, we're going to continue talking about the subtleties of the WordPress Coding Standards by looking at brace style, regular expressions, and the nuances of using PHP tags through our WordPress code.

Related Posts
  • Code
    WordPress
    Mastering WordPress Meta Data: Understanding and Using ArraysMetadata
    In the first part of this series, we covered what WordPress meta data is, how it can be retrieved, and the various data types (such as objects or arrays) in which it can be returned. Now it's time to learn about the different types of arrays. When you write an array manually you know what its structure is an what the name of each index is. But when you are building arrays by querying a database, you are going to need to do some detective work to determine the structure of the data returned and the names of the indexes.Read More…
  • Code
    Theme Development
    Making the Perfect WordPress Theme: How to Code WellWp white 400
    In the previous part of this series; we went through various WordPress APIs that we should learn about, talked about the importance of making a theme translatable (or even better, releasing them already translated into other languages) and understood the concept of licensing themes and using licensed products with the themes. In this article, we're going to focus on code: We'll see how to code with WordPress coding standards, how to properly comment our code and how to validate and test the theme.Read More…
  • Code
    Cheat Sheets
    The WordPress Coding Standards: Bringing It All TogetherThe wordpress coding standards
    When it comes to writing a series of blog posts, one of the most challenging aspects as a reader is actually keeping up with every post that is published. Even if you do manage to try and keep up, posts that are in excess of 1,000 words - especially those that include code - can take time that many of us don't have especially when it comes to juggling our work lives, home lives, hobbies, and other things. So in order to make sure that the information presented throughout this series is still presented in a digestible way, I thought I'd experiment with doing a summary of the entire series. That way, for those of you who have missed an article or haven't had the time to sit down and go through each article, can still get the gist of each point mentioned throughout the articles. With that said, let's take a look at everything we covered when reviewing the WordPress Coding Standards.Read More…
  • Code
    Cheat Sheets
    The WordPress Coding Standards: The Ternary Operator and Yoda ConditionsThe wordpress coding standards
    At this point in the series, we've covered a lot of ground. Up to now, we've discussed the following topics: Naming Conventions and Function Arguments The Use of Single Quotes and Double Quotes Indentation, Space Usage, and Trailing Spaces Brace Style, Regular Expressions, and PHP Tags Lots of stuff, right? In this particular article, I thought we'd take it a bit easier before jumping into the final topic. As such, we're going to cover two really simple topics (that are often either ignored or overcomplicated). Specifically, we're going to talk about the ternary operator and we're going to talk about Yoda conditions.Read More…
  • Code
    Cheat Sheets
    The WordPress Coding Standards: Braces, Regular Expressions, and PHP TagsThe wordpress coding standards
    In this series, we've been taking a deep dive into the WordPress Coding Standards in order to get the word out about them, understand them, and begin to practically apply them in our day-to-day work. If you're just joining the series, so far we've covered the following topics: Naming Conventions and Function Arguments Single Quotes and Double Quotes Indentation, Space Usage, and Trailing Spaces In this article, we're going to continue building on top of the content in the previous article: Specifically, we're going to be taking a look at brace style, regular expressions, and nuances of working with PHP tags within the context of building WordPress themes, plugins, and applications.Read More…
  • Code
    Cheat Sheets
    The WordPress Coding Standards: Naming Conventions and Function ArgumentsThe wordpress coding standards
    In this series, we're taking a deep dive into the WordPress Coding Standards - specifically, the PHP coding standards - in order to evangelize and understand how quality WordPress code should be written. Despite the fact that this is documented within the WordPress Developer Handbook, I think there's something to be said for understanding the rationale behind why some things are the way that they are. Remember: Our ultimate goal is to make sure that we're writing code that conforms to the coding standards so that we, along with other developers, are able to more easily read, understand, and maintain code for themes, plugins, and applications built on top of WordPress. In this post, we're going to be taking a look at how to handle naming conventions and function arguments.Read More…