Install WordPress Coding Standards on PHPStorm easily

WordPress, as all development frameworks, has its own rules to follow so that each developer can easily read and understand a colleague’s code.

This is what we call “Coding Standards”. For WordPress, we have the WordPress Coding Standards better known as WPCS!

These developments rules can be read here: Discover the WordPress Coding StandardsOK, we’ve got a thousand pages of docs… but I’m not gonna read all those docs while developing… couldn’t you make it easier?

Well you’re lucky because we can integrate these rules directly into our IDEs or text editors! So your code will be automatically checked during your development.

I use PHPStorm from Jetbrains every day but you should know that these rules can be used on almost any code editor.

Where do I find the WPCS?

WPCS are available on Github. I will detail how I do it but there are several methods. Take your pick!

Séb method for installing WPCS

So it’s not really my method… in the sense that it’s not me who developed it… but it’s the one I’m using and that I’m going to detail!

Before installing WPCS, you need to install PHPCS… and yes, WordPress is developed in PHP and to make it simple, WPCS adds rules or modify a little the rules of the PHP Codings Standards.

Keep in mind that, as in all the WordPress ecosystem, the goal is to make development accessible and easy.

Install PHPCS

Personally, I have a partition on my Ubuntu Linux dedicated to my projects and next to the projects, I have a folder with the WPCS and one with the PHPCS.

PHPCS are also available on Github

Clone PHPCS Github repo

Go to the place where you want to download the rules then:

or

if you haven’t entered an SSH key in your GitHub account.

You should now have a folder named phpcs.

Clone WPCS Github repo

We’ll do almost the same command to clone the WPCS repository this time:

or

I reassure you, the hardest part is over…

Setting PHPStorm

Go to “File | Settings | Languages & Frameworks | PHP | Quality Tools”.

Programme d'ordinateur
PHPStorm settings

By clicking on the 3 points to the right of Configuration you can specify the path to the PHPCS. It will be necessary to navigate and select the file “phpcs” present in the directory “phpcs/bin” obtained thanks to the preceding cloning.

Capture d'écran

If everything is OK, at the bottom of the window will show the version of Code Sniffer installed.

Let’s move on to WPCS, because after all… they’re the reason we’re here!

The path to the settings is File | Settings | Editor | Inspections

Logiciel
I love arrows!

the goal here is to get to the “PHP Code Sniffer Validation” menu in order to check “Installed Standard Paths” and to search after clicking on the folder on the right for the directory to be cloned with WPCS.

If all goes well… by clicking on the 2 circular arrows, you should have the choice of several WPCS… personally, I choose WordPress-Extra. then we validate by clicking OK…

Develop your WordPress Project using Lando

I already told you about Lando a while ago… it was more of a cry from the heart to have found a simple solution to use Docker technology.

What’s Lando?

As I explained in my previous article, Lando is an overlay that makes it easy to use Docker Technology.

To put it simply, you have to see Docker as a modular tool where each brick is the component of your web server.
So you will need for example, to run a WordPress locally an Apache brick, a PHP brick and a Mariadb or Mysql brick.
Among these different bricks, there are different versions. For example PHP7.0 / PHP7.3 .

To develop soundly and avoid unpleasant surprises during production, it can be interesting to use during our developments the same software versions as those used by the server that will host the website in the end. In this way we reduce the risks of conflicts and errors.

Docker’s goal is to provide these different bricks and make them work together… except that…

Except that, as I said in my previous article, you have to set all this up… and have sysadmin knowledge that we don’t all have… fortunately Lando has arrived…

Install Lando

The hardest part of installing Lando is actually installing Docker which is quite simple if you are free like me, i.e. on a Linux distribution. It’s a bit more complicated if you’re trapped in a private system such as Windows or Mac OS. (For once we have something simpler under Ubuntu Linux… )

In short, Docker runs natively under Linux, you’ll have to add a virtual machine to install Docker on Windows or Mac OS.

Once Docker is installed, go to Lando’s website to install the overlay that will set all this to music.

Configuring Lando

I told you earlier that Lando was ignoring the complexity of Docker’s parameterization.

All the configuration of your development server will fit in a text file.

Let’s imagine that we want to create a WordPress site with the url https://mon-super-site.lndo.site.

Just create a folder on your machine where you have the write access and that you would name with the name you want: my-super-site.

In this folder we will add a .lando.yml file that will contain all the configuration of the server of our site:

That’s it, that’s all! Lando is ready to go! And you’re ready to develop!

Let’s decorate the .lando.yml:

  • Line 1: A name for your development environment. This name will be used to build the url of your project.
  • Line 2: “Recipe” means recipe in English. Lando has developed preconfigurations according to what you will do with it. Here is a WordPress recipe, it will install wp-cli. There are some for Pantheon, Drupal and more => Lando Recipe
  • Line 3: a config block where you can specify your software versions
  • Line 7: a Service block where we will list the services we want to see working. here PhpMyadmin and Mailhog
  • Line 16: Composing is still practical when working in the PHP world.
  • Line 19: This block is optional if you are working on a simple domain. It can be very useful when working on a Multisite WordPress subdomain for example.
  • Line 22: maybe the nicest part… do some tasks just after importing a database… here we do via wp-cli a search & replace to adapt the urls and we disable the excellent WordPress WP-Rocket extension because the cache in dev… how to say 😉

This .lando.yml is quite simple and there is a multitude of other configurations and possibilities to best fit your needs.

Note that Lando is oriented for development and is strongly discouraged by its developers for a production

To run Lando for the first time, you have to do a `lando rebuild –y’.

At this point, it will create and download what it needs. This step can be long depending on your web connection but it will only be done once…

Then for the next launches a `lando start` in your terminal in your working directory will be enough.

Attention the WordPress recipe prepares lando technically to receive WordPress but does not install WordPress. You will perform this installation step as you are used to or by using my wp-cli method.

I use Local By Flywheel… it’s the same thing!

Hummm each solution has its advantages and disadvantages. When I decided to test and finally adopt Lando, Local By Flywheel was not available under Linux. This is no longer the case since the summer of 2019.

I (too) quickly tested Local By Flywheel and I couldn’t get a WP to work :-/ (note it too much).

The only thing Flywheel brings for my case is a GUI (Graphical User Interface) whereas Lando… it’s command-line… but sincerely to make lando start or `lando rebuild –y`? install an interface that will necessarily use machine resources… I didn’t see the point.