Comment éviter de voir l’horaire sur la date d’un événement ?

Un événement est associé à une date de début et un date de fin. Mais il n’est pas toujours nécessaire d’afficher toutes ces informations sur le site web.

Ainsi, la date de fin s’affiche seulement si elle est différente de la date de début.

Pour afficher la date sans l’horaire

Certains événements n’ont pas besoin d’afficher d’horaires.

Pour éviter cela, un champ « Toute la journée » est disponible sur le formulaire de création d’événement. Il suffit de le cocher pour voir disparaître les références horaires sur l’événement.

Pour afficher seulement l’horaire de début d’un événement

Pour afficher seulement la date de début d’un événement sans afficher la date de fin, il suffit de mettre le même horaire en début et en fin d’événement.

exemple : affichera

Attention : lorsque l’on rentre une horaire de début pour la 1re fois, l’horaire de fin se cale automatiquement 1h après l’horaire de début. Il convient de modifier l’horaire de fin après l’horaire de début.

Comment insérer un tableur dans un article ?

Il est possible de mettre en forme un tableau à partir d’un fichier réalisé dans un tableur (Excel ou Open Office Calc). Pour cela :

  1. Enregistrer votre tableur au format .csv
  2. Associez le à un article
  3. Insérer-le document dans l’article en utilisant le mini-code :
    <emb+numéro du document>
  4. Votre tableur sera inséré sous forme de tableau avec les styles du site. Exemple avec ce document :
AnimalNombre de pattesNombre de poils
Chat 4 123846356
Chien 4 546854128
Poisson 0 0

Comment ordonner les éléments ?

Par date

Certains éléments (par exemple les articles) sont classés par date de publication du plus récent au plus ancien.

Lorsqu’un article est publié, la date du jour est automatiquement associé à l’article dans l’encart date de publication en ligne. Il est possible de changer cette date en cliquant sur le bouton changer, et ainsi changer l’ordre d’apparition des articles.

JPEG

Par numéro de titre

Certains éléments (par exemple les rubriques) sont classés par numéro de titre. Pour numéroter un élément, il faut remplir le champ numéro situé au-dessus du titre de l’élément. Pour rendre leur tri plus facile, un encart disponible sur la colonne de droite permet de numéroter l’élément avant ou après un autre élément se situant dans la même rubrique.

Certains éléments (par exemple les rubriques) sont classés par numéro de titre. Pour numéroter un élément, il suffit d’indiquer devant le titre un muméro suivit d’un point et d’un espace. Pour rendre leur tri plus facile, un encart disponible sur la colonne de droite permet de numéroter l’élément avant ou après un autre élément se situant dans la même rubrique.

Par exemple, pour numéroter les sous-rubriques de la rubrique rubrique 1, on pourra au choix :

  • Indiquer un chiffre dans le champ numéro de chaque sous-rubrique ci-dessous :
  • Indiquer un chiffre dans le champ numéro de chaque sous-rubrique ci-dessous :
  • Choisir de classer les sous-rubriques via l’encart ci-dessous (situé sur la colonne de droite) :

En utilisant l’interface d’administration

Certains éléments peuvent être ordonnés dans l’interface d’administration. C’est le cas :

  • des menus : Utilisez les flèches ou pour déplacer ces éléments
  • des éléments contenus dans les modules : utilisez les flèches et ou glissez-déposer vos éléments pour les ordonner.
  • des documents : lorsqu’ils sont associés à un article ou une rubrique, les documents peuvent être ordonnés par glisser-déposé en cliquant sur le symbole pour pouvoir ordonner vos documents.

Insérer des images dans un article

Il existe 2 façons d’utiliser des images :

  1. Elles peuvent faire partie d’un diaporama composé de nombreuses photos. Pour cela, suffit d’associer plusieurs images à l’article en cliquant sur le bouton « Ajouter un document » visible en bas de chaque article. Les images apparaissent alors dans un carrousel (voir ci-contre.)
  2. Elles peuvent servir à habiller le texte d’un article. Lorsque l’on insère une image associée à un article dans le texte de ce dernier. L’image disparait du diaporama pour apparaître à l’emplacement souhaité dans le texte.

L’article ci-dessous décrit comment insérer et mettre en forme ces images à l’intérieur du texte d’un article.

Alignement

Sous la colonne de gauche de chaque page d’édition, les images associées à la page éditée s’affichent, suivi de 3 petits codes. L’utilisation d’un de ces codes dans votre article permet d’insérer l’image du document.

En fonction du code choisi, l’image sera alignée à gauche, centrée, ou alignée à droite. C'est pas à un vieux singe ... {JPEG}

C’est pas à un vieux singe ...
... qu’on apprend à s’imposer dans un article d’aide à la publication.

C'est pas à un vieux singe ... {JPEG}

Lorsque du texte est positionné sous une image alignée à gauche ou à droite, il vient s’insérer sur le côté de celui-ci. Sur la page publique, l’image est automatiquement réduite à la moitié de la largeur de la page générer une mise en page agréable à lire.

