Maintaining Compatibility With Pre WP 3.8 wp-admin

The biggest, visible to end user change in WordPress 3.8 was the wp-admin panel redesign. One can argue if this change is for better or worse, but from plugin developer perspective the only thing that matters is we need to target new admin design now. If i remember correctly there was even announcement sent to plugin developers to check and update (if needed) plugins in WordPress repository.

But, what about people who cannot or won’t update to WP 3.8? I think, if you are serious about your plugin you should at least for a couple of months make sure that your plugin is working properly in old wp-admin panel and this article will help you do this.

How to test plugin compatibility?

Once you have your site compatible with new WP admin panel, it is time to check it against the old one, however instead of installing separate outdated WP copy, most of the time it will be more convenient to install wp-admin classic plugin. As you probably figured out this plugin will allow you to switch between old and new wp-admin design.

I have been using wp-admin classic for a while and the only difference (between WP 3.7 and WP 3.8 with wp-admin classic installed) i noticed is that it does not revert to old WP Editor interface, but this is a minor problem especially if you are using this plugin just to check if your admin panel displays correctly.

Ok, I found a glitch, what now?

There is an excellent article by Andrew Nacin at make.wordpress.org, about targeting new dashboard design, or rather about targeting the old design as Andrew explains “rather than targeting 3.8 or newer this way (which will require you to add selectors for versions far into the future), target 3.7 or older”.

Andrew describes three methods on maintaining compatibility with old wp-admin panel, if you would like to you can check out the article above, i will just describe one method here and explain how to use it along with wp-admin classic plugin.

In the <body> tag (in wp-admin panel) WP is adding a couple of classes, one of them is branch-X-Y where X-Y is current WP version, so if you are using WP 3.8 then in <body> there  will be class branch-3-8, for WP 3.7 there will be class branch-3-7 and so on.

In order to add CSS fix for WP prior 3.8 add in your CSS file code similar to this

.branch-3-7 .my-element,
.branch-3-6 .my-element {
/* some custom CSS here */
}

Of course replace .my-element with your actual element class/name/id. That could be the end of the article, however wp-admin classic plugin is not adding custom “branch” class so we would need to do this ourselves in order to check if properties are applied correctly, following code will do that:

add_filter("admin_body_class", "my_admin_body_class");
function my_admin_body_class($cl) {
if(class_exists("wp_admin_classic")) {
return $cl."branch-3-7";
} else {
return $cl;
}
}

It will be best to place this code in some new plugin and activate it, note, that the above code is checking for class wp_admin_classic, if the class does not exist branch-3-7 class will not be added.

That’s pretty much it, now you can test your code with classic wp-admin panel without having to keep old WordPress installation somewhere on your localhost or test server.

Divi 2.0 WordPress Theme

Like what you read here in this blog post? If yes, please sign up and get latest articles delivered to your email account for FREE! You’ll be also subscribed to newsletter, where I share a exclusive content and offers.

About Greg Winiarski

Greg Winiarski is a WordPress developer. He specializes in backend development and works daily on WPJobBoard and WPHelpDesk plugins.

Leave a Reply