Arc de Meyran
Collège
Aix-en-Provence
 

Les raccourcis SPIP (2) : liens, images et documents joints

mardi 22 septembre 2009, par le Webmestre

GIF - 103 octets
aide

Ces éléments sont issus de l’aide en ligne de SPIP, accessible avec le «  ? » au-dessus de la zone de rédaction des articles. (Le point d’interrogation marque toujours un lien vers une aide contextuelle dans SPIP

Les liens
- Liens hypertextes externes
- Liens hypertextes à l’intérieur du site
- Notes de bas de page
- Ancres nommées

Les documents joints, les images et autres médias en ligne
- Documents joints
- Images & Portfolios
- Sons et Vidéos

1. Les liens

Les liens hypertextes

On fabriquera facilement un lien hypertexte avec le code suivant :

Le site du [Collège Arc-de Meyran->http://www.clg-arcdemeyran.ac-aix-marseille.fr/spip] utilise SPIP.

deviendra :

Le site du Collège Arc-de Meyran utilise SPIP.


Mnémotechnique : le tiret suivi d’un chevron dessine une sorte de flèche qui indique que le texte du lien (avant la flèche) « pointe vers » une adresse.

L’adresse du lien peut être une adresse absolue (commençant, comme ici, par http://), une adresse relative (vers une autre page du même site), un lien vers un document utilisant un protocole de l’internet (ftp://...), une adresse email (« [->ce.0131712r@ac-aix-marseille.fr] »)...

Application spécifique : vous pouvez afficher en toutes lettres un lien cliquable sous la forme d’une adresse URL, en n’indiquant rien avant la « flèche ». Par exemple :

[->http://www.clg-arcdemeyran.ac-aix-marseille.fr/spip/]

affiche :

http://www.clg-arcdemeyran.ac-aix-m...

Notez que, dans le cas des URL très longues, l’affichage est tronqué (pour éviter de dégrader votre interface graphique), mais le lien hypertexte pointe vers la bonne adresse.

Il est possible de préciser la langue de la page vers laquelle le lien pointe, ce que les navigateurs afficheront à leur convenance. Pour cela, il faut mettre le code-langue entre accolades.

[Un site en français{fr}->www.ac-aix-marseille.fr]

C’est particulièrement recommandé lorsque la page de destination n’est pas dans la même langue que votre texte.

Si l’on veut donner beaucoup d’informations sur le lien sans allonger excessivement la zone cliquable, on peut provoquer l’apparition d’une info-bulle en plaçant avant la flèche le signe | suivi du texte souhaité :

[Le site académique|Site officiel de l'Académie d'Aix-Marseille->www.ac-aix-marseille.fr]

affichera Le site académique, le reste du texte n’apparaissant qu’au survol.

PNG - 1.2 ko
Haut de page

Les liens hypertextes à l’intérieur du site

Ce même système de liens hypertextes facilite, de plus, la création de liens à l’intérieur du site sous SPIP. La seule subtilité consiste à repérer le numéro de l’article, de la rubrique, ou de la brève vers laquelle vous voulez mener votre lien hypertexte : lorsque vous « visitez », dans l’espace privé, un article, une brève ou une rubrique, la colonne de gauche contient un pavé indiquant, en gros caractères, ce numéro.

C’est ce numéro que vous allez indiquer dans le lien hypertexte :

  • Lien vers l’article 46 (quatre possibilités) :
    lien vers [l'article->46]
    lien vers [l'article->art46]
    lien vers [l'article->article 46]

Application spécifique : [->art342] (on n’a rien indiqué avant la « flèche ») affichera automatiquement le titre de l’article 342 avec un lien vers cet article.

  • Lien vers la rubrique 46 :
    lien vers [la rubrique->rub46]
    lien vers [la rubrique->rubrique 46]
  • Lien vers la brève 65 :
    lien vers [la brève->br65]
    lien vers [la brève->breve 65]
    lien vers [la brève->brève 65]
  • Auteurs, mots-clés, sites, images, documents :
    lien vers [un auteur->aut13] ou [le même auteur->auteur13]
    lien vers [un mot->mot32]
    lien vers [un site syndiqué->site1]
    lien vers [un document joint->doc17] ou [le même document->document17]
    lien vers [une image->img13] ou [la même image->image13]

Application spécifique : on peut, là aussi, ne rien spécifier avant la « flèche » ([->aut13]...). SPIP insérera automatiquement les informations nécessaires. Dans le cas d’un document joint ou d’une image, si l’on a indiqué un titre manuellement, c’est ce titre qui sera affiché ; sinon c’est le nom du fichier lui-même qui sera utilisé.

Ne mettez pas votre adresse de courrier dans le corps d’un article. Renseignez-la dans votre fiche d’auteur, dans la partie privée du SPIP, et insérez le code correspondant à votre numéro d’auteur. On pourra vous adresser un message sans que votre adresse soit dévoilée.
[->aut41] deviendra Auteur : 41 et affichera un formulaire de contact
PNG - 1.2 ko
Haut de page

Les notes de bas de page

Une note de bas de page est, habituellement, signalée par un numéro placé à l’intérieur du texte, numéro repris en bas de page et proposant un complément d’information.

Dans SPIP, cette fonctionnalité (assez lourde à gérer manuellement en HTML) est automatisée : les notes sont numérotées par SPIP, qui gère également des liens hypertextes à l’intérieur du document pour passer directement de l’appel de note au texte de la note correspondante, et vice-versa.

Une note de bas de page est indiquée, dans SPIP, entre doubles crochets : « Une note[[Voici un complément d'information.]] de bas de page. » sera affiché sous la forme : « Une note [1] de bas de page. »

PNG - 1.2 ko
Haut de page

Les ancres nommées

Les ancres nommées sont des liens à l’intérieur d’une même page. Elle servent pour la navigation à l’intérieur de la page quand l’article est très long, pour accéder directement à un point spécifique, ou revenir en haut de page.

Elles sont constituées de deux éléments :
- l’ancre proprement dite, placée à l’endroit où l’on veut pouvoir aller directement ; elle est écrite sous la forme inversée du lien : [ancre1<-], et reste invisible aux yeux du lecteur.
- l’appel à cet ancre (c’est un lien vers le nom de l’ancre, précédé de "#") : [Point 1->#ancre1]


Sur le SPIP du collège, le lien [Haut de Page->#banniere] permet de retourner en haut de la page...

Attention : chaque ancre doit avoir un nom différent !

PNG - 1.2 ko
Haut de page

2. Les documents joints, les images et autres médias en ligne

Les documents joints

JPEG - 17.1 ko
Joindre un document

- Installation des documents sur le serveur

L’interface de SPIP vous permet de proposer sur votre site des fichiers multimédia (son, vidéo, textes...).

Les rédacteurs peuvent joindre des documents aux articles. Ces documents peuvent être soit présentés à la suite du texte (à la façon de « pièces jointes »), soit présentés à l’intérieur du texte sous la forme d’une vignette de prévisualisation.

Les administrateurs du site peuvent, de plus, installer des documents directement dans les rubriques.
Installation des documents sur le serveur

L’installation des fichiers sur le serveur se fait au travers de l’interface « Joindre un document » pour les articles, et « Publier un document dans cette rubrique » pour les rubriques.

Vous remarquerez que, pour les articles, cette interface apparaît à deux endroits différents : en bas de la page de chaque article, et dans la colonne de gauche (sous les images) lorsque vous modifiez un article. Ces interfaces ont exactement la même fonction, mais vous utiliserez l’une ou l’autre en fonction de vos besoins. Pour les rubriques, l’installation des documents se fait sur la page de la rubrique concernée.

Attention :
selon la taille des fichiers, cette opération peut prendre du temps. Notez aussi que les fichiers trop gros (poids supérieur à 30 Mo) pourront être refusés.
En ce cas il faudra passer par une autre méthode, et vous devrez contacter Jacques VITALE ou Olivier JEULIN.

Certaines extensions de fichier ne sont pas acceptées (les .EXE par exemple), le fichier est alors compressé et mis dans une archive ".ZIP" pour permettre leur téléchargement.

JPEG - 31.5 ko
doc


- Informations et vignette

Une fois le document téléchargé, il prend comme titre le nom du fichier (sans l’extension). Il est possible alors :

  • de le renommer
  • d’ajouter un commentaire (une description)
  • de modifier sa vignette (si celle proposée par SPIP ne vous convient pas)

Un document joint peut être intégré à l’article par le code <docXXX> (avec XXX comme numéro de document) ou, avec un peu de mise en forme :

<docXXX|left> : à gauche
<docXXX|center> : au centre
<docXXX|right> : à droite

Il apparaîtra alors dans la page, avec son titre, et sa description si elle a été renseignée.

Il peut être aussi laissé "joint", et sera affiché après le corps de l’article.

PNG - 1.2 ko
Haut de page

Les images et les portfolios

- Les images

Les images (format JPEG, GIF, PNG) sont des documents particuliers car ils peuvent être intégrés :
- soit comme illustration
- soit comme document

Comme illustration, on utilise le code <embYYY> (avec les possibilités de mise en page précisés ci-dessus). L’image est affichée à sa taille d’origine, ou redimensionnée automatiquement si sa taille dépasse celle de la zone de l’article (pour éviter les débordements).

Comme document, avec le code <docYYY>, l’image est intégrée dans la page, et affiche en plus, son titre et sa description.

JPEG - 4.7 ko
Logo du Collège
Le logo du collège, tel qu’il apparaît sur les documents à destination du public.
code : <doc221>
JPEG - 4.7 ko
Logo du Collège
Le logo du collège, tel qu’il apparaît sur les documents à destination du public.
code : <emb221>

Les images qui ne sont pas intégrées au corps de l’article constituent un "Portfolio" en dessous du texte. Le paramétrage du site du collège transforme ce "portfolio" en diaporama automatique.

Astuces :
- Taille maximum conseillée pour les images :
1000 pixels de large. Au-dessus, elles deviennent trop lourdes, et donc trop longues à charger pour le navigateur du visiteur.
- Beaucoup d’images à télécharger :
Mettez toutes les images dans une archive ".ZIP", et télécharger l’archive sur le serveur. SPIP proposera alors soit de placer le fichier .ZIP comme un document joint, soit de décompacter le contenu de l’archive : choisissez la seconde option, SPIP récupérera la totalité des images contenues dans l’archive d’un coup et les joindra à l’article.
- Afficher une rubrique vide (sans article) :
En ajoutant une image (ou tout autre document) à une rubrique qui ne contient pas d’article, celle-ci apparaîtra dans le plan, car elle ne sera plus considérée comme "vide" (SPIP n’affiche que les rubriques contenant des éléments, articles ou documents joints)
PNG - 1.2 ko
Haut de page

Les sons et les vidéos

Une amélioration de SPIP permet aussi d’intégrer dans un article des fichiers sons (au format MP3) ou des vidéos (encodées au format FLV) [2].

On utilise alors le code <docZZZ|player> pour signifier que le fichier doit être "lu" dans la page, et non pas proposé au téléchargement.

Exemples :

code : <doc222|player|center>

Et un petit cadeau pour les amateurs de Rudyard Kipling [3]

If by Rudyard Kipling
from Dennis Hopper documentary « do or die », broadcasted on Arte TV
code : <doc223|player|center>
PNG - 1.2 ko
Haut de page
 
Notes :

[1Voici un complément d’information.

[2Voir David pour plus de précisions sur l’encodage des vidéos, et les outils à utiliser

[3If, by Rudyard Kipling

If

If you can keep your head when all about you
Are losing theirs and blaming it on you ;
If you can trust yourself when all men doubt you,
But make allowance for their doubting too ;
If you can wait and not be tired by waiting,
Or, being lied about, don’t deal in lies,
Or, being hated, don’t give way to hating,
And yet don’t look too good, nor talk too wise ;

If you can dream - and not make dreams your master ;
If you can think - and not make thoughts your aim ;
If you can meet with triumph and disaster
And treat those two imposters just the same ;
If you can bear to hear the truth you’ve spoken
Twisted by knaves to make a trap for fools,
Or watch the things you gave your life to broken,
And stoop and build ’em up with wornout tools ;

If you can make one heap of all your winnings
And risk it on one turn of pitch-and-toss,
And lose, and start again at your beginnings
And never breath a word about your loss ;
If you can force your heart and nerve and sinew
To serve your turn long after they are gone,
And so hold on when there is nothing in you
Except the Will which says to them : « Hold on » ;

If you can talk with crowds and keep your virtue,
Or walk with kings - nor lose the common touch ;
If neither foes nor loving friends can hurt you ;
If all men count with you, but none too much ;
If you can fill the unforgiving minute
With sixty seconds’ worth of distance run -
Yours is the Earth and everything that’s in it,
And - which is more - you’ll be a Man my son !

Collège Arc de Meyran – Chemin de la Cible - 13100 Aix-en-Provence – Responsable de publication : Mme AUBERT
Dernière mise à jour : vendredi 10 janvier 2020 – Tous droits réservés © 2008-2020, Académie d'Aix-Marseille