Wikidot Community

Understanding prependLine, appendLine, and separate

Chart with Google Chart API

The Google Chart API returns a PNG-format image in response to a URL. Example: http://chart.apis.google.com/chart?chs=250x100&chd=t:60,40&cht=p3&chl=Hello|World will return
chart?chs=250x100&chd=t:60,40&cht=p3&chl=Hello|World.

What if I combine a preset URL with the results of a ListPages module ?

The ListPages module does not work recursively.

Code

The code below was inspired by Erich's ListPages Horizontal snippet. I.e. it uses the backslash "\" both in the prependLine and in the module's body. There is a another hack: I had to add a dummy result, zero, otherwise the series of ratings would have begun with a comma.

[[module ListPages category="howto" order="rating desc" perPage="999" separate="false" _
prependLine="[[image http://chart.apis.google.com/chart?cht=lc&chs=600x300&chf=bg,s,EFEFEF|c,s,66CCFF&chtt=Ratings+distribution&chts=0000FF,16&chm=o,FF9900,0,-1,5.0&chxt=x,y&chxl=0:|HowTos&chxp=0,50&chxr=1,0,50,5&chds=0,50&chd=t:0\" _
appendLine="]]"]]
,%%rating%%\
[[/module]]

Limitations:

the length of the URL
it is currently not possible to dynamically add labels or add other series

Credits

Chart with Listpages and px-trick

This little ListPages block shows the first 20 howto's with a diagram( x10 px) of their ratings ordered by their ratings:

The ListPages module does not work recursively.

Code

[[module ListPages category="howto" order="rating desc" limit="20" separate="no" prependLine="[[table]]" appendLine="[[/table]]"]]
[[row]]
 [[cell]]
 [/%%fullname%% %%title%%] ( %%rating%% )
 [[/cell]]
 [[cell]]
 [[div style="background-color: #333; height: 30px; width: %%rating%%0px; overflow: hidden"]]
 [[/div]]
 [[/cell]]
[[/row]]
[[/module]]

The ListPages module does not work recursively.

[[module ListPages category="howto" order="rating desc" limit="20" separate="false" prependLine="[[table]][[row]]" appendLine="[[/row]][[/table]]"]]
 [[cell style="vertical-align: bottom; text-align: center;"]]
 [[div style="background-color: #333; width: 30px; height: %%rating%%0px; overflow: hidden"]]
 [[/div]] [/%%fullname%% %%rating%%]
 [[/cell]]
[[/module]]

Authors

gerdami gerdami . Please visit his/her userPage.

Helmuti_pdorf does not match any existing user name. Please visit his/her userPage.

James Kanjo James Kanjo . Please visit his/her userPage.

With the recent development of the ListPages module, the Wikidot engine has become very powerful, and is now able to provide new automated functionalities. One of these functionalities include the ability to create fully functional blogs.

Table of Contents

Understanding prependLine, appendLine, and separate

You will need a…

category to store all blog entries in;
live template to automate display formatting of new entries;
page to display the latest blog entry;
page to display all blog entries (for RSS feeds).

Step 1: Create a category

You will need to create a Category to store all blog entries in. The "Category" you create is really nothing more than a new page except it becomes a "home" or top level page for the rest of the blog's supporting "sub-pages" to "fall out of" or be attached to as you create them. The details are covered down in Step 2, below.

In this how-to, we will use the "blog" category. Now you have two options as to how you will store your blog entries:

Name given URLs (i.e. blog:great-food, blog:fun-swimming, etc, etc.);
Sequentially numbered URLs (i.e. blog:1, blog:2, etc, etc.).

There are no 'side-effects' to either method, so whatever you choose will have no affect on the rest of your blog. The only difference is that you may want a 'more ordered' blog with automatically numbered entries. However; you need to perform some extra steps if you choose option 2.

Category Creation Steps

At your home page, create a new page by filling out the "New Page" entry block and click, "New Page". Keep the exact spelling of that new page in mind.
A new page will be created and you will be taken to it in the "edit" mode.
Make whatever changes you want to initially make to the new page and save it using the "Save" button at the bottom of the page. Note that the title of the new page shown at the top.
Make reference to the new page in whatever "directory" or site tree menu you have chosen by editing that portion of your site; as long as you type in the reference just as you created it, it will provide a direct link to the new page.

