Hiding Page Templates in the Admin

With the latest version of Portfolio Press I needed certain page templates to only be available if the Portfolio Post Type Plugin is installed. This is because those page templates work specifically with portfolio post types and are ineffective without the plugin.

Unfortunately there is no filter for page templates in core (though there are some patches). The PHP workarounds I’ve seen are convoluted and brittle, so I decided to tackle this instead with javascript. Continue reading Hiding Page Templates in the Admin

IE Browser Testing on OSX

Browser testing in Internet Explorer can be a bit tricky since I do all my WordPress development work on a Mac- but I finally got a setup that works well.

virtualmachines

I’m using Virtual Box because it is free, rather easy to set up, and I could store all the disk images on an external drive (they take up too much space on my MacBook Air, 10GB a piece).

The disk images with Windows and Internet Explorer can be downloaded from Modern IE. I had to download some of the rar files multiple times because the zips were corrupted in the download (they’re large files)- but I eventually got a clean version. Disk images are available for IE6, IE7, IE8, IE9, IE10 and IE11. Continue reading IE Browser Testing on OSX

Template Hijacking and Useful Styling Tricks

Portfolio Press has always used custom post types to display portfolio content. When the theme was released in 2010 this was a novel way to do it (custom post types had just been released in WordPress 3.0).

Post types allowed the portfolio to be styled differently, use different templates, and keep portfolio content separate from standard content. In the dark ages before WordPress 3.0, developers had only achieved this by requiring users to post in a pre-defined category or tag.

screenshot

But since WordPress 3.4 we’ve had post formats like “gallery” and “image” which are now supported by most new themes. With the latest version of Portfolio Press, I wanted users to be able to choose which to use. Post formats are the new default, but users can install the Portfolio Post Type plugin and use post types instead if they choose.

To save a lot of duplication in template code and styling, I used a bit of template hijacking and a few other useful styling tricks. I doubt anyone is working on this exact same issue, but I think some of the ideas might be useful for other applications. Continue reading Template Hijacking and Useful Styling Tricks

Auto Set Featured Images

Most current WordPress themes support featured images. But, let’s say you’re updating a site that uses a theme built before WordPress 3.0. And let’s say that theme uses a custom meta field to define the featured images. And let’s say there’s over 900 posts on the site. There’s no way you’d want to set all those featured images manually.

I found myself in that situation today- so I wrote a little plugin:

1) It checks if the custom meta field (‘FeaturedImage’) is set, and if so, fetches the attachment id based on the url string. That attachment gets set as the featured image.

2) If the custom meta field is not set, it will use the first attachment image it finds.

The majority of the code was lifted from two places. Gavick posted the code about setting featured images. Philip posted the code about fetching attachment ids from URL strings.

I can’t vouch at all for the quality of this plugin- so I’m just putting it on GitHub in case it can save another developer some time. Or maybe even make it a little better. Pull requests welcome.

Instant Content Plugin

I’ve been working on a new WordPress plugin called Instant Content for Demand Media that allows users to search for, purchase, and import article content directly to a WordPress site. You can think of it as a marketplace for written content that’s accessible directly through WordPress dashboard.

Instant Content is launching with over 50,000 titles available for sale, all written by freelance writers working with Demand Media. The articles are mostly practical “How-To” type content.

demand-media

It’s been an interesting project to work on and I’d like to share some of the ideas behind it, how the code works, and even how the plugin could even be adapted for other purposes. Continue reading Instant Content Plugin

Options Framework Roadmap

The latest WordPress release (3.8) is scheduled for December 12th. For those following along with core you’re probably aware that this release will bring significant UI changes to the WordPress dashboard.

options-framework-1.7

The Options Framework handles this new dashboard design fairly well. Core styling classes were used as much as possible and styling is fairly minimal- so most of design changes are inherited. The biggest issue I saw with the current version is that checkboxes and radio buttons are a bit warped. Continue reading Options Framework Roadmap

Optimizing Responsive Layouts

Styling for a range of different screen sizes is rather easy in CSS thanks to media queries. But what if you want to deliver slightly different content or markup based on screen size?

WordPress has a wp_is_mobile tag that can be used- but this covers a wide array of devices and doesn’t allow for specific screen size targeting.

Here’s a couple techniques I’ve been using that are a pure front end solution: Continue reading Optimizing Responsive Layouts

WordPress Design Changes

There are some bold new changes in the works for the WordPress dashboard: a responsive design, a font icon set, and a new darker + flatter look. There’s also workflow changes on a number of admin screens, including the themes page and dashboard home.

New Dashboard

For folks interested in following along with the progress, check out the make.wordpress.org/ui blog. MP6 and Dashboard can also be installed on a development site to preview all the updates. Continue reading WordPress Design Changes

Full Screen Background Images

Full screen background images are a nice feature for a number of WordPress themes. It’s also one of the few theme modifications that can be handled well through a plugin.

Full Screen Background

The implementations I’ve seen generally use the jQuery script backstretch.js- which handles responsive layouts and large images elegantly.

If you’re not a theme developer and just want to add a full screen background to your site, I’d suggest trying out one of these plugins:

If you are a developer and want learn how to add this feature to a theme, read on.
Continue reading Full Screen Background Images

Add UTM parameters with jQuery

On a recent project we needed to add UTM query parameters (for Google Analytics tracking) to all outbound links to a specific domain.

I didn’t feel like updated all the links on the site directly in the code since these campaign query strings might change, so I created a basic jQuery plugin to do this:

jQuery.fn.utm_tracking = function() {
	$(this).find('a[href^="http://www.example.com"]').each(function() {
		var url = $(this).attr('href');
		$(this).attr( 'href', url + '?utm_source=example&utm_medium=link&utm_campaign=campaign' );
	});
}

Continue reading Add UTM parameters with jQuery