Dynamic Sortable / Filterable List

Best Practices

Overview

The dynamic sort-filter list is a Visual Composer module that creates a visually compelling list of pages or files that can be sorted and/or filtered by the site visitor. Each page/file can be represented by title, image, and description.

Note on multi-site filtering/sorting:  You can now set up a dynamic sort-filter module to pull pages from multiple sites.  See Building in the WCMS for more information.

example filter-sort list (partial)

The picture above shows a partial one-column sort-filter list.  The filter category “Bicycles” is a category in a custom taxonomy created for the Features Gallery.  You can also use the standard taxonomies in the Metatags and Taxonomies panel (e.g., Topics, Audience Type, Content Source).

You have quite a few options for laying out the sort-filter list.  “Live” examples are available:

Note that “horizontal” and “vertical” refer to the position of the image relative to the text.

Guidance

  • To represent the content pages, use high-quality images of the same aspect ratio.
  • Images are optional, but they can be very helpful in drawing visitors’ attention to content. If you need a simple list with only titles and dates (no images), special guidance is provided with this example list.
  • For multi-column layouts, place the image at the top.  See the two-column and three-column example lists.
  • The less detail in the images, the better, particularly when the images render small.  (In the one-column horizontal example, several images have a little too much detail.)
  • Consider whether to include links to alternative formats and/or alternative languages.  In this example, many items have an alternative PDF.
  • Note that a dynamic sortable / filterable list can be driven by a WCMS managed feed.