Auto-numbering of blog entries

From the Site Manager, click on "Autonumbering of pages". Then click "+ add autonumbering". You should see this:

autonumbering.png

Type in your blogging category (in our example, it is simply "blog") and press the "add autonumbering" button.

Step 2: Create the live template

Now that we have decided upon what our blogging category is, we must create a live template for it. This will arrange every blog entry to have the same layout — brilliant for consistency.

Note: Attempting to create the live template with the NewPage module's text entry box will not work! You must instead enter the page name directly into your browser's address bar. We recommend you read the glossary for more information.

So let's get started — create the page _template in your blogging category (i.e. blog:_template). On the page, we need to have the blogging entry content placed somewhere. Type in %%content%%, and save the page.

There are a few things you may like to include on your template:

Automatic page parenting (emulated);
Date and/or time of post;
Page rating module (must have rating enabled);
Comments module (must have forum enabled).

We'll go through how to do each of these one by one.

Automatic page parenting (emulated)

You may find that you like the breadcrumbs navigation when you assign a parent-page to a page. But it would get quite tedious if for every blog entry had to manually assign the parent page to our blogging category. A great workaround to this is by emulating the breadcrumbs navigation:

[[[Blog]]] » %%title%%
%%content%%

Date and/or time of post

Featured in most blogs is the date and time of the entry. To do this, you simply add the following code:

[[[Blog]]] » %%title%%
Posted on %%date|%A: %d %B, %Y|agohover%%
%%content%%

That will show the day of the week, followed by the date (day month year). You can, however, change this to any format you like. See this page for more information.

Page rating module

You may like to give your readers the opportunity to rate your blogging entries. To do this, simply type:

[[[Blog]]] » %%title%%
Posted on %%date|%A: %d %B, %Y|agohover%%
%%content%%
Like this entry?
[[module Rate]]

Remember to enable rating for your blogging category.

Comments module

Also common in most blogs is the ability for readers to 'comment back' or discuss what you have talked about. We can do this with the comments module. Even if you are not using a forum on your site, to use the comments module you will need to activate the forum from site manager -> forum and discussion -> settings.

[[[Blog]]] » %%title%%
Posted on %%date|%A: %d %B, %Y|agohover%%
%%content%%
Like this entry?
[[module Rate]]
[[module Comments title="Leave a comment"]]

Step 3: Create blog home page

Now that you've set up the blogging category, you need a place to display the latest blog! Go to your blogging category page (ours is the blog page) and type in the following code:

[[size x-large]]Latest Blog:[[/size]]
[[module ListPages order="dateCreatedDesc" limit="1" category="blog"]]
[[size large]]%%title_linked%%[[/size]] posted on %%date|%A: %d %B, %Y|agohover%%
%%short%% ([[[%%page_unix_name%% |read more...]]])
**Comments: %%comments%%**, Rating: %%rating%%
[[/module]]

We are only showing the latest page (order="dateCreatedDesc" limit="1") of the "blog" category. What we are showing here is the title of the blog entry and when it was posted. Then we display only a short snippet of the page, and give a link for the user to "read more". After that we display the number of comments of that blog entry, and how highly it has been rated.

There are a few things you may like to include on your blog home page:

Step 4: RSS Feed (optional)

If you want your readers to have easy access to your blogs via an RSS feed, then you need to supply an RSS link on the blog home page. Just replace the ListPages module code with the following code:

[[module ListPages order="dateCreatedDesc" limit="1" category="blog" rss="Your blog title!"]]

Obviously, you would replace "Your blog title" with the title of your choice; ideally, your blog's name.

Step 5: Finish

Finally, you may want to add a "Create new blog entry" button somewhere on your site:

[[module NewPage category="blog" button="New Blog Entry" tags="blog"]]

It is not necessary to automatically tag each entry with 'blog' (tags="blog"), but you may want to anyway.

