listPages

generates the markup for the list of pages defined by @t(listConfig).

@t(listPages{ Options })

Options

variables: "title" - string (comma separated for multiple values)

The page variables to be used as the title text for each page in the listing.
Multiple variables can be used, separated by comma: variables: "title, subtitle, text"

glob: false - string or false

The pattern for matching image files to be used as thumbnail for each page. Multiple patterns are allowed, separated by comma. For example glob: "*.jpg, *.png" will at first check every page for JPG files and will take the first one as thumbnail. If there is no match, the first matching PNG file will be used.

width: false - int or false

The width of the thumbnails in pixels. (glob must be defined!)

height: false - int or false

The height of the thumbnails in pixels. (glob must be defined!)

crop: false - boolean

Defines whether the optional thumbnails get cropped to fit the specified aspect ratio.

maxChars: false - int or false

The maximum number of characters each of the variables get shortened to. If the value is set to false, the systems default will be used.

header: false - string or false

Optional header text of the listing.

class: false - string or false

Optional class for each list item.

style: false - array or false

An array of properties to override the list items styles per page. The key represents the actual css property and its value determines the name of the page variable to be used to define the value of the css property.
Check out the examples below for the correct syntax.

firstWidth: false - integer or false

Optional width for the image of the first item.

firstHeight: false - integer or false

Optional height for the image of the first item.

firstClass: false - string or false

Optional class for the first item of the list.

offset: 0 - integer

In contrast to offset parameter of the listConfig() method, this parameter only offsets the sequence of pages to be output after filtering and sorting without affecting the actual listing object. If offset is negative then the sequence will start that far from the end of the array of possibly returned pages. Therefore filtering and sorting might change the actual returned set of pages and not only its order.

limit: NULL - integer

In contrast to the limit parameter of the listConfig() method, this one only limits the output of pages without affecting the actual listing object. Therefore filtering and sorting might change the actual returned set of pages and not only its order. If limit is negative then the sequence will stop that many elements from the end of the array of possibly returned pages.


Examples

A simple list of all pages existing on the site, displaying their title, subtitle and text:

<div class="listing">
    @t(listPages {
        variables: "title, subtitle, text"
    }) 
</div>

The same list of pages, using the first JPG file of every page as thumbnail:

<div class="listing">
    @t(listPages {
        variables: "title, subtitle",
        glob: "*.jpg",
        width: 350,
        height: 350,
        crop: true,
        class: "image"
    })
</div>

A filterable and sortable list of all children of the current page:

@t(listConfig { type: "children" })

<div class="menu">
    @t(listFilters)
    @t(listSort {
        "Ascending": {
            sortItem: "title",
            sortOrder: "asc"
        },
        "Descending": {
            sortItem: "title",
            sortOrder: "desc"
        }
    })
</div>

<div class="listing">
    @t(listPages {
        variables: "title, subtitle, text"
    }) 
</div>

A list with where each item has its own color and background-color:

<div class="listing">
    @t(listPages {
        variables: "title, subtitle",
        glob: "*.jpg",
        width: 350,
        height: 350,
        crop: true,
        class: "image",
        style: {
            color: "page_color_variable",
            background-color: "page_bg_color_variable"
        }
    })
</div>
See also