Uber List Examples
In addition to the User Guide, many of the pages beneath this page are examples of Uber List in action.
The page list in the Sidebar on the right is an Uber List. The identity of the pages to be listed is generated using Magic Data. Each list element is formatted using a simple stack where Magic Data is again used to fill in the page specific information.
Each of the linked pages gives a slightly different example of Uber List in action.
In fact, Uber List with Magic Data is so flexible that all add-on pages on this site use the same sidebar Uber List, added to page type defaults and propagated through all 91 pages in the Add-Ons area of this site. (The number of pages is counted using Magic Data.)
Even the main Addons List listing page is an Uber List.
The Magic Data expression to generate the sidebar page list is:
PAGE PARENT_FROM_TOP 2 MERGE_INTO "addon_pages_list" LIST_PAGES 50 MERGE_INTO "addon_pages_list" REMOVE_FROM_LIST ( PAGE ) SORT_BY PAGE_NAME END_SORT_BY
- Line 1 locates a page 2 down from the top in the current path and notes it into a memory 'addon_pages_list'.
- Line 2 then lists 50 pages beneath that and adds them to the same list. The list remains the 'current result', so we can keep using it.
- Line 3 removes the current page from the list.
- Lines 4-6 sort the list by page name.
Then for each list item a stack containing a single content block, shown here as HTML:
[% ORIGINAL_PAGE PAGE_LINK %][% ORIGINAL_PAGE PAGE_DESCRIPTION TRUNCATE_TO_WORD 150 %]... [% ORIGINAL_PAGE URL AS_NAMED_LINK " more." %]
Uber List is the ultimately flexible list block. Just one list capable of listing anything you want to list and formatting it however you like:
- Search results.
- Form results and tabular data (using Magic Data Forms)
- Anything there is a Magic Data symbol for.
Create, filter and order a list of items using a Magic Data expression. Then show the listed items using a stack or HTML snippet as a template, adapting the template to each item with inserts of Magic Data. The listed items can optionally be formatted by wrapping them in any content block template and further advanced item wrappers can be added from Magic Tipple.
- Set item width and height.
- Control overflow.
- Float left or right.
- Set margins and padding.
Uber List can paginate lists with too many options for transitions and effects to go into in detail. Have a look at some of the examples, then once you have Uber List installed you can enjoy experimenting.
Uber List can even clear up orphans so you don't end up with a lonely list item on a page by itself at the end. For long lists Uber List provides flexibly configured lazy-loading of list items for a fast user experience.
Uber List includes many templates for displaying lists:
- Equal height items.
- CSS columns.
- Ajax loading (requires Blocks By AJAX)
- Remote setting - use Uber List to template items within a Page List block
- Remote setting - use Uber List to template results from the core Search block!
See the documentation for more details about using Uber List.
If you want to dynamically sort, search and filter through an Uber List, Uber Filter provides the ultimate filtering extension for Uber List. You can see Uber Filter in action powering this search page, a list driven by Uber List and filtered by Uber Filter .
From version 1.13 this addon is compatible with php7. To update a site to php7 you will need to make core updates (at time of writing only on github and not released). You will also need to ensure that other addon packages are php7 compatible.
See more addons by JohntheFish.
Last updated: over a year ago