Filtering

­

Filtering helps your visitors narrow galleries on the fly. Best used when you have a clean and logical tagging convention. The plugin is compatible with all kinds of tags in WordPress, NextGEN images and Flickr photos. Besides tags, feel free to use categories or a custom taxonomy like genres. This feature is highly flexible and even offers two levels, which is shown by the first example here.

Normally there are no tags or categories available on WordPress images, but that's a problem of the past. By adding this option for you, Justified Image Grid opens new possibilities. For more control you can use a 3rd party plugin such as the excellent Media Library Assistant to add custom taxonomies to images and batch tag groups of photos.

2-level filtering of WordPress content such as a WooCommerce shop

The above example uses the following, generated shortcode (how to use):
[$justified_image_grid row_height=130 link_title_field=off img_alt_field=off caption=off overlay=off inner_border_width=1 inner_border_color=rgba(100,100,100,0.1) inner_border=hovered inner_border_animate=opacity specialfx=hovered specialfx_type=glow specialfx_blend=0.7 lightbox=magnific mobile_lightbox=magnific orderby=rand filterby=attachment_tag filter_all_text=Any filter_orderby=custom filter_custom_order="women's, men's, baby, flip-flops, slippers" l2_filterby=attachment_tag l2_filter_all_text="All colors" l2_filter_orderby=custom l2_filter_custom_order="purple, red, blue, orange, white, pink" last_row=center image_categories=shoes exclude=9289]

Tag cloud option for galleries with many terms

Terms vary by size and color in a tag cloud so the strongest one indicates the most used tag.

Tag cloud filtering a NextGEN gallery by tags

This example also has the Load More feature enabled, so you can see how it works in conjunction with Filtering.

The above example uses the following, generated shortcode (how to use):
[$justified_image_grid filterby=on filter_style=tags last_row=flexible load_more=click load_more_limit=10 ng_gallery=11]

Multiple term selection

Play with the examples below to get a feel of the two distinct options - union and intersect.

Union (OR), thumbnails can match ANY of the selected terms

The above example uses the following, generated shortcode (how to use):
[$justified_image_grid filterby=on filter_orderby=custom filter_custom_order=nuts,sweet,fruit filter_multiple=or ng_pics="548, 549, 566, 582, 585, 586, 590, 568,547"]

Intersect (AND), thumbnails will match ALL of the selected terms

The above example uses the following, generated shortcode (how to use):
[$justified_image_grid filterby=on filter_style=tags filter_orderby=title_asc filter_min_count=2 filter_multiple=and last_row=flexible load_more=click load_more_limit=10 ng_gallery=14]

What options are available for Filtering?

A couple of useful settings help you fine-tune the filtering experience for your visitors.
You'll find that an unique combination of these will work wonders for your specific usage.

The basic concept

  • One or two levels of filtering.
  • Button and tag cloud styles.
  • Any taxonomy can be used (custom or built-in).
  • Use tags from any WordPress content, Flickr or NextGEN Gallery.
  • Multiple filter selection.
  • Order filter terms automatically or manually.
  • To center the filters or not.

Fine-tune & tweak

  • Manually choose which terms to use and in what order.
  • Show terms that have a minimum number of images.
  • Show a number of top terms, with the most images.
  • Disable or rename the "All" button.
  • Filter by gallery title a NextGEN image belongs to.
  • Change CSS style for buttons and/or the tags.
  • Color and size for tag cloud's smallest and largest term.

How do the settings look like?