To make the layout of the documents published by
SPIP easier, the system offers a number of «SPIP shortcuts» which:
- simplify matters for users who do not know HTML;
- make it possible for page layout to be processed automatically.
So naturally you can still use HTML code in your SPIP documents, but we advise you to use preferably these few SPIP shortcuts, which are much easier to remember and especially, provide the system with some automated operations.
To start with, we present the simplest and most common shortcuts. For the users who wish to have more control over the layout of their texts, we shall further present more complex versions of these shortcuts.
N.B. The simple shortcuts fairly fulfill most needs, and make online publication almost as easy as writing an email.
- Creating paragraphs
To create paragraphs, you simply leave a blank line, a bit like separating paragraphs in a e-mail (by «skipping» a line).
The simple «line feed» (enter or return) without separating the two paragraphs is insufficient to create a new paragraph (as a matter of fact, it does not even create a line feed).
You can leave several consecutive blank lines without any effect on the layout.
- Creating bulleted or numbered lists
You can create lists in SPIP in the same way as in an e-mail: you only enter a line feed and start the new line with a dash («-»).
Notice that, here, a simple line feed is enough (you can create lists in the same paragraph); but if you leave a blank line before the one beginning with a dash, then a blank line will appear before the list
For example,
will display:
- I like work;
- it fascinates me.
- I can sit and look at it for hours. (Jerome K. Jerome)
Bold and italic
You specify a text in italic by placing it between simple braces: «...some text {in italic} in...».
You specify a text in bold by placing it between double braces: «...some text {{in bold}} in...».
- Paragraph headings
Paragraph headings are titles inside a text that show its structure. In SPIP, they are very simply defined by placing them between treble braces: «{{{Section heading}}}» will display the heading, bold and centred:
Section heading
- Horizontal rule
It is very simple to insert a horizontal rule (or a separation line) across the width of the text: you just insert a line containing only a series of at least four dashes, thus:
returns:
- Hypertext links
You can easily create a hypertext link with the following code:
which becomes
SPIP is an initiative of the minirezo.
(To help remember: the dash followed by the greater-than sign makes a kind of arrow, showing that the link’s text (before the arrow) "points to" an address.)
The link’s URL can be absolute (starting, as in this example, with http://), relative (to another page of the same site), a link to a document using an internet protocol (ftp://...) an e-mail address («[->mailto:minirezo@rezo.net]»)...
Specific application: when nothing is entered before the "arrow", the text of the passed URL is displayed as a clickable link . For example:
returns:
Remember that in the case of very long URLs, the display is truncated (in order to avoid the degradation of your graphic interface), but the hypertext link points to the correct address.
- Hypertext links inside the site
Furthermore, this same hypertext links system makes it easy to create links inside your site with SPIP. the only trick consists of finding the number of the article or the section or the news item to which you want to link:
when you «visit» an article, a news item or a section in the private area, the left column contains a box indicating this number in large digits.
This is the number that you should insert in the hypertext link:
link to [article->342]
link to [article->art342]
link to [article->article 342]A particular use: [->art342] (no text before the "arrow") will automatically display the title of article 342 with a link to that article.
link to [section->rub12]
link to [section->rubrique 12]link to [news item->br65]
link to [news item->breve 65]
link to [news item->brève 65]link to [an author->aut13] or [the same author->auteur13]
link to [a keyword->mot32]
link to [a syndicated site->site1]
link to [an attached document->doc17] or [the same document->document17]
link to [an image->img13] or [the same image->image13]Specific application: here too, we can put nothing before the "arrow"
([->aut13]...). SPIP will insert automatically the required information. In the case of an attached document or an image, if we manually entered a title, this title will be displayed ; otherwise, the file name itself is used.
- Footnotes
A footnote is usually indicated by a number inserted in the text then repeated at the bottom of the page and offering additional information.
In SPIP, this feature (pretty awkward to manage manually in HTML) is automated: the footnotes are numbered by SPIP which also manages the hypertext links inside the document to jump directly from the number to the corresponding footnote and vice versa.
In SPIP, a footnote is placed between double brackets: « A[[Here is additional information.]] footnote.» will be displayed as: «A [1] footnote.»
- Quoting an excerpt (from the forum)
It is often practical, in a discussion forum, to quote an excerpt from the message which we are replying to. To make the presentation of such quotes consistent, SPIP offers the shortcut
<quote>...</quote>.
For example:
gives:
Pretty good that SPIP.
Right you are, rubber duck :-)
The following shortcuts provide more advanced functionalities, intended for a more specific use. If this is your first experience with the shortcuts of SPIP, it is probably useless to try and memorize them at this stage. You only need to now they exist; once you really need them, come back to this page, it will then be much easier for you to memorize shortcuts that you really need.
- Tables
To create simple tables in SPIP, you just have to create lines with «cells» separated by the symbol «|» (vertical line), making sure that the lines start and end with vertical lines. It is imperative to leave blank lines before and after this table.
For example, the table:
| Surname | Forename | Age |
|---|---|---|
| Smith | John | 23 years |
| Captain | not known | |
| Bloggs | Philip | 46 years |
| Cadoc | Baby | 4 months |
is coded thus:
Note that all the entries of the first row appear in bold. SPIP identifies, thus, that it is the row containing the columns headings and applies to it a presentation different from the other rows (different background colour). The presence of such a row is not mandatory.
You can also specify the optional caption and summary of the table. This information is quite important to make the table accessible, in particular, the summary gives a better view of the table without having to read through all the lines and columns.
This information is specified between two vertical lines before the table like this:
and will be formatted as is:
| Name | Date of birth | City |
|---|---|---|
| Jacques | 5/10/1970 | Paris |
| Claire | 12/2/1975 | Belfort |
| Martin | 1/31/1957 | Nice |
| Marie | 23/12/1948 | Perpignan |
You don’t have to specify both fields. In the case of setting only the table summary, you need to remember to put the single vertical line before it. Like that: || | Summary ||
- Advanced management of lists and enumerations
- A simple carriage return can be performed by typing _
(the underscore symbol) at the beginning of the line, followed by a blank space.
N.B. In traditional typography, use of a "new line" by itself is very rare (restricted, more or less, to poetry). It is often confused with a new paragraph as found in printed documents (with no additional vertical spacing between the paragraphs). Web browsers however, by default, insert a vertical spacing between paragraphs. Many users try to emulate the look of the printed page (no additional vertical spacing) by typing a simple line feed between what they consider to be paragraphs. This is an error which can make their site more difficult to maintain and develop. The correct solution is to define a stylesheet (CSS) in one’s templates which describes the layout behaviour of paragraphs (i.e. whether or not there is an additional vertical space between paragraphs, the amount of indentation of the first line, etc.).
- You can create nested lists by adding asterisks after the list dash.
For example:
gives:
- Your horse is:
- chestnut;
- bay;
- black;
- but my rabbit is
- white:
- angora
- or short-haired.
- Lastly, ordered list can be made using the following symbol # instead of the star:
returns:
- first
- second
- third
- Hyperlinks to an external glossary
You can also very quickly create a hyperlink to a definition in an external glossary. For any given term, you simply insert this
shortcut in your text [?term].
So the following code:
"{Frankenstein} is the masterpiece of [?Mary Shelley]."
will show on the screen:
"Frankenstein is the masterpiece of Mary Shelley."
Remember to click the link in order to check that the term which has been entered (whether a name or common noun) is spelt correctly and links to a valid destination.
The default external glossary is Wikipedia. It is a multilingual encyclopaedia created co-operatively and opened to all contributors over the internet. Please take the time to acquaint yourself with it, to respect it and to contribute to it in order to enrich this shared fund of knowledge.
In most cases, the aforementionned system of automatic footnotes is fairly enough.However, you may manage the footnotes in a non automatic fashion by "imposing" the choice of the number or even the displayed text used to craft the link.
The general principle is that you put the clickable text between angle brackets at the beginning of the note, thus:
Following this principle, you can:
- use automatically numbered notes [2], or
- force the number of the note [23], or
- use asterisks to indicate a note [*], or
- add notes without any visible link to/from the main text. You do this by, or
- give an abbreviation or name as the link to the note; in some languages this is often used for references indicating authorship of quotations [Rab], or
- add a link to an existing note [23] by placing the number of the note between angle brackets, < and >, and giving no text to the note.
returns:
You may use footnotes numbered automatically [3],
- but you may also impose the numbering of the footnote [23],
- or use the footnotes in the form of a star [*],
- craft unreferenced footnotes (without any number); bear in mind however, that these footnotes don’t bear any more a link between the footnote and the spot where it is inserted,
- or give a name (fully spelled) to the footnote; this is frequently used for bibliographic references [Sha];
- point to an existing note [23] by indicating its number between the characters «<» and «>». and leaving the rest of the note empty.
- Bypassing SPIP shortcuts
In some cases, it can be useful to tell SPIP that some parts of a document should not be «processed» by the typographical shortcuts filter: you do not want to correct the typography or you want to display source code (e.g. in PHP, JavaScript...).
The code of this shortcut is: «<HTML>Warning; text to leave as is</HTML>», which gives: «Warning; text to leave as is».
- Displaying programming code
Some users could wish at one point to display programming code in their pages.
The shortcut ... is available for this purpose.
Example: <?php //this is some php code gives
echo "hello";
?>
<?php //this is some php code
echo "hello";
?>There is another shortcut to display extract from programming code on several lines: <cadre>...</cadre>.This will put the code in a "form" (It is often used in the present page). The advantage of this method is to make it easier to copy-paste from you web page: you just have to move the cursor to the code you wish to copy, to choose "select all" to be able to directly copy the code. Furthermore, in many browsers, this frame (cadre) allows a better rendering of the tabs at the beginning of the lines.
Here is an example:
-------
[1] Here is additional information.
[2] By placing the text of the note between double square brackets.
[23] By putting the number between angle brackets: < and >
[*] By putting an asterisk between the angle brackets < and >
Putting angle brackets <> with nothing between them.
[Rab] François Rabelais.
[3] By putting the text of the footnote between square brackets.
[23] By indicating its number between the characters «<» and «>».
[*] By putting a star between the charecters «<» and «>».
By putting nothing between the characters «<» and «>».
[Sha] William Shakespear.