Cleaner Gallery is PHP script that fixes the WordPress
shortcode’s invalid HTML and removes its inline styles. It also gives you greater control and flexibility over how the gallery is output as a theme author.
Adding theme support for Cleaner Gallery
To enable support of the Cleaner Gallery script in your theme, add the following line of code to your theme setup function.
add_theme_support( 'cleaner-gallery' );
Note that this will completely overwrite the default gallery output. You’ll need to style the galleries for them to look correct.
Styling the galleries
You have two options for styling the galleries.
- Creating your own custom CSS.
- Using Hybrid Core’s gallery stylesheet.
If you take the first route, be sure you check your design with multiple columns of images. Three columns is the default, but users can use as many columns as they want.
If you take the second option, this is taken care of for you. Hybrid Core’s
gallery.dev.css for uncompressed version) file in the framework’s
/css folder covers everything from 0 to 30 columns. To use this pre-built stylesheet, either import it or copy/paste it into your theme’s
Of course, you’re still free to overwrite or modify things as you see fit. It’s your theme, so you can style galleries however you want.
The Cleaner Gallery script actually has five different filter hooks available for your usage.
This hook is run over the default arguments (shortcode attributes) the script uses. You could use it to create custom defaults.
$defaults = apply_filters( 'cleaner_gallery_defaults', $defaults );
The following is a list of all the default arguments.
$defaults = array( 'order' => 'ASC', 'orderby' => 'menu_order ID', 'id' => $post->ID, 'link' => '', 'itemtag' => 'dl', 'icontag' => 'dt', 'captiontag' => 'dd', 'columns' => 3, 'size' => 'thumbnail', 'include' => '', 'exclude' => '', 'numberposts' => -1, 'offset' => '' );
This hook is applied to the arguments (shortcode attributes) passed in by the user, which will overwrite the default arguments (see previous section).
$attr = apply_filters( 'cleaner_gallery_args', $attr );
This hook is applied to the number of columns that appear when the gallery images are output. If you needed to change the column number for some reason, you could overwrite it.
Suppose your theme only supported 1 – 10 columns. You could run a filter on this and change the number of columns to 10 if the user set a larger number of columns.
$columns = apply_filters( 'cleaner_gallery_columns', intval( $columns ), $attachment_count, $attr );
This hook is applied to each image’s HTML output.
$output .= apply_filters( 'cleaner_gallery_image', $image, $id, $attr, $cleaner_gallery_instance );
This hook is applied to each image caption’s HTML output.
$caption = apply_filters( 'cleaner_gallery_caption', wptexturize( esc_html( $attachment->post_excerpt ) ), $id, $attr, $cleaner_gallery_instance );