The #striped pagelist template: basics

The #striped template allows somebody to create a page consisting in several HTML div wrapping PMWiki pages, each one having a particular a coloured background, depending if the page has an even or odd number in the pagelist.

Example of usage

Here is an example of usage of the #striped template, that will produce a page that looks like the previous image :

(:nosidebar:)
(:nocontainer:)
(:nobreadcrumb:)
(:noaction:)
(:pagelist fmt=#striped group=MyGroup coloreven=#379e5e colorodd=#FFF fontcoloreven="white" fontcolorodd="":)

The 4 four lines will hide the sidebar, the breadcrumb, the action bar and the fact that the content of the pages are contained in bootstrap containers. The last line is the real usage of the #striped pagelist template. We can see 3 different parameters taken by the template.

• coloreven is the background color taken by pages with an even page number in the page list
• colorodd is the same but for the odd page numbers
• fontcoloreven is the font color taken by pages with an even page number in the page list
• fontcolorodd is the same but for the odd page numbers

Specific background

The pages included by the #striped template are allowed to define themselves their background, which will override de default background chosen by the template. The background is overriden by the page by defining one Page Text Variable: the variable StripedBackground. This variable can contain everyting that the CSS property background can contain. A page can also use one of its attached images by setting the AttachedBackground Page Text Variable to the name of one of its attached images.

Example

The following page will define its background as a light blue background :

(:StripedBackground:#93bcff:)
(:div class="container":) 
!! Hello World !
(:divend:)

The result of this markup is that the news will be displayed with a light blue background in a pagelist using the #striped template :

Parallax background

The #striped pagelist template also permits to have a parallax image background for the pages it contains. A page can set the Page Text Variable StripedParallax to the url of an image, which will be set as a background image with a parallax effect. The pages can also use an attached image as a parallax background, by setting the variable StripedParallaxAttached to the name of one of its attached images.

Example

The following page will define its background as an image with a parallax effect:

(:StripedParallax: http://website.com/myimage.png:)
(:div class="container":) 
!! Hello World !
(:divend:)