And you're done! Now you should create a blog entry in recognition of your achievement!

Summary of pages needed

There are some pages needed for a blog. After doing like this howto you will have following pages(assuming the method with "autonumbered" pages):

page-name	title	content
blog	Blog Overview	"master" page - shows in an overview all existing "blog: … " pages (Step 3; Step 5)
blog:_template	Blog Live Template	"Layout holder", describes the output of all pages starting with "blog:" (Step 2)
blog:1	First Entry in my blog	This is my first entry in my blog! if you want you can comment this page with… . .
blog:2	Second news	I got my first comment! …

Notice:
1. The first 2 pages have to be keyed in manually - either on the adressbar or on the side bar if there exists a box for new pages.
2. The first page "blog" can be named free - this is NOT in category "blog:" !!
3. If the autonumbering feature is not used, then the Page-Names of "blog:x#y#z… " have to be set manually- in any order…

Examples

Here are a few good examples of blogging on Wikidot.

Open Source

Closed Source

Apply your first live _template to your pages

Author

James Kanjo James Kanjo . Please visit his/her userPage.

Table of Contents

Understanding prependLine, appendLine, and separate

Introduction

Page Tags are one of the most efficient ways to make your content accessible and searchable to your audience. When applied appropriately, they are also an extremely effective navigational supplement to your wiki. Sometimes, however, you may find that you need to limit viewership of certain tags. This can be particularly true if your site navigation is heavily tag dependent.

The need for this arose from my use of "hidden tags" to manage content generation. The documentation on "hidden tags" was limited and a little ambiguous. I was immediately enthralled with the fact that they are by default removed when using TagCloud module. A major caveat, however, is that they are not removed from the PagesByTag module, and they still display on the bottom of the page. For my wiki, this was a concern and so this workaround was born.

Considerations

Protected tags are a great way to protect your site navigation from interference. They allow strong management of your tags so that other users cannot disrupt your organizational system. The fact of the matter is that spam-bots, uneducated users, and unethical users can screw up a system very quickly and with little effort. While these methods do not stop them completely, it does require them to work a little harder to do so. Additionally, creating a managed system for your tags may yield many other benefits depending on your content, structure and user base. All of the clear advantages are listed below.

Despite the advantages and control the methods described here allow, there are some limitations and inherent flaws to the process. Most limitations are in regard to workload. But a key point to remember is that security (no matter how small) always requires a great deal of ground work. The principle disadvantage of this method is that while it provides more management, it is not a substitute for true security measures which limit access. It, however, is better than none. Before you implement this, think about how important it is to your site. To help you make a proper informed decision, I have also listed the disadvantages and workarounds (if any).

Advantages

Is more versatile than "Hidden Tags" - You can protect any tag. Depending on what the tag is, also determines the level of protection. This is explained below.
Does not impact "public" tags - All of the tags you do not define as protected are public and viewable. You could create an inherently closed tagging system, but that undermines (in the long run) the purpose of tags to begin with.
Supports Open and Closed systems - To create a closed system, make your interface display only tags that do have a certain tag. For an open system, make your interface display all tags that don't have that tag.
Is easily extensible - Once implemented it opens up the way for other applications. One such application that I have already implemented is an modified list-all-pages.
Can be used to limit any pages visibility - There may be times when you want a page to be accessible through specific channels, but don't want it to appear in your modules and views. By applying the same tag to your pages directly, this become possible.
With other techniques, allows strong dynamically linked pages - For instance, linking titles to Tag Trees allows you to generate dynamic generic page lists. This can be extremely powerful when using Multiple Word Tags, though there are some concerns with this.
Allows a direct management system to be implemented into your tag structure - If a user creates a new tag, you choose whether or not it enhances the sites navigation or whether it is simply transparent.
Is easily removable from your interface - In simple terms, starting down this road is not a commitment to use it. To stop utilizing the interface, simply adjust your CSS and remove your substitute page-tags.
Are accessible to users aware of them - That is, admins and moderators could list all the pages which use hidden tags with little or no modification to your current system.
Is queryable - This is the foundation to creating stronger, more capable lists of your tags than the cloud itself. So you could, in fact, create a ListPages interface to list all of your tags.
Makes Tags Documentable - As stated before, the pages that hold the tag may or may not have any content. If you use that content to describe the tag and how it should be used, some great dynamic help regarding which tags to use when becomes immediately available to your users.

