Getting Started Guide

Posted by bcammo on 05 Jul 2011 04:51, last edited by Helmut_pdorf on 03 Sep 2012 07:44

Tags:

rating: +6+x

New to Wikidot? Have a read below to help get yourself acquainted with the Wikidot way of thinking.

Think something important's missing? You can edit this page.

Categories

Pages on your site can be divided up into categories, for which you can set different themes, user permissions (i.e. who can edit, view, etc), navigation elements and more. You don't need to do anything special to create a new category - they are a part of the URL and are automatically created if you create a new page that uses a new category.

http://mysite.wikidot.com/category:pagename

Anything before the first colon is the category, everything after it is the page name. In the example below, animals is the category, and cat is the page name. 
http://mysite.wikidot.com/animals:cat

You cannot nest categories. In the example below, animals is the category, cat:whiskers is the page name. There is no sub-category cat. 
http://mysite.wikidot.com/animals:cat:whiskers

Page name vs title

A page's name is what appears in your browser's address bar. A page's title is what fills the <title> attribute in the rendered HTML. These are important distinctions to make when using %%variables%% in the ListPages module or a Live Template (see below). Take for example this page:

  • %%title%%: Getting Started Guide
  • %%name%%: getting-started-guide
  • %%fullname%%: howto:getting-started-guide

Normal vs 'Hidden' pages

Any page name that begins with an underscore will create a 'hidden' page (e.g. category:_hiddenpage). Hidden pages:

  • by default do not appear in ListPages module output
  • by default are not counted as a part of the total by the ListPages & CountPages modules
  • are not affected by live templates (see below)
  • are not auto-numbered, even in an auto-numbered category (more on that later)

You cannot create a hidden page via the NewPage module (it will remove the underscore). Instead, you should enter the page name into your browser's address bar, load the page and then click 'create page'.

(Old) Templates

Any page you create in the template category becomes a template. You can select templates when editing a page to pre-fill the editor box with the content of the template (i.e. to help you remember how to format something). Templates can be defined by the NewPage module (so that when you create a new page, the template is already there), or assigned to categories in the site manager.
These sorts of templates aren't particularly useful. Live templates (below) are much better.

Live Templates

Live templates allow you to control the layout & content of all pages in a certain category. Live templates always reside on the _template page of each category (e.g. blog:_template). Live templates are a type of hidden page, and as mentioned above, you can't use the NewPage module to create a hidden page.
The content of a live template will define how each page in that category will be rendered. You can use special variables (defined here) to add extra content to the page. Use the %%content%% variable to display the page's content (i.e. if you don't have %%content%% in your live template, then each page in that category will not show the page content).
Take for example the following live template:

%%content%% 

Created by %%created_by%% on %%created_at%%.

If I created a page in that category, then at the bottom would appear "Created by bcammo on 31 May 2011, 12:18 GMT+1000".
Live templates are a powerful way to control the layout of your site.

Data forms

Wikidot data forms allow you to add structured content to your wiki. The data form itself resides in the live template of a category. Every page in that category will show the data form fields when editing the page, rather than the normal text editor. If you place ==== before the form declaration, it will hide the form from pages and only show the variables you define. Below is an example of a form you might put in the live template of a bug tracker.

%%title%%
Bug reported by %%form_data{name}%% created on %%created_at%%. 
This bug report is for version %%form_data{version}%%.

%%bug%%
====
[[form]]
fields:
  name:
    type: text
    label: name
  version:
    type: select
    label: choose version
      1: 1.0
      2: 2.0
      3: 3.0
  bug:
    type: text
    label: describe the bug
[[/form]]

Auto-numbering

Wikidot allows you to auto-number categories. If auto-numbering is turned on for a category, then every new page created in the category will be given a sequential page name (e.g. blog:1, blog:2) automatically. To turn on auto-numbering, go to your site manager, Autonumbering of pages > '+ add autonumbering', then choose an existing category or create a new one. Auto-numbering works well with data forms.
Note: hidden pages ( with an underscore as the frist character in her name) like "live" templates ("category:_template") are not affected by the autonumbering.

CSS Themes

Wikidot uses CSS to allow you to control the appearance of your site. The built themes are ugly - for a quick, good looking theme, head over to themes.wikidot.com where you'll find some nicer themes. Copy the URL provided on the theme's page, and paste in the site manager (admin:manage on your site) under Appearance > Themes > 'Or use an external theme', then click save. You can define different themes for each category on your site. If a category does not have a theme explicitly defined, it will use the _default theme.

The other option is to use your own CSS. In this case, the recommended way to handle the CSS is to create a new page on your site (e.g. admin:themes) with the CSS between code blocks.

[[code type="css"]]
/* Put your CSS here */
[[/code]]

Then, in the site manager under Appearance > Themes > 'Or use an external theme' use the URL http://mysite.wdfiles.com/local--code/admin:themes/1. To update the CSS, all you need to do is edit the admin:themes page - you're site's theme will be updated automatically. The advantage of this method is that the wiki page will automatically maintain a complete history of your theme - so if you make a mistake, you can easily revert it to a previous version.

HTML

For security reasons, you cannot include pure HTML/Javascript in your wiki page. Instead, you must use the [[html]] block, which creates an iframe.

[[html]]
<!-- Define HTML here -->
[[/html]]

Divs and spans

To help the layout of your content, you can use divs and spans. For each div or span element, you can define classes and styles, but you cannot define an id.

[[div class="infobox"]]
This is my infobox.
[[/div]]

[[span style="color:red; font-size:15px;"]]Warning![[/span]]

You can then use CSS in a CSS module or your site's theme to change the appearance of these classes.

Related articles

Comments

Add a New Comment
Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution-Share Alike 2.5 License.