Snippets is a site both created by Wikidot and its community. This is a place where you can find (or add) code snippets that can be used when creating your own pages at Wikidot.com. Code snippets are easy way to improve your own wiki sites and to make it more attractive and functional. Embedding media, both audio and video, adding spreadsheets, making eye candy menus is as easy as never before.
Add a new snippet or solution
Adding a snippet is easy.
- first think of some name for your snippet
- create a page (using the form below)
- assign page tags to the created page
- please do not use this site for testing. There is a Sandbox site for that.
Highest Rated Snippets
Collapsible Text Block (Rating: 262, Comments: 28)
This solutions will show you how to make nice collapsible text blocks. What for? See the examples, you should know.
Foldable List (Rating: 193, Comments: 16)
Do you like a foldable list from My Account or Site Manager? Create your own!
Layout With Tables (Rating: 126, Comments: 88)
A nice way to add advanced layout control using the [[table]] tag. The example uses the style attribute for the whole table and particular cells to adjust layout.
Tabs (Rating: 125, Comments: 57)
This solution will show you how to create tabs.
Include Any Page (Rating: 104, Comments: 36)
Here is a way to include ANY page within your Wiki page using an [[iframe]] element.
Google Gadgets (Rating: 97, Comments: 27)
Google now offers tons of gadgets one can embed into web pages. The directory of gadgets is available at:
Automatic Sitemap (Rating: 96, Comments: 21)
It is quite important to have a nice and clean structure of the site. One of the best ways to do maintain such a structure is to use the "parent page" relation. This allows to:
- display breadcrumb navigation element within pages
- make nice sitemaps and listings
Extra Side Bar (Rating: 91, Comments: 8)
Creates an extra side-bar using the floating div element. It is quite easy if you know CSS.
Multicolumn Layout (Rating: 85, Comments: 26)
OK, so you want a multicolumn layout. Unfortunately there are no special wiki tags for multicolumn layout but the result can be easily achieved using the [[div]] tags and adding CSS style to it.
Adding A Site Logo (Rating: 84, Comments: 34)
This snippet lets you add a logo to the site by creating a custom CSS.
Recently Added Snippets
Sorted-ListPages-List (Rating: 0, Comments: 0)
With this include of a little Link-List you can call at the top of a ListPages-Output (with standard-fields) all the posssible different orders of such a ListPage module output. Only the order="@URL" is neccessary and a little include statement to create a "selfcalling" list of the site and page.
Toggle Tag (Rating: 2, Comments: 4)
You can utilize a combination of iftags and set-tags in order to create a toggle tag button, one that will add a tag to the page if it isn't already there or remove it if it is. The amount of code for this can be slightly unwieldy and difficult to read, however:
Pretty Tables (Rating: 2, Comments: 1)
A very pretty table layout that I thought I might share with you all.
Custom Page Title (Rating: 0, Comments: 2)
In a wiki that I'm a part of, we have very little control over our page titles. If you have a similar issue, the following code should point you in the right direction to create custom titles that can utilize WikiDot text decoration such as colour, weight, and italics.
Hide Tags (Rating: 5, Comments: 2)
The Tag Cloud module does not allow for the hiding of specific tags. This CSI allows you to specify which tag names you want hidden up to 99.
Custom HTML Blocks (Rating: 1, Comments: 1)
Per-User CSS (Rating: 6, Comments: 2)
The basic purpose for this technique is so we can apply CSS rules that override some default CSS settings on a per-user basis. For the purposes of this article, we'll create a couple of CSS classes that will hide data for all users by default. We'll create 2 classes — one for hiding block elements and one for hiding inline elements. Then, we add the CSS for our default state to the nav:side page (would also work with nav:top)). We'll also add a ListUsers module that will render the CSS to override the default for individual users that we specify.
404 (Page does not exist) Redirect (Rating: 6, Comments: 15)
Note: as of the 19th November 2012, Wikidot has implemented a full solution which no longer requires this snippet. View their solution here.
Genuinely Random Link Generator (Rating: 4, Comments: 2)
Up until now, there were two ways to create random links:
- Display all of the pages in a mini-block, filled with tiny, black rectangles which link to each of the pages. Because they're so small and lack identification, the person ends up navigating to an essentially random page.
- Have a link to the page 'random', where you add the ListPages module to sort the pages and redirect to the first of the list. This is genuinely random, but the 'randomly-sorted list' is only re-shuffled every minute, meaning that you can't keep clicking it to see more randomly.
Per Category CSS Module (Rating: 2, Comments: 1)
Something that's slightly annoying about Wikidot is that when it comes to creating new pages that previously didn't exist, the Live Template isn't taken into account. That is, if you use the CSS module in the Live Template, then that isn't applied to the page until after you save the page. All proceeding edits work fine, but the initial edit doesn't look how it's supposed to.