Web CMS

Access to server and web folder

All group members should have full access to the afs web folder. You can login over ssh or sshfs to a hep-server:

  • With ssh you operate only in a text terminal. E.g. you can edit text files. You can do everything in the terminal for the CMS Pico system!
  • The command sshfs enables mounting the afs folder. So you can browse it and edit

sshfs USERNAME@heplx01.OAW-ADDRESS:. /home/USERNAME2/FOLDER/ -o idmap=user

or

ssh USERNAME@heplx01.OAW-ADDRESS

OAW-ADDRESS is for spam-protection.

Go to the folder of the Pico CMS:

cd /afs/hephy.at/project/cmstrigger/www/cmstrigger

Files and folders in Pico

In the Pico CMS folder we have access to

  • Files (images, PDFs etc.) are stored in sub dir /files/
  • Web content (pages) are stored in /content/

On the top level we have 4 main points

  • OVERVIEW,
  • UPGRADE,
  • ...

See The index page

For these 4 points, there are 4 files:

  • /content/index.md
  • /content/help/index.md,
  • /content/legacy/index.md,
  • /content/upgrade/index.md

"index.md" defines the menu point on the level of its folder. Since /content/index.md is in the top level folder (the working folder "content" cannot be a menu point), it is a top level point as the other 3 index.md files in sub folders. Any other md-file anyname.md defines a sub level menu point under the parent by index.md in the same folder.

Names and content

Levels are defined by folders, and their md files (index.md and all others). The content, name and order (to be sorted in the table of content) of menu points are defined in the .md-file itself.

A md-file looks like this (example /content/overview/cms-trigger/index.md):

/*
Title: CMS Trigger
Placing: 1
*/
#CMS Trigger
The CMS Trigger Group of the Institute ...

See Overview > CMS Trigger page

Following is mandatory in our md-files:

  • header (in a comment block)
    • Title: The title of the menu point (displayed in the table of contents left)
    • Placing: The placing of the menu point amongst others with the same parent. For example, choose 10, 20, 30, ... to make shifting and inserting easy.
  • content: Add text in markdown format.

Update web content (one more time)

you want to

  • change the sorting, the name or content of a menu point: just edit the md-file (index.md) of the (sub)folder indicating the menu point.
  • add a menu point: just add a folder (shortcut name for the folder to keep it small) and put the index.md inside. Then add "Title", "Placing" in a comment block, and content just below. Example:

mkdir /content/upgrade/myComponent

"add" /content/upgrade/myComponent/index.md

"edit" /content/upgrade/myComponent/index.md

That is it. You do not need to write HTML or change something in a database. When the md-file is in the content folder (anywhere) the web server parses it everytime the web page is requested by a browser.

Folder names and index.html does not influence the web page. Keep in mind that you add links relative to the Pico working dir,e.g.

src="files/legacy/fdl/fdl.jpg"

Backup

The AFS file system is being copied to a backup on a week-basis.

Further, the CMS (the system itself, and content and files folder) is in our Subversion system https://forge.hephy.OAW-ADDRESS.

Subversion location of CMS Trigger Web CMS:

https://forge.hephy.OAW-ADDRESS/scm/svn/project-cmstrigger/web

OAW-ADDRESS is for spam-protection.

ATTENTION: You need to make a user profile there. The service does not communicate with the profile server in our net.

Disc Capacity

The web folder is set to a limit of 1000 MB, approx 600 MB for us.

The markdown language

The plain text in markdown is transformed into valid HTML.

some hints

Make spacing between paragraphs and before and after lists, code blocks etc. Line breaks do not get into the HTML output.


Make a code block by putting 4 spaces or a tab in front of each line:

____first line of code

____second ...

[_ is a space]

first line of code
second ...

Lists are easy:

* item (make a spacing before!)
* item

1. item 1
2. item 2

...will be converted into:

  • item (make a spacing before!)
  • item
  1. item 1
  2. item 2

