This is the fourth and for now, final part of a slow tutorial in how to build complex tables and views using the new ListPages. It's based on a new page manager that will eventually let us "manage all pages (rename, delete, tag) from one place", as weneed:55 says. You can play with the work in progress as we develop it.

6. Creating more views

We'll create more views so that you're comfortable with the concept. We're going to add a column that shows the page author, and that links to a view of all pages by that same user.

In the page header, add a column for the author:

    [[cell]]
      [/system:page-manager/order/created_by Author][/system:page-manager/order/created_by%20desc ▼]
    [[/cell]]

And in the ListPages body, add a column to show the %%created_by%% value:

    [[cell class="truncate"]]
      [/system:page-manager/created_by/%%created_by%% %%created_by%%]
    [[/cell]]

We've now added two more views. Try these. You'll see that the first time you show a view, it can take a few seconds. After that the view is cached and it's fast to display.

7. Pop-up windows

The last piece in the puzzle are the pop-up windows that show when you move the mouse over a link. These use CSS code originally written by James Kanjo and Steven Heynderickx.

/*  Pop-up hover text over images or links  */
/*  Use: [[span class="hover"]]Image or link[[span]]Hover text[[/span]][[/span]] */
 
.hover span {
    display: none;
}
.hover:hover span {
    position: absolute;
    display: inline;
    margin: 15px -20px;
    height: auto;
    width: auto;
    background: #eee;
    border: 1px solid #555;
    color: #555;
    padding: 1em;
    font-size: 12px;
}
.hover:hover span span {
    position: relative;
    margin: auto;
    height: auto;
    width: auto;
    border: none;
    padding: 0;
}

Here is how we add a pop-up hint for the author property:

    [[cell style="text-align:right" class="truncate"]]
      [[span class="hover"]][[span]]Show pages created by %%created_by%% _
      [[/span]][/system:page-manager/created_by/%%created_by%% %%created_by%%][[/span]]
    [[/cell]]

And here is a rather more complex pop-up for the page title, which shows additional actions on the page:

      [[span class="hover"]][[span]]**{{%%fullname%%}}** _
        [*/%%fullname%%/edit/true/norender/true/noredirect/true *Edit] | [!-- [[button tags text="Tags"]] | [[button source text="Source"]] | [[button print text="Print"]] | --] [*/%%fullname%%/edit/true/title/%%fullname%% *Retitle]
        [/system:page-manager/category/%%category%% Category: %%category%%] _
        [/system:page-manager/parent/%%parent_fullname%% Parent: %%parent_fullname%%] | [/%%parent_fullname%%/noredirect/true (Jump)] _
        [/system:page-manager/parent/%%fullname%% Children: %%children%%] _
        http://%%title%% _
      [[/span]][/%%fullname%%/noredirect/true %%title%%][[/span]]

Note how we use '_' at the end of the line to create a line break while not inserting a paragraph break. This pop-up builds a menu with actions like 'Edit' and 'Tags' and which links to several other views.

There are a few more tricks I've used on this menu:

• http://%%title%% - show the page name as a link. If the page refers to a Wikidot site name or page, the link is very useful. If not, it's just a bit strange.
• [*/%%fullname%%/edit/true/title/%%fullname%% *Retitle] - edit the page with a new title. This is specifically for giving more sensible titles to hidden pages.

Conclusions

The page manager is a work in progress. There are things that still do not work, and we're waiting for improvements to Wikidot to make a final page manager, which will do things like let you rename and delete files easily. In the meantime, this makes a useful template for other kinds of tools. Experimenting costs very little! You can find the source at the projects forum.