Par contre, une image centrée ne laissera passer aucun texte sur ses côtés. Elle ne sera réduite que dans la mesure où ses dimensions seront supérieures à la largeur de la page. En effet, Une image trop grande est automatiquement redimensionnée à 772px de large pour qu’elle ne puisse pas déborder de la largeur de la page.

Liens

Il est possible de créer un lien sur une image en ajoutant :

|lien=adresse_de_mon_lien

Dans le petit code généré, l’image ci-dessous pointe sur un site externe.

C'est pas à un vieux singe ... {JPEG}

Le titre et le descriptif de l’image

JPEG - 236.2 ko
C’est pas à un vieux singe ...
... qu’on apprend à s’imposer dans un article d’aide à la publication.
© http://maillage.asso.fr/IMG/jpg/dawn_of_the_139d.jpg

Il est possible d’associer des informations à votre image. Pour cela, cliquez sur le bouton modifier en dessous de celle-ci. Un fnêtre apparaîtra vous permettant de renseigner :

  • le titre de l’image
  • la description de l’image
  • les crédits de l’image
  • la vignette (ou visuel) sur lequel il faudra cliquer pour voir l’image. (Cela peut par exemple être un détail de l’image sur lequel il faudra cliquer pour voir l’image entier).

Un fois que votre image contiendra un de ces éléments, les codes visibles sous celle-ci changeront :

  • Les codes commençant par « doc » permettent d’insérer l’image associée ainsi que sa légende.
  • Les codes commençant par « emb » permettent d’insérer l’image seule.

Dans l’exemple ci-contre, l’image est associée à sa légende composée de son titre et de son descriptif :

Pourquoi les retours à la ligne n’apparaîssent pas sur la partie publique ?

Le site ne prend pas en compte les simples retours à la ligne. Cela permet de copier coller des PDF à la volé sans avoir à supprimer chaque retour à la ligne.

Il existe néanmoins un « truc » pour faire un retour à la ligne  :
- Soit on passe 2 lignes pour changer de paragraphe.
- Soit un passe un ligne pour créer un underscore ( _ ) suivi d’un espace. Ex :
Me voici à la ligne !

Quelques exemples de raccourcis de mise en forme de texte

Comme vous le savez déjà, il est possible de mettre le texte en gras (CTRL + B) ou en italique (CTRL + I) en jouant avec les accolades et les crochets.

Cet article liste d’autres possibilités offertes par SPIP.

Généralités

Intertitre

Les 3 Niveaux d’intertitres présents dans cet article peuvent être facilement utilisés dans un article Spip. L’intertitre de niveau 1 est accessible via la touche raccourcie CTRL + H.

Les intertitres de niveau 2 et 3 sont générés en ajoutant deux ou 3 « * » (étoiles) après les accolades ouvrantes.

Paragraphes et retours à la ligne

  • Un retour à la ligne dans l’espace de rédaction n’influera pas sur la mise en page de votre article [1]. Le texte passé à la ligne dans votre espace d’administration apparaîtra à la suite du texte au-dessus. Ce fonctionnement permet de copier coller le contenu d’un PDF et de l’insérer dans un article sans avoir besoin de supprimer chaque retour à la ligne.
  • Lorsque l’on passe 2 lignes ou plus, le système génère un nouveau paragraphe. Celui-ci sera espacé du paragraphe précédent par le même espace quel que soit le nombre de lignes passées.
  • Pour forcer un retour à la ligne dans le même paragraphe, il faudra entrer un « _ » (underscore) en début de ligne, suivit d’un espace.
  • Pour insérer un espace insécable (ou espace dur), on insérera un «   » (tild) entre les mots concernés. Cela est utile pour s’assurer, par exemple, que l’élément de ponctuation «  : » ne sera pas séparé du mot qui le précède.

Caractères spéciaux

  • Les claviers occidentaux ne sont pas adapté au français contemporain. C’est pourquoi la barre typographique visible au-dessus du texte contient un certain nombre de boutons permettant d’insérer les caractères récurrents tel que le « É » (visible dans le second intertitre ci-dessous).
  • Pour faire apparaitre ces caractères, il suffit de survoler avec la souris l’icône JPEG.
  • Les boutons JPEG peuvent être très utiles pour changer la casse des caractères.

Mise en forme basique :

Énumération :

Avec puce sous forme d’image :

Lorsque l’on commence un paragraphe par un tiré, il apparaît une petite pastille comme ceci :

- Qu’est-ce que cela peut faire que je lutte pour la mauvaise cause puisque je suis de bonne foi  ?
- Et qu’est-ce que ça peut faire que je sois de mauvaise foi puisque c’est pour la bonne cause. (Jacques Prévert)

Liste hiérarchisée avec une puce HTML :

On peut modifier la hiérarchie dans la liste en jouant avec les dièses :

  • Ton cheval est :
    • alezan  ;
    • bai  ;
    • noir  ;
  • mais mon lapin est :
    • blanc  ;
      • angora  ;
      • ou à poil ras.