Disadvantages

Requires hands-on management for any tags to be effective - Your users tags will not work when they immediately put them in, unless they are already in the system. This is something that your users will not expect and can be harmful without the proper disclosure. If you are up to the management and your users accept your content, than this could help to maintain the quality of your site.
Requires content anticipation - If your site is very structured and static, than this can be useful. However, if you have multiple types of content from many uncontrolled users, Protected Tags may be more trouble than they are worth.
Requires minor modification to system pages. - In short, ListPages is a stronger tool than the other modules but each has their limitations. This may be utilized as a strength, but takes some considerable work on your infrastructure.
Requires many more pages - There must be a page for every tag. Though these pages may be empty, this can still be quite cumbersome if your site is expected to have a lot of tags.
As mentioned previously, this is not a substitute for true security methods. - This merely hides information from the interface, and does not remove all tags from the source code. Hiding something from a user is not the same as never giving it to them.
Does not protect tags when adding or removing tags - working on this
Subverts the PagesByTag module - This requires replacement interfaces wherever you have used this module. Depending on your need, such replacement may be a change to the category. In other cases, it will require a TagCloud or ListPages instead.

Avoiding Pitfalls

Document your Tags - Doing so will let your user know which tags have a functional purpose, or which ones have added weight. If you add the documentation to your tag-page content, itself, then you can save yourself a lot of trouble from the beginning. Additionally, by creating a help page that "includes" the tags and their documentation via a ListPages module, then you can have a single page that lists the purpose of all of your tags.
Know your Users - If you know which tags are likely to be used, then create them ahead of time.
Perform Regular Maintenance - Pay attention to new tags. If a new tag has become popular, add it to your tag-pages.
Educate your Users - Direct Users to the help for tags or your guidelines for page edits. Letting them know in advance is a great way to avoid misconceptions.
Use your Hierarchy - Completely invisible tags need a partially visible parent. Otherwise, they will become inaccessible should they ever be forgotten, changed, etc.

How to Protect your Tags

Creating Protected Tags

Decide on a category to place your tag pages. For the following examples, we will use "tags". This may be either a new category or one that is relatively unused, such as admin or system. The category must be one that is visible through ListPages. I recommend using a separate category for several reasons:
- It allows you to set up a template if necessary for documentation
- It allows you to query only tag-pages, if necessary.
Decide on a hidden tag that you will use to tag your tag-pages. This can be anything you would like, as long as your admins and moderators can easily remember what it is. For examples in this How-To, we will use "_protected"
Create a page for your protected tag in the chosen category. For our example, you would create a page named "tags:_protected". You don't have to enter any content for the pages, just create and then save. Next, tag the page with the protected tag. This is so that users cannot accidentally find your hidden tag.
Create a page for any and all tags that you want to enhance your navigation. All of the pages must be in the chosen category. Tag this tag-page with the name of the tag. If the tag is protected, also tag it as "_protected". Depending on your tag and its protection status will determine the level of protection.
- Visible to All - Make an unhidden tag and do not tag it as "_protected"
- Visible to Clouds/Invisible to Tagged Pages - Unhidden tag that is tagged as "_protected"
- Invisible to Clouds/Visible to Tagged Pages - Hidden tag that is not tagged as "_protected"
- Invisible to All - Hidden Tag that is tagged as "_protected"
Repeat until complete.

Creating a new Page Tags interface

Add the following code to any templates that you wish to restrict the functionality to. Note the [[div class="public-tags"]] before the ListPages. This is important, because the prependLine argument does not allow you to input classes.

[[div class="public-tags"]]
[[module ListPages category="tags" tags="%%tags%% -_protected" separate="false"]]
* [/system:page-tags/tag/%%title%% %%page_name%%]
[[/module]]
[[/div]]

