Bundling plugins with WordPress themes.

First off, many people will disagree with including Plugins with your themes. Yes and generally rightly so:

  1. Automatic Updates: If the plugin is freely available from WordPress.org already, then so are automatic updates to the plugin. The original author can add features, fix bugs, and deploy them quickly. Your clients and customers then benefit from on-going development. If you were to package them in your theme, though, you are essentially freezing the code at that point in time – any further updates, bug fixes, etc. would have to come from you. This means you’ll need to continuously release theme updates whenever the included plugins update.
  2. Core: When WordPress updates, some plugins will break. This is because the original authors didn’t take the time to remove deprecated functionality or test with new versions of WP. Do you really want to commit to maintaining your theme + someone else’s code?
  3. Interoperability: As the great mfields once said, “If you’re building a bathroom and you change the wallpaper, the toilet shouldn’t disappear, too.” Users should be able to swap out themes whenever they want without losing their content, their custom data, or the additional functionality they have on their site. Remember, themes are meant for presentation, plugins are meant for functionality.
  4. Bad Practice: Whether the theme updates or not, whether the plugin updates or not … WordPress will eventually update. Limiting your client to a single version is, frankly, insulting and bad business. Instead of hard-coding a drop-in plugin, just make your theme play nice with provided hooks and encourage users to install the other system. If you’re using WordPress hooks (actions and filters) rather than direct function calls, you aren’t risking much in terms of stability. If a hook changes, the feature is just disabled as if the plugin weren’t installed.

Though there may be specific cases where including a plugin in our themes is needed. For example, a recent case where I was building a content platform for a network of sites that would use the same basic theme across each site. I needed a way to bundle these plugins with a theme. The plugins were the fantastic advanced custom fields using the options page, the main plugin and some addons such as the repeater field.

I bundled all the plugins within my theme using the TGM Plugin activation library. With this plugin we create a hook and use php require_once function to call our plugins.

admin-notice

Sources: Adding plugins to WordPress themesAre drop-in plugins a product of design, TGM Plugin Activation, Advanced Custom Fields

Vertically aligning elements

For a long time I’ve always been using the following method of vertically aligning elements on a web page:

.parent{
display: table;
width: 100%;
}
.child{
display: table-cell;
text-align: center;
vertical-align: middle;
}

This method works good across all browsers and includes solid IE support down to IE7. The downfall of this particular method is that it requires two html elements in order for it to work (a parent and a child).

Using CSS3 transforms property, we can now vertically align elements with just 3 lines of css:

.element {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

Transforming the element on the Y axis with a negative 50% of the height the element is currently contained in will pull it up half way (more than likely outside the parents width and height).

transformy

Now if we add a top: 50% it will pull the element back down directly in the center of whatever parent container the element is sitting inside of.

top50