Textile est un outil qui permet d’écrire des pages web sans jamais toucher au HTML, et donc sans avoir à l’apprendre. Il permet d’écrire de façon relativement intuitive, en utilisant des raccourcis très simples.
Même si l’on peut écrire sans connaître le HTML, il faut tout de même avoir une certaine rigueur dans l’écriture. Chaque « élement » (« chose ») que l’on écrit dispose de ce que les gourous appellent une valeur sémantique, c’est à dire une fonction particulière au sein de l’article.
L’élement le plus commun est par exemple le paragraphe, mais l’on trouve aussi les titres (et sous-titres), les citations, les liens hypertextes, etc. Ici l’on ne parle absolument pas de présentation (écrire en gros, en petit, en noir, en rouge, mettre une image pour faire joli, etc.) l’on ne parle que du contenu.
Si vous arrivez à visualiser votre texte sous forme de contenu, et à le diviser en petits morceaux en leur attribuant à chacun une fonction, c’est gagné vous avez fait le plus difficile.
Il faut savoir qu’en HTML (et donc en Textile) il existe deux grands types d’éléments : de bloc (anglais : block) et linéaire (anglais : inline).
Le bloc est un ensemble d’éléments linéaires, mais ne contient qu’un seul bloc : lui-même. Un bon exemple de bloc est le paragraphe, il peut contenir des citations, des liens hypertextes, des images, qui sont tous des éléments linéaires, mais il ne peut contenir un autre paragraphe par exemple. Les blocs les plus communs sont : le paragraphe, les titres (et sous-titres), les blocs de citation, les listes. Généralement un bloc s’affiche d’un bloc (d’où le nom) continu, avec un saut de ligne avant et après lui, mais cela est laissé au cas par cas dans les mains du webmaster du site web qui s’occupera de tout ce qui est présentation.
Un élément linéaire est à l’intérieur d’un bloc, et peut contenir d’autres éléments linéaires. Un élément linéaire est généralement un groupe de mots qui ont une valeur particulière, par exemple si l’on veut mettre une exergue dessus, ou si l’on veut en faire un lien hypertexte, etc.
Ceux qui ont déjà utilisé un traitement de texte dans les règles de l’art ne seront aucunement perdu, les principes sont exactement identiques.
Textile transforme automatiquement les paragraphes de textes en paragraphes HTML, il suffit juste de les séparer par une ligne (à savoir de taper deux fois Entrée à la fin d’un paragraphe). Néanmoins il est parfois utile de préciser à Textile ce que l’on souhaite. Dans ce cas il suffit de commencer un paragraphe de texte par p. pour le désigner comme paragraphe HTML.
Un sous-titre est un bloc de titrage, qui peut exister en 6 niveaux : de 1 à 6. 1 est le plus important, généralement utilisé pour afficher le titre de l’article; 2 est le niveau juste en dessous qui sert pour les sous-titres, 3 est encore en dessous pour les sous-sous-titres, etc.
Pour transformer un paragraphe en sous-titre, il faut commencer ce paragraphe par h_n_. où n est le niveau du titre (pas son numéro, mais son niveau c’est à dire son importance dans la « hiérarchie »).
Par exemple :
h1. Ceci est un sous-titre de premier niveau
Un bloc de citation est un ou plusieurs paragraphes que l’on cite, c’est à dire venant d’une autre source ou d’un autre auteur. Pour transformer un paragraphe en bloc de citation, il faut commencer ce paragraphe par bq. .
Par exemple :
bq. La loi est l'expression de la volonté générale. Tous les citoyens ont droit de concourir personnellement, ou par leurs représentants, à sa formation. Elle doit être la même pour tous, soit qu'elle protège, soit qu'elle punisse. Tous les citoyens étant égaux à ses yeux, sont également admissibles à toutes dignités, places et emplois publics, selon leur capacité, et sans autre distinction que celle de leurs vertus et de leurs talents.
Il est possible d’indiquer une source au bloc de citation, sous la forme de l’URL où est situé le document d’origine. Pour transformer un paragraphe en bloc de citation avec source, il faut rajouter l’URL après la marque du bloc avec : entre les deux.
Par exemple : bq.:http://www.domaine.ext
Une liste à puce est une liste d’élements qui n’ont pas d’ordre précis, depuis la simple liste de course jusqu’à la description d’attributs physiques. Pour faire une liste placer chaque élément dans son propre paragraphe et commencer ce paragraphe par * .
Il est également possible d’imbriquer des listes, en doublant le *. Par exemple :
* Bla
* Bla
** Blabla
** Blabla
Une liste est ordonnée lorsqu’elle a un ordre précis, et que cet ordre à un sens. Pour faire une liste ordonnée, placer chaque élément de la liste dans son propre paragraphe et le commencer par # . Par exemple :
# Pour trouver l'endroit, aller au point A
# Puis aller au point B
# Puis aller au point C
# Enfin aller au point D
Comme pour les listes à puces, il est possible d’imbriquer des listes ordonnées. Dans ce cas la numérotation sera faite intelligemment. Par exemple :
# Un premier item
# Un second item
## Un premier item de second niveau
## Un second item de second niveau
# Retour au troisième item de premier niveau
Lorsque l’on veut mettre l’accent sur une phrase ou sur quelques mots, on utilise une emphase. L’emphase est à peu près similaire à la fonction de la mise en forme en italique, et est d’ailleurs généralement représentée ainsi. Pour mettre un texte linéaire en emphase, il suffit de l’entourer d’un _ .
Exemple : il ne faut _pas_ dire cela
Lorsque l’on veut mettre en valeur quelques mots ou phrases, de manière plus prononcée qu’avec une simple emphase, il suffit de l’entourer d’une * .
Exemple : Il ne faut *pas* dire cela !
Une référence (ou mention) est utilisée autour d’un texte linéaire lorsque celui-ci à une valeur intrinsèque à ne pas confondre avec le reste de la phrase, par exemple lorsque l’on cite le titre d’un livre. Pour l’appliquer, il suffit d’entourer les mots de : *??*.
Exemple : J'ai lu dans ??Le Canard Enchaîné?? hier que...
Un texte linéaire peut-être affiché comme supprimé, généralement représenté barré d’une rayure. Cela est particulièrement utile pour représenter les changements d’une version d’un texte à une autre, ou lorsque l’on apporte une correction à un texte publié. On l’utilise généralement en conjonction avec un texte inséré. Pour l’utiliser, il faut entourer le texte de traits d’union - .
Exemple : Il existe -deux- trois solutions à votre problème...
Un texte linéaire peut être affiché comme inséré, généralement représenté souligné. Cela est particulièrement utile pour représenter les changements d’une version d’un texte à une autre, en particulier en conjonction avec un texte supprimé. Pour l’appliquer, il suffit d’entourer les mots de : + .
Exemple : il existe -deux- +trois+ solutions à votre problème...
Des mots et chiffres peuvent être considérés comme exposants. Pour l’appliquer, il faut entourer le texte de : ^.
Exemple : C'est la 3^e^ fois que...
Des mots et chiffres peuvent être considérés comme indices. Pour l’appliquer, il faut entourer le texte de : ~.
Un lien hypertexte est un élément (ici du texte linéaire de n’importe quelle longueur) qui pointe vers une autre page web, ou ressource internet identifiée par une URL. La représentation graphique de ce lien est laissée dans les mains du webmasters.
Pour créer un lien, il faut placer le texte entre " (guillemets doubles informatiques), immédiatement suivis d’un : et de l’URL vers laquelle pointe le lien.
Exemple : et puisque nous utilisons "Textile":http://textism.com/tools/textile/ nous pouvons facilement écrire le contenu d'une page web.
Il est possible d’adjoindre un « titre » (anglais : title) à ce lien, que les navigateurs graphiques affichent généralement comme du texte dans une info-bulle lorsque l’on passe la souris sur le lien. Pour ce faire, il faut à la fin du texte du lien mettre ce titre entre parenthèses.
Exemple: et puisque nous utilisons "Textile (Un outil de Textism)":http://textism.com/tools/textile/ nous pouvons facilement écrire le contenu d'une page web.
Lorsque les URL que l’on utilise sont extrêmement longues ou complexes, et qu’on les utilise plusieurs fois dans un même article il peut être utile de créer un alias de cette URL.
En pratique on enregistre n’importe où dans l’article (par exemple à la fin, ou au début) l’alias de l’URL (qui n’apparaîtra pas à l’affichage) en utilisant cette syntaxe (chaque alias doit être seul dans son propre paragraphe) :
[alias (titre optionnel)]http://url
Ensuite l’on peut créer autant de liens que l’on veut utilisant cet alias, en remplacer l’URL par l’alias.
Exemple:
[txtil (Un outil de Textism)]:http://textism.com/tools/textile/
et puisque nous utilisons "Textile":txtil nous pouvons facilement écrire le contenu d'une page web.
Classiques compagnons du texte, des images peuvent être insérées pour illustrer le texte. Il s’agit ici d’images qui sont réellement des illustrations du texte. Les graphismes utilisés pour rehausser la mise en page d’un site web par exemple, sont complètement gérés par le webmaster du site, vous n’avez pas à vous en préocupper.
Pour insérer une image, il suffit d’entourer l’URL par ! et de placer entre parenthèses, juste après l’URL, le texte alternatif (alt) par lequel sera remplacé l’image dans les navigateurs non graphiques ou non visuels.
Exemple : !http://www.textism.com/common/textist.gif(Logo de Textist)!
Pour créer un lien hypertexte à partir de l’image, il faut immédiatement suivre le ! de fermeture par un : de ponctuation suivi de l’URL du lien hypertext. Bien entendu, il est possible d’utiliser une URL relative.
Une intéressante fonction qui n’existe pas en HTML, il est possible d’introduire des « notes de bas de page » avec Textile. Elles auront une forme probablement identique à ce que l’on trouve dans n’importe quel livre papier, bien que les détails soient laissés dans les mains du webmaster.
Pour cela, il suffit à l’endroit où l’on veut placer la marque (l’indice, le numéro) de la note d’utiliser la syntaxe [X] où X est le numéro (de 1 à 100) de la note, et d’utiliser à la fin du document en début de paragraphe fnX. suivi du contenu de la note en question.
Exemple:
Selon Dean Allen<sup><a href="#fn1">1</a></sup> la typographie est un art oublié.
fn1. L'auteur de Textpattern qui disparu mystérieusement au début de l'année 2005.
Échapper signifie ne pas subir l’influence de, ici ne pas laisser Textile interprêter un morceau de texte. Cela peut servir lorsqu’un texte non usuel est mal interpêter par Textile. Il suffit d’entourer le texte en question de == pour qu’il soit affiché tel quel.
Pour indiquer que du texte est censé être du code informatique (par exemple un exemple en HTML, en C++ ou autre) il suffit de l’entourer de @ .
À noter que cela « échappe » également le texte, c’est à dire que Textile n’interprêtera pas le texte à l’intérieur des marqueurs @.
Un conteneur est un élément linéaire générique, qui peut servir lorsque l’on a besoin de séparer du texte (ou autre) mais qu’aucun autre élément ne convient. C’est un genre de fourre-tout, à utiliser en dernier recours. On l’utilise particulièrement pour appliquer un marqueur de langue étrangère à un texte. Pour créer un conteneur générique, il faut entourer le texte de %.
Exemple : Comme disent les anglosaxons, %[en]shit happens%.
Exemple : Comme disent les anglosaxons, %shit happens%.
Un tableau sert bien évidemment à représenter des données tabulaires, par exemple utilisé dans un rapport comptable, ce genre de choses.
Pour créer un tableau simple, il suffit de mettre chaque ligne sur une ligne différente, et chaque cellule (intersection d’une ligne et d’une colonne) entre |.
Exemple :
|a|b|c|d|
|1|2|3|4|
Il est possible de décider ponctuellement d’aligner un paragraphe d’une certaine façon : à gauche, à droite, centré ou justifié (c’est à dire que les bords gauches et droits sont toujours alignés, comme dans un livre papier).
Ce n’est bien sur pas à utiliser dans tout l’article, cela est à la charge du webmaster, mais ponctuellement cela peut-être utile. Il suffit pour cela de faire suivre la marque de paragraphe du signe d’alignement idoine suivie du point usuel.
< pour un alignement à gauche> pour un alignement à droite= pour un alignement centré<> pour un alignement justifiéExemples :
p>. Ce paragraphe sera aligné à droite
h4=. Ce sous-titre sera centré
Il est possible d’attribuer à n’importe quel élément une classe ou une id particulière. Cet usage peut-être complexe, et la syntaxe exacte sera généralement fournie par le webmaster ou par le responsable de publication. Rappelons tout de même qu’une id ne peut existe qu’une et une seule fois sur une page web donnée, et qu’elle peut-être atteinte directement par un lien hypertexte via son nom d’id.
Pour affecter une classe, il suffit de faire suivre l’élément du nom de la classe (ou des classes) entre parenthèses, précédés d’un # si c’est une id.
Exemple :
h1(plom pouet#TableDesMatieres Premiere). Ceci est un sous-titre avec la classe ??plom??, la classe ??pouet??, l'id ??TableDesMatieres?? et l'id ??Premiere??.
C’est également un usage très complexe, à réserver à ceux qui sont versés dans la syntaxe CSS et HTML, mais Textile autorise néanmoins à appliquer des styles CSS à la volée à n’importe quel élément. Pour cela il faut faire suivre l’élement des styles CSS entourés de { et de }.
Il est possible d’affecter une langue particulière à un élément. Par défaut, le webmaster aura défini une langue de base pour le site web et les articles qu’il contient, dans notre cas généralement le français. Si l’on veut écrire un élément dans une autre langue, et l’indiquer au visiteur (ce qui peut avoir une importance cruciale, par exemple pour un navigateur web vocal utilisé par une personne mal-voyante) il faut faire suivre cet élément du code ISO (deux lettres) de la langue, entouré par [ et ].
Exemple :
bq[en]. Ceci est un bloc de citation en anglais.
De nombreux caractères sont utilisés quotidiennement en typographie, mais sont difficiles à reproduire avec un clavier informatique. Textile aide à la transformation automatique de certains :
| Caractère | Nom | Obtention |
|---|---|---|
| ‘ | Guillemets secondaires anglais ouvrants | ' au début d’un mot |
| ’ | Guillemets secondaires anglais fermants | ' à la fin d’un mot |
| « | Guillemets français ouvrants | " au début d’un mot |
| » | Guillemets français fermants | " à la fin d’un mot |
| ’ | Apostrophe | ' dans un mot |
| … | Points de suspension | Trois points après un mot |
| — | Tiret long | -- (deux traits d’union accolés) |
| – | Tiret court (à ne pas confondre avec un trait d’union) | - (trait d’union) suivi d’un espace |
| × | Signe multiplicateur | x (la lettre) entre deux nombres |
shadowrun.fr c’est actuellement 264 actualités et 80 articles. Vous aussi, vous pouvez participer et publier vos documents.
Vous avez écrit des aides de jeu ? Des scénarios ? Vous aussi vous pouvez les publier très simplement sur shadowrun.fr en vous enregistrant sur le site. Vous garderez sur vos œuvres tout le contrôle que vous souhaitez, ce sont toujours vos œuvres.
Shadowrun ™ est un jeu et une marque déposée ©The Topps Company, Inc., publié en anglais par Catalyst Game Labs, publié en français par Black Book Éditions et traduit par Ombres Portées. Voir la section À propos pour plus d'informations sur le site, y compris les mentions légales.
Une carte complète du site est disponible.
You don't speak French? Here's a description of this website for you.
Il serait très pratique de pouvoir télécharger le contenu de cette page en version .pdf , .doc , .rtf ou .txt histoire de pouvoir le garder sous la main. Je bosse souvent hors connexion quand je fais de la mise en page (avant de copier / coller sous textpattern) et ça me faciliterait la vie.
Il faudrait d’abord que je le mette à jour, pas mal de bugs ont été corrigés depuis, et il y a quelques petites nouveautés.
C’est vrai que je ne pense pas à la version offline, parce que je connais Textile par cœur, ou que si j’ai besoin j’ai la source.
Je note de la mettre à jour, et d’en faire une version offline.