Smarter Cleaner Gallery

Justin Tadlock’s Cleaner Gallery plugin fixes the semantics of the WordPress built-in gallery feature by placing all of the gallery related CSS in an external file instead of the inline CSS produced by WordPress core.

However, the problem is that this CSS file is loaded on every page request. Therefore, until WordPress supports combining all CSS files into one, here is a quick way to hide this CSS file on all pages that don’t contain a gallery (line 128 of cleaner-gallery.php):

Note: this will add cleaner-gallery.css only on single post and page views (not indexes or archives).

add_action('wp_head', 'cleaner_gallery_head', 0);
function cleaner_gallery_head() {
	global $post;
	if (strstr($post->post_content, '[gallery'))
		wp_enqueue_style( 'cleaner-gallery', CLEANER_GALLERY_URL . '/cleaner-gallery.css', false, 0.7, 'all' );
}

Hopefully, Justin can incorporate this into the next release of this handy plugin.

8 Comments

Artem Russakovskii 21:40

Ha, incidentally, I posted a more in-depth look at the same issue of overincluding css and js by plugin authors at almost exactly the same time as you – http://beerpla.net/2010/01/13/.....the-posts/

Also, I’d be careful about your solution – it seems to assume a single post page only – what about galleries on the front page. Not everyone uses excerpts.

Kaspars 22:37

Artem, you raise a very good point about the archive and index pages. I’ll have to look into it.

Justin Tadlock 2:14

Yeah, I’m still looking into a solution for non-singular views. Once I, or anyone else, provides that, I can update the plugin.

Ryan 4:30

Wouldn’t it make more sense to just require the theme to include the CSS? Using a separate stylesheet for this seems kinda pointless when the theme can presumably be styled to cope.

There was a trac ticket regarding this back in 2.5, but I’m guessing was ignored.

We should probably lobby to have this fixed in core as the current system produces some bizarro code. I don’t understand why a definition list would be used in this way for a gallery. Each line is no different from the next, so an unordered list or table seems far more sensible to me.

Artem Russakovskii 10:03

Justin, that’s exactly what I posted about today. See my first comment above.

Kaspars 13:11

I have decided that, just like Ryan said, galleries are a core WordPress feature and their CSS should be provided by the theme. There is no easy way to tell what content is to be loaded for any particular view because of the way WordPress themes are constructed, especially in case of custom database queries.

If your theme sticks to the standard loop, the best solution is to use Artem’s solution.

Frank 17:21

I think it better, when you parse before triggered wp_head; maybe this one:

add_action('the_posts', 'cleaner_gallery_head', 0);
function cleaner_gallery_head($posts) {
	if (empty($posts))
		return $posts;

	$found = false;

	foreach ($posts as $post) {
		if (stripos($post->post_content, '[gallery'))
			$found = true;
	}

	if ($found)
		wp_enqueue_style( 'cleaner-gallery', CLEANER_GALLERY_URL . '/cleaner-gallery.css', false, 0.7, 'all' );

	return $posts;
}
Kaspars 18:59

Frank, the only problem I see with this approach is that it doesn’t work with custom DB queries (when using query_posts();).

Leave a comment

Note: Basic HTML formatting is allowed. If you post HTML or PHP fragments, wrap them with <code>...</code> which will automatically encode the HTML entities.

About the Author

Kaspars Dambis I am a race car driver, engineer and a web designer living in Latvia and working on the web since 2000. Read more or get in touch.

Es vienmēr tevi mīlēšu, Sirsniņ!