The Easiest Way to Debug PHP in WordPress

Last Updated May 3, 2017

Recently, I was working on some custom code within WordPress. I was trying to do a little bit of testing and troubleshooting to determine what values were available to me within the objects WordPress was returning.

<?php var_dump($some_variable); ?>

The PHP function var_dump() is great for dumping out whatever value is being stored in your variable. The only problem is it makes your page look UGLY and the formatting isn’t always easy to read.

I wanted a more elegant solution. Something like JavaScripts console.log() where I could pull up the Chrome Developer console panel. Out of the way. Not disruptive.

I remembered back a long time ago, when I used Firefox for developing, there was a Firebug extension called FirePHP that did exactly what I had in mind.

NOTE:

If you just Googled Firebug or visited ☝️ those links, you probably noticed that Firebug is no longer in development. RIP. You were good to me.

Anyway, I did a little digging, found exactly what I was looking for and it’s quite an elegant solution.

There’s a Chrome extension called PHP Console that allows you log errors from your code directly into the Chrome console panel.

First, you’ll need to download the PHP Console Chrome extension.

If you’re working in WordPress, like I am, download and install WP PHP Console plugin.

Once you’ve activated it, go to Settings > WP PHP Console. There are a few options available:

First, you’ll need to enter a password. I’ll show you where, but this password gets entered into the Chrome extension. — This is a nice little piece of security, that prevents Joe Random from viewing your output.

Password for PHP Console

I checked Register PC Class. This makes it a little easier within your code to write to the console.

PHP Console - Register PC Class

I also checked Show Call Stack and Short Path Names. — They seemed like smart choices.

PHP Console - Show Call Stack and Short Path Names

Now, let’s test something. Within your PHP code, use

PCdebug($item);

Where $item is the name of the variable you want to look at.

Flip over to Chrome.

Click on the extension icon in the toolbar.

PHP Console Authorization

Enter the password that you used in the WordPress panel.

You’ll notice the icon now appears active within your toolbar. You can also expand the extension’s settings in Chrome to control your preferences and what notifications and debug errors are displayed.

Active PHP Console

Now, open your console and refresh your browser, you’ll see the data come through.

PC Debug in the Chrome Console

You can expand the arrow to see more details.

PC Console - PC Debug Objects

Since I was dealing with an Object filled with more Objects and lots of value / key pairs, this tool proved invaluable.


The Conversation