A line with "#" at the beginning is a header. "#" is biggest (1st level), "##" for 2.level, etc.


A line is just "---" or "- - -" etc. and looks like the lines here (make a spacing!).


insert image:

! [text if image not available] (http://cms.web.cern.ch/sites/cms.web.cern.ch/files/styles/small/public/field/image/0611042_01-A4-at-140001.jpg "CMS Detector")

...will be converted into:

text if image not available


make links:

a link

http://cms.web.cern.ch

a relative link

...will be converted into:

a link

http://cms.web.cern.ch

a relative link


Pico CMS

Pico is a stupidly simple, blazing fast, flat file CMS.

Creating Content

Pico is a flat file CMS, this means there is no administration backend and database to deal with. You simply create .md files in the "content" folder and that becomes a page. For example, this file is called index.md and is shown as the main landing page.

If you create a folder within the content folder (e.g. content/sub) and put an index.md inside it, you can access that folder at the URL http://yousite.com/sub. If you want another page within the sub folder, simply create a text file with the corresponding name (e.g. content/sub/page.md) and you will be able to access it from the URL http://yousite.com/sub/page. Below we've shown some examples of content locations and their corresponing URL's:

Physical LocationURL
content/index.md/
content/sub.md/sub
content/sub/index.md/sub (same as above)
content/sub/page.md/sub/page
content/a/very/long/url.md/a/very/long/url

If a file cannot be found, the file content/404.md will be shown.

Text File Markup

Text files are marked up using Markdown. They can also contain regular HTML.

At the top of text files you can place a block comment and specify certain attributes of the page. For example:

These values will be contained in the {{ meta }} variable in themes (see below).

There are also certain variables that you can use in your text files:

  • %base_url% - The URL to your Pico site

Themes

You can create themes for your Pico installation in the "themes" folder. Check out the default theme for an example of a theme. Pico uses Twig for it's templating engine. You can select your theme by setting the $config['theme'] variable in config.php to your theme folder.

All themes must include an index.html file to define the HTML structure of the theme. Below are the Twig variables that are available to use in your theme:

  • {{ config }} - Conatins the values you set in config.php (e.g. {{ config.theme }} = "default")
  • {{ base_dir }} - The path to your Pico root directory
  • {{ base_url }} - The URL to your Pico site
  • {{ theme_dir }} - The path to the Pico active theme directory
  • {{ theme_url }} - The URL to the Pico active theme directory
  • {{ site_title }} - Shortcut to the site title (defined in config.php)
  • {{ meta }} - Contains the meta values from the current page
    • {{ meta.title }}
    • {{ meta.description }}
    • {{ meta.author }}
    • {{ meta.date }}
    • {{ meta.date_formatted }}
    • {{ meta.robots }}
  • {{ content }} - The content of the current page (after it has been processed through Markdown)
  • {{ pages }} - A collection of all the content in your site
    • {{ page.title }}
    • {{ page.url }}
    • {{ page.author }}
    • {{ page.date }}
    • {{ page.date_formatted }}
    • {{ page.content }}
    • {{ page.excerpt }}
  • {{ prev_page }} - A page object of the previous page (relative to current_page)
  • {{ current_page }} - A page object of the current_page
  • {{ next_page }} - A page object of the next page (relative to current_page)
  • {{ is_front_page }} - A boolean flag for the front page

Pages can be used like:

<ul class="nav">
    {% for page in pages %}
    <li><a href="{{ page.url }}">{{ page.title }}</a></li>
    {% endfor %}
</ul>

Plugins

See http://pico.dev7studios.com/plugins

Config

You can override the default Pico settings (and add your own custom settings) by editing config.php in the root Pico directory. The config.php file lists all of the settings and their defaults. To override a setting, simply uncomment it in config.php and set your custom value.

Documentation

For more help have a look at the Pico documentation at http://picocms.org/docs