Typographic bar

Preview Mode
The "Preview" icon (the eye icon) of the typographical bar activates the preview mode.

A red box appears under the text in which the text written with its formatting is displayed.
It allows seeing, while typing, the appearance of SPIP typographical shortcuts in the text.

The preview is updated on each action and during the typing.

Hyperlink
"Link" icon: select a part of the text you want to associate a link and then click the link.

 First fill in the address field.

It is possible to put a full http address (including a link to external site). However, you can also use the
shorthand notation of SPIP for an internal link. For example: 45 to make a link to the article 45, rub21
to make a link to the line 21, etc.

Example:

 To create a link to an article in the local site, put the article ID:
Trick: to link to a page on your site, you can click on this icon:

It will display the structure of your site. You only need to click on the section or the article on which you
want to link. The field will be filled in automatically.

To link to an external site, put the full address:

Here is how the link to http://www.lemonde.fr/ with the text “HERE” selected to be active will be
displayed in the text. Click on [HERE->http://www.lemonde.fr/]

If necessary, you can enter a short text in the "Help Bubble ". A tooltip will be displayed on mouse
over:

The option "Abbreviated language: " is not useful in this case.

After filling the fields, select the text to change into a link and click OK.

Here is how the link to http://www.lemonde.fr/ with the text “HERE” selected to be active and a tooltip
with the text “HELLO” will be displayed in the text of the public part.

Click HERE

Anchors
An anchor is a point in a page on which you want to point a link.
Click on the icon with a red arrow pointing down to display the management area of the anchors.

To create an anchor, fill in the Name field anchor “Anchor name”:

Then select the word of your article on which you want to place the anchor (that will be pointed to by
the link). It will therefore be the target of the link:
Click on OK:

1
To make a link on this anchor placed in the article, fill in the field Anchor and if needed the field “Help
bubble”, select the text to change into a link:

Click on OK:

When you click on OK, it will display in the public part like this:

This will lead you on:

Search and Replace

Click on this icon to display the “Search and Replace”.

To search, fill in the field “Search”:

Option "Match case". To allow or not the character case in the search box, you can enable this
function:

Click the “Search” button to activate the search:

To replace a word or a group of words, fill in the fields “Search” and “Replace”.
Then click the button “Replace” to change the occurrences of the term searched by the replacement
term:

Some options will help you optimize the use of this tool.
To change the case (uppercase or lowercase) of the search expression, use these buttons:

These two buttons allow you to switch the selection to uppercase or lowercase. They are available in
the “Find / Replace” and the “Special Character” areas.

To replace all or just the complete expressions:

Special Characters
Click on the icon “Special Characters” (keyboard icon) to display the special characters.

 Quotation marks are inserted on both sides of the selected text.

 The non-standard letters (upper case accented, æ and oe, €) are inserted where the cursor is.

 Switch to uppercase or lowercase on the text selected.

These two buttons allow you to switch the selection to uppercase or lowercase. They are available in
the “Find / Replace” and the “Special Character” areas.

Note: lowercase accented (éèà etc.) are converted to uppercase accented (ÉÈÀ etc.) and conversely.
 Table
Put the cursor where you want to insert a table and then click on the icon of the table publisher.
A pop-up box appears allowing you to enter information in your table.

In the fields “Table title” and “Table summary (accessibility)”, you can put a title and a summary of
your table (especially for accessibility tools).

You can add or delete rows or columns.

 The red crosses allow you to delete rows or columns.

 The following icons allow you to insert a row or column to a specific location

If you want to edit a table, you must select the entire code of your table in your article:

|{{Day}}|{{morning}}|{{afternoon}}|
|Monday|12€|10€|
|Tuesday|5€|9€|
|Wednesday|7€|11€|
|Thursday|4€|13€|
|Friday|15€|8€|

Then click on the icon of the table editor. The pop-up will appear with the table and its data:
Pay attention: you have to select the entire table; otherwise you may get an unexpected result.

Here are the Spip marks that will be visible in the text in the private part:

|{{Day}}|{{morning}}|{{afternoon}}|
|Monday|12€|10€|
|Tuesday|5€|9€|
|Wednesday|7€|11€|
|Thursday|4€|13€|
|Friday|15€|8€|

To create tables very simply, just make lines with "boxes" separated by the symbol "|" (pipe, a vertical
line). The lines begin and end with vertical lines.

The symbol "|" is obtained on the PC Azerty keyboard via keystroke “Alt Gr” + “1-&”:

This will be displayed in the public part like this:

 Statistics
(Number of words, characters and signs)

Click on the symbol "Sum" to display the statistics on the text being written. The statistics are updated
during the typing like in the preview mode. The statistics are calculated from raw text, after having
removed all formatting information.

If you select some text, only the selection is taken into account for the statistics. Once the text is
deselected, the statistics will update throughout the text. When the text is deselected, the statistics are
on the whole text.

Italics
This tool will put selected text in italics.

Select some text:

Then click on the italic icon:

Here are the Spip marks that will be visible in the text from the
Private Area: {un super texte}
Public Area: un super texte

Bold
This tool will put selected text in bold.

Select some text :

Then click on the bold icon:

Here are the Spip marks that will be visible in the text from
the Private Area: {{un super texte}}
the Public Area: un super texte
 Accentuate
This tool will put selected text in bold and orange

Select some text :

IMAGE

Then click on the accentuate icon:

Here are the Spip marks that will be visible in the text from
the Private Area: [*un super texte*]
the Public Area: un super texte

Superscript
exponent
This tool will put selected text in

Select some text :

Then click on the exponent icon:

Here are the Spip marks that will be visible in the text from
the Private Area: ^{un super texte}
UN SUPER TEXTE
the Public Area Public : texte normal

Indice
This tool will put selected text in inferior

Select some text :

Then click on the inferior icon:

Here are the Spip marks that will be visible in the text from
the Private Area: _{un super texte}

the Public Area: texte normalun super texte

 Small caps
This tool will put selected text in small caps.

Subheading
This tool will put selected text in:

Font-family: Georgia
Font-size: 16px
Font-color: blue

Select some text :

Then click on the subheading icon

Here are the Spip marks that will be visible in the text from
the Private Area: {{{un super texte}}}

the Public Area:

Footnote
This tool allows a footnote on page with a bidirectional link between the note and the word annotated.

In the following example the word to annotate is "graminées" and the footnote: "Famille des plantes
monocotylédones qui comprend notamment les céréales."

Private Area: allergie aux graminées [[Famille des plantes monocotylédones qui comprend notamment
les céréales.]] de pollens

And how the footnote will display in the Public Area:

To see the footnote, click on the [1] in the text.

To return in the text from de footnote, click on the number (in this case “[1]”).
 Special formatting
This function has a submenu:

 This option allows you to put some code on a page without being interpreted by the
browser:

Here are the Spip marks that will be visible in the Private Area text:
<code><object width="425" height="344"><.......></embed></object>
ce qui donne:
<object width="425" height="344"><param name="movie"
value="http://www.youtube.com/v/eJ6vadFVjYg&hl=fr_FR&fs=1&"></param><param
name="allowFullScreen" value="true"></param><param
name="allowscriptaccess" value="always"></param><embed
src="http://www.youtube.com/v/eJ6vadFVjYg&hl=fr_FR&fs=1&"
type="application/x-shockwave-flash" allowscriptaccess="always"
allowfullscreen="true" width="425" height="344"></embed></object>

 This option allows you to create an insert in the text:

Here are the Spip marks that will be visible in the text from the Private Area:
<cadre>test test test test test test test test test test test test test test test test</cadre>

ce qui donne…

 This option allows you to highlight some text:

Here are the Spip marks that will be visible in the text from the private part:
<poesie>test test test test test test test test test test test test test
test test test</poesie>

in the Public Area:

Extra & Justification

This function has a submenu:

 To insert a level 1 subheading:

Here are the Spip marks that will be visible in the text from
the Private Area: {{{Intertitre niveau 1}}}
the Public Area:

 To insert a level 2 subheading:

Here are the Spip marks that will be visible in the text from
the Private Area: {2{Intertitre niveau 2}2}
the Public Area:

 To insert a level 3 subheading:

Here are the Spip marks that will be visible in the text from
the Private Area : {3{Intertitre niveau 3}3}
the Public Area:

 This icon allows you to centre the text:

Here are the Spip marks that will be visible in the text from
the Private Area: [|Texte centré|]
the Public Area :
Texte centré

Texte centré

 This icon allows you to align text to right:

Here are the Spip marks that will be visible in the text from
the Private Area: [/Texte aligné à droite/]
the Public Area:

Texte aligné à droite

 This icon allows you to frame the text:

Here are the Spip marks that will be visible in the text from
the Private Area: [(Texte encadré)]
the Public Area:
 This icon allows you to cross the text:

Here are the Spip marks that will be visible in the text from
the Private Area: <del>Texte barré</del>
the Public Area :
Texte barré

Wikipedia Reference

This tool creates a link to the page of the selected word.

Here are the Spip marks that will be visible in the text from
the Private Area: [?maison]
the Public Area: maison ( "maison" is clickable and refers to the Wikipedia page "maison")