Wikidot Functions

By JEgererJEgerer (1261516698|%a, %b %e at %I:%M%p)

Having pretty much exhausted the blogging opportunities supported by our class sessions I thought I'd shift gears to Wikidot, to explore some of the lesser used… but very cool functions.


Organization Tools and Tips

First fun tool. The table of contents. By simply plugging in the code…

[[toc]]

you'll get a table of contents mapping all your headings and subheadings and best feature… it links to that section. So if you have a long page at a TOC at the top for easy navigation.

Collapsible Text

Google Stuff!

Google has developed a wide array of gadgets on this page:

Google Gadget Page

All you have to do is find what you want, change whatever setting you might want, for instance the frog below was green at first — I wanted black : )

Then you press get code.

This page explains the process in more detail for wikidot.com

Wikidot Gadgets Explanation

After getting the code you simply copy and paste it in between some embedding brackets for which the code is:

[[embed]] Put google code or any code really here. [[/embed]]

Here's a couple examples!

News feed.

Tabview

Now below is one of the most professional looking organization features of the site. Tabview allows you to build an internal organization menu much like you'd have built into your top menu bar. The downside to this tool is it conflicts with alot of other wiki options, so for instance building collapsible text inside your tabview can be difficult.

Google rules!

Column Divisions

You can also divide your page into 2 or more columns with wiki code.

The code for a standard two column layout looks like this:

[[div style="float:left; width: 45%; padding: 0 2%"]]
left column left column left column left column left column
left column left column left column left column left column
[[/div]]
[[div style="float:left; width: 45%; padding: 0 2%"]]
right column right column right column right column right column
right column right column right column right column right column
[[/div]]

While the code for the 3-column design below incorporates some special CSS and looks like, this code can be problematic on some themes so I would use it sparingly if at all.

[[div style="-moz-column-count: 3;-moz-column-gap: 20px;column-count: 3;column-gap: 20px;"]]Text hereeeeee
Here.
Here.
Here.
[[/div]]

Hope these help out with page organization and improvement. I wish I had known about these things at the beginning because it makes for better layouts and higher skim value for any page really.

Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution-NonCommercial-ShareAlike 3.0 License