Base Tree

It is advisable to first create a seperate directory in which you plan to store both the input and output of clcms.

mkdir my_site

cd my_site/

Content Directory

In the base dir, we will create a content dir (the output dir will be created by clcms if it does not exist yet).

mkdir in

cd in/

Pages

Let's say we want to create 3 pages: a news page, an about page, and a Link page.

We also want a standard menu, but no fancy layout for now.

So, let's create the containers for those pages, shall we?

mkdir News

mkdir About

mkdir Links

If we want these pages to appear on the site in a fixed order, we have to create a page.attr file in each directory, containing the line

sort order: X

where X is a number that represents the place the page should get.

Since we have no news yet, let's start with the About page.

About Page

First go to the about page.

cd About/

Let's say that the order of the contents of this page does not matter for us. We'll specify no sort order, and clcms will order them by last modified date. Later runs of clcms will keep this original order (by default).

Page content must be put in so-called .page files, you do not have to type html tags, just type some lines. You can specify markup by using Wiki style syntax See Wiki Markup for more information on this.

So let's create one:

$EDITOR About\ Me.page

Just write some nice lines about what you do, or not.

$EDITOR About\ this\ site.page

This is the place to put those praises you have for the system you have created your beautiful site with (for the record, that's clcms).

Note that after building the site, the file names up to the dot can be formed into a small in-page submenu, if there is more than one .page file present. An example of this can be seen on the top right of this page, underneath the pageNave box.

For now, we are done here, you can also add other nice stuff about you or your site, but I'll leave that up to you.

Links

Create some nice links in one or more .page files here, you can create a link by using

[[<URL>][<name>]]

Note that a link must be on a complete line without line breaks.

If you want to specify an external link, you can just use http:// in the url.

You can also link to pages in the same site by using ":<id>" instead of an URL:

[[:documentation][]]

If you do not specify a name, the page name will be used. See the page.attr entry in File Types for an explanation about page ids.

There's an optional third argument to page link entries, if you specify

[[<URL>][<name>][<extra>]],

the <extra> part will be copied directly into the <a> tag of the HTML page. This way, you can for instance put in a css class.

News

The last part is telling the world of your great new site, so let's add an entry to the News page.

cd News

$EDITOR newpage.page

And put in some nice lines about you having this great new site (links and references to clcms are appreciated ;) ).

Again, we don't specify a fixed sort order, so newer files will end up before older ones.

In this page, let's say that we do not want to have all .page parts preceded by their file name title, but we do want to have the date automatically added. For this we create a .setup file in the News.1/ directory:

$EDITOR news.setup

in which we put the following lines:

show_submenu = no
show_item_title = no
show_item_title_date = yes

This will tell clcms not to place an in-page submenu in this page, and not add the page item title, but instead use the last modified date of the .page files.

Create the Site

Now that we have our first content, let's see if it works.

Go to the base directory, and run

clcms.py

This should create an out/ dir, with the pages you just created.

Let's see what clcms made of it, and point a webbrowser to file:///<dir>/out/

Since we did not put a .page file or index.html in our base directory, we get the three pages we created in a list. Click on one and then on the index.html there. You should see the page you actually created, albeit without any formatting. View the source to see that there are a few divs: main, content, menu and, if applicable, submenu. To make something nice of it, you can create a default.css in your in/ directory that specifies the layout for these divs. Files that are nog recognized are simply copied to the output directory.

If the standard form is not to your liking, you can always redefine the header and footer macros, and all other macros. But i advise you to look at the examples and read the rest of the documentation before you start doing that.

Have fun!