Hiding the old Page Tags interface

Add the following line to the CSS for your theme:

.page-tags{display:none; }

Additional Information

Pertinent DOM structure (for CSS and JS)

#main-content
- #page-content
  - .public-tags
    - .list-pages-box
      - ul
        
        li
        
        a

Author

FuzzicalLogic FuzzicalLogic . Please visit his/her userPage.

Please note that %%date%% and %%date_edited%% are no longer recommended and should be replaced by
%%created_at%% and %%updated_at%%, respectively.

If you'd like to show the date of the most recent comment, you can use the new variable %%commented_at%%.

%%date%% Variable and format Parameter

Modules Feed, FrontForum, ListPages, and “live” templates support an optional format parameter for the custom-format %%date%% variable. Module ListPages, and “live” templates also support this optional format parameter for the custom-format %%date_edited%% variable.

In addition, also the [[date …]] tag makes use of the %modifiers documented here.

The documentation for module Feed, module FrontForum, module ListPages, and “live” templates states that the %%date%% (or %%date_edited%%) format parameter prints the “date with a custom format. Most tokens from php's strftime are accepted”.

In this How-To you'll find a full documentation for the %%date%% (and %%date_edited%%) variable.

Syntax

The syntax for the %%date%% and %%date_edited%% variable is

%%date<|<format><|agohover>>%%
%%date_edited<|<format><|agohover>>%%

where

< … > denote optional parameters
“|” must be typed as is, with no blank between %%date and “|”
format is an arbitrary text string that may include %modifiers , which are replaced by an actual (part of the) date or time. If not specified, format defaults to “%e %b %Y, %H:%M %Z”
agohover when specified displays a “hovering” text when the mouse is moved over any part of the displayed format string. The hovering text — “nn seconds/minutes/hours/days ago” — is, except for a trailing “ ago”, identical to the %O modifier explained below.

Examples

Here are some examples how to use %%date%%:

What you type … What you get …

%%date%%

07 Jul 2025 20:56

%%date|On %e.%m.%Y at %H:%M:%S%%

31 Jan 2015 23:21

%%date|%c|agohover%%

19 Jan 2010 23:25

%%date|the time of the post|agohover%%

22 Jun 2009 19:49

Note: Try moving the mouse over the last two examples to view the “hovering” text.

%Modifiers

The following %modifiers can be used within the format parameter:

Modifier	Description	Example
`%a`	abbreviated weekday name (3 letters)	09 Mar 2009 12:04
`%A`	full weekday name	09 Mar 2009 12:04
`%b`	abbreviated month name (3 letters)	09 Mar 2009 12:04
`%B`	full month name	09 Mar 2009 12:04
`%c`	local date representation	09 Mar 2009 12:04
`%d`	day of the month (01...31)	09 Mar 2009 12:04
`%D`	is equivalent to “%m/%d/%y”	09 Mar 2009 12:04
`%e`	day of the month (1…9, 10...31)	09 Mar 2009 12:04
`%H`	hours (00…23)	09 Mar 2009 12:04
`%I`	hours (00…12)	09 Mar 2009 12:04
`%m`	month (01...12)	09 Mar 2009 12:04
`%M`	minutes (00…59)	09 Mar 2009 12:04
`%O`	nn seconds/minutes/hours/days	09 Mar 2009 12:04
`%p`	AM/PM	09 Mar 2009 12:04
`%r`	is equivalent to “%I:%M:%S %p”	09 Mar 2009 12:04
`%R`	is equivalent to “%H:%M”	09 Mar 2009 12:04
`%S`	seconds (00…59)	09 Mar 2009 12:04
`%T`	is equivalent to “%H:%M:%S”	09 Mar 2009 12:04
`%y`	year (00…99)	09 Mar 2009 12:04
`%Y`	year (1970…2999)	09 Mar 2009 12:04
`%z %Z`	time zone	09 Mar 2009 12:04

The above list is exhaustive, no other %modifiers are recognized.

Backlinks

Author

ErichSteinboeck ErichSteinboeck . Please visit his/her userPage.