Liste Numérotée :
  1. premier
  2. deuxième
  3. troisième

Liens :

Liens basiques :

Il est possible de créer différent liens hypertextes amenant à l’extérieur du site :

  • Pour créer un lien simple, utilisez les touches raccourcies CTRL + L. Un champ apparaîtra dans lequel vous insèrerez l’adresse de celui-ci. Le lien prendra automatiquement le nom de l’adresse que vous venez d’insérer. Ex : https://www.franceinter.fr/
  • Si vous voulez nommer votre lien, il faudra sélectionner du texte avant d’appuyer sur CTRL + L : exemple : lien vers le site de Survie.
Liens vers des pages de votre site :

D’autres liens peuvent mener vers des articles ou des rubriques de votre site. Voici 2 possibilités pour faire un lien vers l’article 12 :

  • En indiquant le chiffre 12, on crée un lien qu’il conviendra de nommer
  • Un lien sans nom affichera automatiquement le titre de l’article. Ex : article 12

La même logique est adaptable aux liens vers les rubriques :

  • Pour faire pointer un lien vers la rubrique 12, on écrira « rub » + le numéro 12.
  • Un lien sans nom affichera automatiquement le titre de la rubrique. Ex : Ville de Somain
Liens vers une définition d’un dictionnaire

Certains liens peuvent pointer vers un dictionnaire (Wikipédia par défaut). On utilisera pour cela les crochets suivit d’un point d’interrogation : À la recherche du temps perdu est l’œuvre majeure de Marcel Proust

Il est possible de séparer le texte comme ceci en tapant 4 tirés en suivant :


Mise en forme avancée :

Pour les subtilités suivantes, je vous invite à aller voir du côté de la partie privée du site afin de comprendre le fonctionnement des raccourcis typographiques, et de les associer à leur affichage.

Notes de bas de page

Il est possible de placer facilement une note [2] de bas de page.

Ces notes de bas de pages existent sous différent format :

  • sous forme d’astérisques [3],
  • sans références (non numérotées) ; attention, de telles notes ne présentent plus de lien entre la note et l’appel de notes [4],
  • donner un nom (en toutes lettres) à une note  ; cet usage est très répandu pour les références bibliographiques [5] ;
  • rappeler une note déjà existante [6] en indiquant le numéro de cette note entre les symboles « < » et « > » et en laissant vide le reste de la note.

Tableaux

Il est possible de faire des tableaux :

Nom Prénom Age
Marso Ben 23 ans
Capitaine non connu
Philant Philippe 46 ans
Cadoc Bébé 4 mois

Mise en forme de caractères :

  • Certaines expressions peuvent être mises en évidence en utilisant les couleurs du site. Pour cela, on utilisera les « [ » ( crochets ) et les « * » (étoiles).
  • Il est possible de mettre certains caractères en exposant ou en indice : Comme nous ne disposons pas de 2de planète, évitons d’émettre une quantité importante de CO2.
  • Rien de mieux que de barrer un texte pour mettre en exergue une erreur : Ce texte est garanti sans fautes d’orthographe

Styles de paragraphes :

Mise en exergue d’un paragraphe :
Il est possible de mettre en exergue une information, de cette manière grâce en mettant l’information entre crochets et parenthèses.
Paragraphe ferré à droite
Il est possible de ferrer les paragraphes à droite en utilisant les « [ » (crochets) et les « / » (slaches).
Cadre pour copier coller du texte :

Si vous voulez permettre à vos lecteurs de facilement copier-coller du contenu, rien de mieux que de l’insérer dans ce type de cadre.

Citations :

Les raccourcis CTRL + Q permettent d’insérer une citation

Code informatique :

Le geek de service sera satisfait de constater qu’une mise en forme permettant de styliser du code informatique est disponible.

Poésie et imbrication de styles :

Le poète sera satisfait de constater que ses vers pourront être stylisé ainsi.

Chantre Et l’unique cordeau des trompettes marines

Apollinaire d’Alcools (2011)

Dans l’exemple ci-dessus, cette mise en forme est utilisée sur l’auteur et la source de la citation.

Cet exemple démontre qu’il est possible d’imbriquer les style les uns dans les autres.

Blocs dépliables

Pour une présentation de l’information du type « foire aux questions », il est possible d’insérer des blocs dépliables.

Ma question 1

Ma réponse 1

Ma question 2

Ma réponse 2

Ma question 3 dont la réponse doit être visible et dépliée au chargement de la page.

Ma réponse tout aussi importante.


Images et documents

Vous remarquerez que plusieurs images ont été associées à ce document de manière différente. (ajustée à droite, à gauche ou centrée)

Notes

[1Sauf dans certains contextes particuliers détaillés plus bas, tels que la mise en forme des listes à puce, de citation ou de poésie.

[2Voici un complément d’information.

[3<*> En plaçant simplement un astérisque entre les symboles « < » et « > ».

[4<> En n’indiquant rien entre les symboles « < » et « > ».

[5François Rabelais.