How to Customize WordPress the Right Way

LinkedInTwitterFacebookEmail

A couple of months ago, I received a phone call from a business owner who needed their site re-skinned. The design was a couple of years old and wasn’t holding up to WordPress updates – it needed to go. It was a fairly customized site, not just with the theme on the front end, but also the setup in the administrator’s area.

I took a look and found a disheartening problem: all of the WordPress administrative customization had been done in the theme. But we needed to change that theme, and so risk losing all of the customizations. It came down to choosing between trying to update the theme (which would be time consuming = lots of money!) or pulling all the customizations of the theme.

We pulled them all out. But instead of adding them to the new theme, I added them where they should have gone in the first place: a plugin.

How to Handle Customizing WordPress

Photographer: Jeremy Bishop

Why should customizations go into a plugin?

WordPress allows you to customize not only the front end look of the site, but also the very functionality of WordPress itself. Everything from new post types, new taxonomies, and even creating new database tables for your own customized setup. With all this elasticity, it’s important to keep your site as organized as possible. And the two sections for organizing a WordPress site are Themes and Plugins.

What should go in your Theme?

Your theme should be everything regarding how the site looks. If it has to do with colors or the page/post templates, it goes into the theme. Not sure? If the functionality is something that lives outside your website design, don’t add it to theme.

If the functionality is something that lives outside your website design, don’t add it to theme.

Example A. You want to add a menu area to your site. You have the main menu already in the theme, but you need an extra menu in a bar above the main menu. This should be added to the theme. If you changed the theme, you mostly likely wouldn’t need this added menu, at least not in the same area. This is something that lives inside of your design since it’s dependent on how the design works.

Example B. The excerpt for the posts is too large to fit in the area provided. You need it just a bit smaller to make the design cleaner. This would be added to the theme as well. In a future design, the excerpt size would most likely need to be adjusted per that design’s space.

What should go in a Plugin?

Plugin functions should include everything that is design removed. If it doesn’t have to do with how the site looks, include it in a plugin.

The most important things you’ll want to add to a plugin are site verifications, like Pinterest or Google. Most setups have multiple ways of verifying your site, including everything from txt files on your domain name to meta descriptions on your site. I’m personally a fan of the latter because regardless of where you move your domain name, point your name servers, or change your theme, your site will still keep your verifications.

If you change the theme, you don’t want to lose all your testimonials or businesses you so painstakingly added.

Custom Post Types should also be added to a plugin. If you change the theme, you don’t want to lose all your testimonials or businesses you so painstakingly added, right? So make sure those are added nice and neatly into a separate plugin.

Finally, any customizations to WordPress itself, like not showing the admin bar or customizing the login area, should also be added to a plugin.

How to Set Up a Custom Plugin

Setting up a custom plugin isn’t complicated, at least the most basic version. Instead of adding coding to our theme’s (or child theme’s) functions.php file, we’ll be adding that same coding to, essentially, a functions.php in a plugin folder.

To follow the instructions below, you’ll need FTP access to a staging site online (preferably not live), or you can try it out on a localhost site.

Start with adding a folder to the wp-content/plugins/ path of your site. Name the folder the name of your customized plugin. During these instructions, I’ll be calling our plugin White Fox Creative Theme Setup.

wp-content/plugins/whitefoxcreative

Under the folder, add a PHP file named the exact same as the folder name:

wp-content/plugins/whitefoxcreative/whitefoxcreative.php

Within that PHP file, you’ll want the following code, customized for you, of course (don’t forget the opening PHP tag):

1
2
3
4
5
6
7
8
9
10
11
12
 /*
 Plugin Name: White Fox Creative Theme Setup
 Plugin URI: https://whitefoxcreative.com/wfc
 Description: This plugin is custom created by Kim Joy Fox for adding additional theme setup when creating a theme or when using a pre-made theme.
 Version: 1.0
 Author: https://kimjoyfox.com
 Author URI: https://kimjoyfox.com/kimjoyfox
 License: GPL2
 License URI: https://www.gnu.org/licenses/gpl-2.0.html
 Text Domain: wporg
 */

 defined( 'ABSPATH' ) or die();

You can also include a readme.txt just in case someone finds this plugin in the future and wants to know what it is. Something like this works fine:

1
2
3
4
5
6
7
8
9
10
11
12
 === White Fox Creative Theme Setup ===
Contributors: Kim Joy Fox
Tags: customized theme
License: GPL2

This plugin is custom created by White Fox Creative for adding additional theme setup when creating a theme or when using a pre-made theme.

== Installation ==
Upload and Activate. There are no settings for this plugin within Wordpress. Edit the plugin itself to update.

== Changelog ==
Version 1.0: initial creation of Plugin

You can include a changelog as needed to remind you of what’s been added to the file.

What to Remember

Knowing where to add customizations in WordPress can save you time and money in the future. Just remember, anytime you adjust WordPress or add to your theme/child theme, make sure you ask “Does this depend on the design?”

Join the Discussion

Your email address will not be published.

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>