This is an old wish (http://feedback.wikidot.com/wish:846) to select only pages from the logged in user in ListPages module.
In the comments of this wish the solution is demonstrated [user Venryx Venryx ), but I have never seen this.

Thanks to user SimonHDickinson SimonHDickinson who asked for this possibility on the community forum .

I created a test on our community-playground for demonstration ( it shows only my own pages): http://community-playground.wikidot.com/listpages-for-logged-in-user-only
The trick is working with the module "ListUsers" - which returns the logged in "user-id" , and than linking to an extra page with the ListPages module selecting the "created_by" over the linking URL !

[module ListUsers users="."]]
[*http://community-playground.wikidot.com/listpages-for-logged-in-user-only1/created_by/%%name%% See your own pages]
[[/module]]
<<-- this is the important trick where you can built in an extra page "listpages-for-logged-in-user-only1" with a standard text of your ListPages module the used include with the variable logged in "Name" ,
and the called ( by link) page could use the ListPages using the found logged in user as a variable in the url:
[[module ListPages order="created_at desc" category="*" created_by="@URL" separate="false" prependLine="||~ Title ||~ User ||~ at ||" appendline="||||||||~ ||" ]]
||%%title_linked%% || %%created_by%% || %%created_at%% ||
[[/module]]

In the community forum there were the questions how to find pages "with no parenting".. (example: http://community.wikidot.com/forum/t-1346602/finding-up-parented-pages )

Solution

The solution is a page with ListPages module selecting such pages without a parent and listing them:
using the

Parent page selector: "-" means pages with no parent page

that means an attribute parent="-" is enough to show all pages of category="*" ( all) without a parent

[[module ListPages separate="no" limit="999" parent="-" category="*"]]
%%title_linked%% - [[user %%created_by%%]] - %%created_at%%
[[/module]]

see also the documentation: https://www.wikidot.com/doc-modules:listpages-module

Example

Here the example with the category "howto":

[[module ListPages separate="no" limit="999" parent="-" category="howto"]]
%%title_linked%% - [[user %%created_by%%]] - %%created_at%%
[[/module]]

The ListPages module does not work recursively.

Author

Helmut_pdorf Helmut_pdorf . Please visit his/her userPage.

Table of Contents

Understanding prependLine, appendLine, and separate

This pages shows in a little "cloud" the titles of all pages in one category ("featured") running from left to right…

This is the list of the titles of all "featured" sites in the category "featured" on our community wiki.

For the idea of a page-cloud of "one" tag ( which tag is used on which page) this can be used too. with the tags="…" selector
(coming from the post http://community.wikidot.com/forum/t-565771/listpages-module-on-a-single-line#post-1566591)

Important is only the separate="no" and the [[div style="float:left;borde...;"]] before the one listing argument ( title)

Complete list

This is the list of the titles of all "featured" sites in the category "featured" on our community wiki.

[[div style="width:80%;"]]
[[module ListPages separate="no" limit="200" perPage="100" category="featured" order="title"]]
[[div style="float:left;border:1px silver solid;margin:5px;padding:2px;"]]
 %%title_linked%% 
[[/div]]
[[/module]]
[[div style="clear:left"]]
[[/div]]
[[/div]]

The ListPages module does not work recursively.

Tagged with "game"

This is the list of the titles of all "featured" sites in the category "featured" on our community wiki with the tags="game".

[[div style="width:80%;"]]
[[module ListPages separate="no" limit="200" perPage="100" category="featured" order="title" tags="game"]]
[[div style="float:left;border:1px silver solid;margin:5px;padding:2px;"]]
 %%title_linked%% 
[[/div]]
[[/module]]
[[div style="clear:left"]]
[[/div]]
[[/div]]

The ListPages module does not work recursively.

Tagged with "wikidot"

This is the list of the titles of all "featured" sites in the category "featured" on our community wiki with the tags="wikidot".

[[div style="width:80%;"]]
[[module ListPages separate="no" limit="200" perPage="100" category="featured" order="title" tags="wikidot"]]
[[div style="float:left;border:1px silver solid;margin:5px;padding:2px;"]]
 %%title_linked%% 
[[/div]]
[[/module]]
[[div style="clear:left"]]
[[/div]]
[[/div]]

The ListPages module does not work recursively.

When using module ListPages to select pages by specific criteria, there are two possible outcomes:

at least one page matches the criteria (resulting in a list of pages to be displayed), or
none of the pages match (resulting in nothing to be displayed)

You'd sometimes want the heading text for the list of pages to automatically adapt to the above situations, e. g. to show a heading text like

“Below you'll find a list of pages” if one or more pages are displayed, and
“No pages match” if ListPages does not display any pages

Here is a way, how you can do that.

Example

Click on a tag to list Community Blog pages tagged with any tag, listpages, howto, xyzzy

The ListPages module does not work recursively.

This is how the above example was coded:

[[module ListPages tag="@URL" category="blog" limit="10" separate="false"
appendLine="//No pages are tagged with the selected tag//[!----]"]]
//Below you'll find a list of pages tagged with the selected tag//
[!----]
# %%linked_title%%: %%tags%%
[!--
[[/module]]

How it Works

Because the "pages available" code is within the ListPages body, it will only display if there are any pages matching the ListPages criteria. Hidden comments are used to ignore the "pages available" message for every page after the first one — the ending [!-- code of the ListPages body is responsible for this. However, when the last page of the matching criteria is displayed, the ending [!-- code will instead hide the "pages unavailable" message.
Note: you must type the shown Wikidot comments ([!----]) and ([!--) exactly as-is. They are required to perform the desired function.

[[module ListPages selection-criteria separate="false"
appendLine="heading-text-to-be-shown-if-no-pages-are-displayed[!----]"]]
heading-text-to-be-shown-if-at-least-one-page-is-displayed
[!----]
listpages-body-that-usually-contains-%%…%%-variables
[!--
[[/module]]

Backlinks

Authors

ErichSteinboeck ErichSteinboeck . Please visit his/her userPage.

James Kanjo James Kanjo . Please visit his/her userPage.

The ListPages module is an incredibly powerful tool that easily lists pages according to specific criteria. This is useful for wikis with massive contributions, personal blogs, notebooks, and more. One of the best parts is that the displayed info on each page can be formatted to your tastes. Making the pages display in a customized table, however, can be sort of tricky. In this how-to, we will show you how to quickly make a custom table which displays your pages and their respective info.

Understanding prependLine, appendLine, and separate

First, you should know about three very special ListPages attributes which makes table creation possible. Those attributes are the prependLine, appendLine, and separate. Simply, prependLine defines what content comes before the displayed list. The appendLine, in contrast, defines content that comes after the displayed list. These will allow you to open and close tables later in the tutorial.

The other attribute is separate. By default, when the module lists your pages, the terms are broken up into individual div blocks. This puts spaces in between entries. What you want for a table to display correctly, however, is for those spaces to disappear. Fortunately, applying separate="false" as a criterion will eliminate this mysterious space and hence make tables possible.

You can see these three commands in action below:

The ListPages module does not work recursively.

Here is the code:

[[module ListPages category="howto" limit="5" prependLine="How Tos" appendLine="There are more..." separate="false"]]
* %%title_linked%%
[[/module]]

The Simple Table

Before going on to complex tables, let's try to understand how this works. Pretend that we have three how-tos to list, and we want them displayed in a table like the below:

Title	Author	Age
Title 1	Author	Age
Title 2	Author	Age
Title 3	Author	Age

This is called a simple table, since it uses the simple table syntax (see simple tables). And interestingly, they are simple to construct with ListPages. The headings can be defined in the prependLine section of the attributes. Since simple tables do not need to be closed, appendLine for now will sit out. The separate="false", however, is a must!

The following code will do the trick:

[[module ListPages category="howto" limit="3" prependLine="||~ Title||~ Author||~ Age||" separate="false"]]
||%%title_linked%%||%%created_by%%||%%created_at|%O old%%||
[[/module]]

This will generate a table, shown below:

The ListPages module does not work recursively.

Hopefully you can see that table creation in ListPages is not terribly difficult. However, the goal is to make a customized table where you can define things like width and color. Let's see how to do that.

Custom Tables at Last

Let's begin with the end in mind. We want a table using ListPages that looks like this:

The ListPages module does not work recursively.

So, using the above knowledge on ListPages, its attributes, and simple table creation, let's find a way to make this work.

Step 1: Make an Include

First, you need to make an incomplete table. That's right: incomplete. When we stick it into the ListPages module, the module will complete the table for us, so for now, we want to make just part of the table, namely the headings.

Make a separate page and title it whatever you want. For this tutorial, we'll call this page inc:custom-table. On this page, you are going to make the first row of the table, which constitutes the headings. When you are making this table, do not close the table. Essentially, what you will have is an opened table with a full row, like the below:

[[table style="width: 100%;"]][[row style="font-weight: bold; background-color: #B8D1DD;"]][[cell style="padding: 0 2px; width: 50%;"]]Title[[/cell]][[cell style="padding: 0 2px; width: 25%; text-align: center;"]]Author[[/cell]][[cell style="padding: 0 2px; text-align: right;"]]Age[[/cell]][[/row]]

We closed the row, but not the table. Save that page and remember the page name.

Step 2: Define prependLine

Now, we are going to install this heading into the ListPages using prependLine.

Wait a minute… why did we make a separate page for this? Could we have just opened the table by directly putting the code into prependLine? The answer is no, unless you have no styling or classes. When you define your table and then additionally define a style, you are using quotes (""). ListPages uses these same quotes! Therefore, the module might confuse the beginning of a style statement with the end of an attribute definition. Therefore, making that separate page was entirely necessary.

Here is what you do: put this into the prependLine.

prependLine="[[include inc:custom-table]]"

Note: Replace inc:custom-table with the page name (in the URL) of the page you created in step 1.

This way, ListPages will insert your heading without the interference additional quotes might pose.

Step 3: Define appendLine and separate

This is easier. Place the following into your list of ListPages criteria:

appendLine="[[/table]]" separate="false"

Step 4: Define the Body

Now for the meat of the table. In the simple table example, you saw how we used the simple table syntax between the [[module]][[/module]] tags to help construct a table. If we are using a custom table, we are going to use the custom table syntax.

Each item will be its own row, so the "sandwiched" part will have a single [[row]] and [[/row]], with cells in between corresponding to the headings. You can style this however you wish. Just make sure your headings and body match!

Here is the code we used above for the table:

[[row]][[cell style="vertical-align: top;"]]**%%title_linked%%**[[/cell]][[cell style="vertical-align: top; text-align: center;"]]%%created_by%%[[/cell]][[cell style="vertical-align: top; text-align: right;"]]%%created_at|%O old%%[[/cell]][[/row]]

Step 5: Admire your Handiwork

After that, you are done! You can double check that the table looks the way you want and tweak it if it needs improvement. You can furthermore add embellishments and other styling, such as the Table Alterations snippet which will help you alternate row colors.

Here is the overall code that we used for the table:

[[module ListPages category="howto" limit="5" prependLine="[[include inc:custom-table]]" appendLine="[[/table]]" separate="false"]]
[[row]][[cell style="vertical-align: top;"]]**%%title_linked%%**[[/cell]][[cell style="vertical-align: top; text-align: center;"]]%%created_by%%[[/cell]][[cell style="vertical-align: top; text-align: right;"]]%%created_at|%O old%%[[/cell]][[/row]]
[[/module]]

Additional Help

If you have any questions, be sure to ask on the forums .

CountPages module

Beginning August 7th, 2009, the instructions contained on this page are no longer recommended, and simply will not work for sites with more than 250 pages due to a pagination limit imposed by Wikidot to reduce server stress.

As a much better alternative, a new module has been created specifically for the task of counting pages! It is the CountPages module!

This new module works in a similar way to ListPages but only has one variable available — %%count%%.

Click here to read more!

Did you ever wish to count the number of pages in a category? Or count all pages of your wiki?

Table of Contents

Understanding prependLine, appendLine, and separate