Choose A Page!

By ErichSteinboeck

Description

Here is the code for a funny “random” page chooser.

Depending on the number of pages on your site (or in the ListPages categories that you specify), you would scale up & down the block of page links with the image width and height attributes and (if you wish so) make the block approximately square with the cell style="width:…" specification.

If image width and height are set to "1", each pixel is a link to one of your pages — probably the most compact way to view your site!

From time to time, if more pages are being added to your site, you might want to revisit all width and height specifications. You also might want to regularly change the ListPages sorting order to make the order of the pages look more “random” to your users.

You may copy Black1x1.png — an image with a single black pixel — to your site, attach it to your page, and adapt the image tag's path. Note that you must specify the page name ([[image page-name/Black1x1.png …]]) to make ListPages work correctly.

Code

[[table]]
[[row]][[cell]]**Choose a page!**[[/cell]]
[[cell style="width:80px"]]
[[module ListPages category="*" separate="no" \
order="pageLengthDesc" perPage="9999"]]
[[image code:choose-a-page/Black1x1.png \
width="8px" height="8px" link="%%page_unix_name%%"]]\
[[/module]]
[[/cell]][[/row]]
[[/table]]

In action

Choose a page!

As snippets.wikidot.com has relatively few pages, have a look at http://sandbox-old.wikidot.com/choose-a-page for a site with a little more more pages. There is also a similar snippet which uses a single url link to a random page.

Rate this solution

If you think this solution is useful — rate it up! Or dump it otherwise.

Small variation

michal frackowiak 1217934926|%e %b %Y, %H:%M %Z|agohover

The snippet is indeed great. We are using it on a few pages now but with a slightly changed code (without any tables).

First of all, you do not need to copy and upload the image file — you can use the one that is uploaded here. Also, you do not have to use tables — we are using styled divs. One example is here:

[[div style="width:100px; margin: 0 auto;"]]
[[module ListPages category="*" separate="no" \
order="pageLengthDesc" perPage="9999"]]
[[image http://snippets.wikidot.com/local--files/code:choose-a-page/Black1x1.png \
width="8px" height="8px" link="%%page_unix_name%%"]]\
[[/module]]
[[/div]]

Great job!

---

Michał Frąckowiak @ Wikidot Inc.
Visit my blog at michalf.me

pieterh 1218884874|%e %b %Y, %H:%M %Z|agohover

I've adapted the idea to show bullets, see http://www.devilswiki.com/. The bullet image is at http://www.devilswiki.com/local--files/nav:side/dot.png. One thing I can't do, which would be fun, is to define a title for the image so it shows - e.g. page name - when the mouse hovers over a dot.

---

The Wikidot Blog | My other works

jhubert 1219472455|%e %b %Y, %H:%M %Z|agohover

Thanks! I used it here. My image is getting rather large… ;)

---

Arcana Wiki - Distilling the Real World for Gaming
Urbis - A World of Cities - an urban fantasy setting of industrial magic
DDI Wiki - Characters and Monsters for your D&D 4E campaign
LiveJournal

Androide23 1220183707|%e %b %Y, %H:%M %Z|agohover

For some reason the image doesn't show up in certain computers (in particular: with the browser firefox in ubuntu)
Just to make you know

Brunhilda 1222436621|%e %b %Y, %H:%M %Z|agohover

I don't like this black square, so I found more dots, in more colors

http://upload.wikimedia.org/wikipedia/commons/5/5e/Dotswirl.gif

(in action: http://istorijska-biblioteka.wikidot.com/start)

Any dot from this page can do, the only thing is that you must convert svg to png or jpg. SVG cannot be seen in Wikidot.

http://commons.wikimedia.org/wiki/Category:Dots

Here are some dots already converted to png:

http://istorijska-biblioteka.wdfiles.com/local--files/isbi:pesak/Gr%C3%A1fico1.png (red)
http://istorijska-biblioteka.wdfiles.com/local--files/isbi:pesak/Gr%C3%A1fico2.png (yellow)
http://istorijska-biblioteka.wdfiles.com/local--files/isbi:pesak/Gr%C3%A1fico3.png (green)

---

The time you enjoy wasting is not wasted time.
Bertrand Russell

last edited on 1222436644|%e %b %Y, %H:%M %Z|agohover by Brunhilda + show more

order="random" now supported

michal frackowiak 1222943447|%e %b %Y, %H:%M %Z|agohover

Now the ListPages module natively supports the order="random" attribute. Combination of the technique above and random ordering gives really random and nicely presented results!

---

Michał Frąckowiak @ Wikidot Inc.
Visit my blog at michalf.me