How to Create a Sortable List of Pages
| Table of Contents |
Listing pages that you have are among the features that you want to have in your site for facilitating navigation among pages. It is true that you can create indexes to help the user find a particular page, or he can Search for a page or use the Tags cloud. However, having a list that gets automatically populated whenever a page is added or edited, may prove handy and worthy.
Wikidot offers the function List all pages, which lists all pages alphabetically and, thus, may do the trick. However, as its name says, it lists all the pages. This may prove not useful for two reasons:
- On the one hand, some pages are not for users (such as administrative pages pertaining to the categories system: or admin:). Displaying them together with the remaining pages simply clutters the list.
- On the other hand, the resulting list is simply an alphabetical one, neither organized in categories nor with possibilities to be searched for edit date or creation date.
There is a way of creating sortable lists that solves above limitations. The procedure involves a four-step setup.
How to Set Up Sortable Lists of Pages Step-by-Step
Steps 1 & 2 are a one-time setup procedure to create the support for all individual Sortable lists of pages.
Step One: Set Up a ‘Base Page’
In this step you create a new page in an include: category to be called list-pages-template. Do the following:
- Create a new page called include:list-pages-template
- copy and paste (or type) the following module syntax onto the page (copy and paste from the html version)
{$heading}[[# A_{$anchor}]] [[size {$size}]] [[module ListPages category="{$category}" perPage="{$perPage}" limit="{$limit}" _ separate="false" {$attributes} _ prependLine="[[include inc:list-pages-prepend page={$page} | anchor={$anchor} | styleT={$styleT} | styleE={$styleE} | styleC={$styleC}]]" _ appendLine="[[/table]]" _ ]] [[row]][[cell style="{$styleT}"]][{$urlEdit}] {$urlView}[[/cell]][[cell style="{$styleE}"]]%%date_edited|%e %b %Y, %R%%[[/cell]][[cell style="{$styleC}"]]%%date|%e %b %Y, %R%%[[/cell]][[/row]] [[/module]] [[/size]] Step Two: Set Up a ‘prepend page’
- Create a new page called include:list-pages-prepend
- Copy and paste (or type) the following code onto the page:
[[table]][[row]][[cell style="{$styleT}"]]//Page Name//[[/cell]][[cell style="{$styleE}"]]//Last Edited//[[/cell]][[cell style="{$styleC}"]]//Date Created//[[/cell]][[/row]][[row]][[cell style="{$styleT}"]][[size 80%]]Sort [/{$page}/order/titleAsc#A_{$anchor} ascending]/[/{$page}/order/titleDesc#A_{$anchor} descending][[/size]][[/cell]][[cell style="{$styleE}"]][[size 80%]]Sort [/{$page}/order/dateEditedDesc#A_{$anchor} newest first]/[/{$page}/order/dateEditedAsc#A_{$anchor} oldest first][[/size]][[/cell]][[cell style="{$styleC}"]][[size 80%]]Sort [/{$page}/order/dateCreatedDesc#A_{$anchor} newest first]/[/{$page}/order/dateCreatedAsc#A_{$anchor} oldest first][[/size]][[/cell]][[/row]] Step Three: Set Up a ‘Front-End’ Page
This front-end page specifies default values for all include parameters of your lists. This will make it much easier to create individual and customized //Sortable list of pages'', as you only have to specify the relevant parameters on each [[include …]] statement in these individual and customized lists (see step 4). Do as follows:
- Create a new page called include:list-pages
- Copy and paste (or type) the following code onto the page:
[[include inc:list-pages-template heading={$heading} | heading=++ Category ``{$category}'' | anchor={$anchor} | anchor={$category} | category={$category} | category=_default | page={$page} | page=system:list-pages | perPage={$perPage} | perPage={$limit} | limit={$limit} | limit=10000 | attributes={$attributes} | attributes=order="@URL" | styleT={$styleT} | styleT=padding-right:1em | styleE={$styleE} | styleE=text-align:right; padding-right:1em; width:12em | styleC={$styleC} | styleC=text-align:right; width:13em | ]] Once you have done this, the page will display a list of the pages in the “_default” category. However, don't think of this as your final list. This page is only part of the basic setup, and, thus, should remain “hidden.” For creating Sortable lists of pages that you can really use, you need to continue into step four.
Step Four: Create Individual Sortable Lists of Pages
You may need just one Sortable list of pages, or you might want to create more than one. You might prefer to create individual lists in different pages, or just several lists in the one page. Finally, you might want to customize your lists (e. g. one that lists all pages for some selected category, or one that lists all pages for all categories). This third step allows you to do all of that by way of creating individual Sortable lists of pages customized to your needs.
Let's talk about customization first. You can customize each Sortable list of pages according to the parameters shown in the following table (see some examples in the next section):
| Parameter | Default1 | Description |
|---|---|---|
| page | system:list-pages | The name of the “Sortable List of Pages” page you are creating; i. e. the page where you use [[include inc:list-pages ...]] |
| category | "_default" | A category name or category names as defined in the module ListPages documentation. Pages will be listed from this/these category/ies. Note that you cannot use the alias categories |
| heading | ++ Category category | Any Wikidot text to be used as a header |
| anchor | category | If the (list of) category/ies include any characters except “A/a” through “Z/z”, “0” through “9”, “-”, “_”, “.”, or “%”, a unique text string must be specified to be used as an “anchor” for generated links. An anchor prevents the page from scrolling to the top when a user clicks any of the sort links. For example, if “category=*” use “anchor=all” |
| limit | 10000 | the maximum number of pages (i. e. lines) that will be listed as defined in the module ListPages documentation |
| perPage | limit | the number of maximum of pages (i. e. lines) that will be listed before automatic ListPages pagination starts. As defined in the module ListPages documentation |
| attributes | rssEmbed="false" rssShow="false" | Any required additional ListPages attributes as defined in the module ListPages documentation |
| styleT | padding-right:1em | Any CSS style attributes for the first column (Page Name). Note that due to a Wikidot parser problem this style attribute currently cannot be applied to the header row of the first column. |
| styleE | text-align:right; padding-right:1em; width:12em | Any CSS style attributes for the second column (Last Edited Date). Note that due to a Wikidot parser problem this style attribute currently cannot be applied to the header row of the second column. |
| styleC | text-align:right; width:12em | Any CSS style attributes for the third column (Creation Date). Note that due to a Wikidot parser problem this style attribute currently cannot be applied to the header row of the third column. |
To set up an individual and customized Sortable list of pages you need to do the following:
- Create a new page that will hold your customized list (or lists, if you code several of them in the same page).
- Include the ‘front-end’ page that you created in step 2 using an [[include inc:list-pages ...]] statement (see Examples below).
- Write down the parameters that you require for customizing your list (write them as parameter=value |, as shown in the examples in the next section).
The most important parameter — page — is the name of your actual individual page (i. e. this new page that you have just created), so that the different sorting options work within the same page.
All other parameters are optional, and not writing them simply means that the "default" value of the parameter will be displayed instead. Customizing your list means, basically, writing down those parameters that you require (and their values).
You can create Sortable lists of pages in different pages, but you can also display several of them in a single page (as in the example below) by simply repeating the procedure of step three (i. e. syntax and customization) as required.
Note: the pages that you create in step three do not necessarily need to be within the include: category. It can be in any category, e. g. the _default: category. As far as in any of those pages you include the include:list-page page (your "front-end" page, see step 2), you should be alright.
Examples
Here are some examples of customized Sortable list of pages. To the left of the table is the syntax that was written. To the right, the resulting output. You can now click on each sorting option (ascending / descending, etc) and see it working!
| What you type … | What you get … |
| |
| |
|
How it Works
This How-To makes use of two ideas presented in
- Module Attributes Via URL, to dynamically specify order (sort) sequence via the URL link, and
- Include Variables With Default Values, to pre-define values for include variables.
Links
A real-life application of this idea can be found in the Community Wikidot List all Pages.
Backlinks
Authors
Image may be NSFW.
Clik here to view.ErichSteinboeck. Please visit his/her userPage.
Image may be NSFW.
Clik here to view.JDPerezgonzalez. Please visit his/her userPage.