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

  1. 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/wordpress-plugin-development-how-to-include-css-and-javascript-conditionally-and-only-when-needed-by-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.

  2. Kaspars says:

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

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

  4. Ryan says:

    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.

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

  6. Kaspars says:

    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.

  7. Frank says:

    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;
    }
  8. Kaspars says:

    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 Reply to Kaspars Cancel reply