FFCT-Centre-Val de Loire
Le cyclotourisme dans la région Centre-Val de Loire
Les rubriques du site :
Photo gagnante du concours jeunes
2019
La citation du jour
Gilbert Cesbron : En chacun de nous, c'est Dieu qui pédale et le Diable qui fait la roue libre.
AG2015> Les photos du concours photo
Dernières brèves
21 janvier ANNULÉE > SF2020, une experience a vivre.

La Semaine Federale SF2020 se tiendra du 2 au 9 août à Valognes dans le Cotentin avec un programme route et VTT sur des tracés accessibles mais (...)

AG2015> Les photos du concours photo
Catégories
- Documentation
- Commissions
- Organisations
- Dossiers
- espaces
- Qualifications
- Gestion du site
- Glossaire
2018 2017
FFCT-Centre-Val de Loire

Toute l’information régionale du tourisme à vélo et du cyclotourisme.

https://ffct-centre.org


Cours précédent :Préparer une image << Le programme >> Cours suivant :Créer un portfolio


 Le cours

Dans le cours 12 (Positionner une illustration dans le texte d’un article.), la position de l’image a été abordée : au centre, à droite ou à gauche. Mais les essais ont peut-être montré la limite de cette technique : il ne faut pas que l’image soit trop grande et on ne peut pas positionner une petite image au milieu du texte. Il existe une autre utilisation des images : les utiliser comme logo.

Pour ce site, à partir de 300 pixels de large, il est très fortement recommandé de ne positionner une image ni à droite (right) ni à gauche (left). Donc, toujours au milieu (center).

Avant de publier un article, il est possible d’être tenté de mettre un logo. Sur ce site, celui du secteur qui contient l’article est automatiquement associé s’il n’y a pas de logo spécifique. Note : un secteur est une rubrique à la racine du site.

Pour ajouter un logo, enregistrer la page pour quitter le mode édition. A gauche du titre, un cadre affiche "LOGO DE L’ARTICLE". Cliquer sur parcourir. Sur la machine, sélectionner l’image retenu (fichier jpg ou png ou gif). Cliquer sur ouvrir pour revenir à la page de départ. Cliquer sur "Téléverser". Et c’est tout : Spip   fera le reste. Pour faciliter le travail, inutile de mettre des images de grande taille : au maximum 150 pixels sur 150 pixels mais 75 pixels x 75 pixels suffisent amplement (et le fichier ne fera qu’une dizaine de Ko.)

La juxtaposition de photos sera abordée au cours suivant (Créer un portfolio) : en fait, on verra surtout comment s’en passer.

Comment ajouter une photo "personnalisée" ?

Une photo n’est rien d’autre qu’un document. Pour ajouter une photo, rester en mode édition et utiliser le cadre à gauche du titre de l’article en haut de la page d’édition : "Ajouter une image ou un document". Cliquer sur "Parcourir". Sur la machine, sélectionner l’image retenue (les fichiers images sont généralement de type jpg ou png ou gif). Tous les autres types de fichiers peuvent être ajoutés mais le éventuelles images ne pourront pas être utilisées pour illustrer l’article. Cliquer sur "Ouvrir" pour valider le choix et revenir à la page de départ. Cliquer sur "Téléverser". Il n’y a plus qu’à recopier le code obtenu (voir la procédure au cours n°12 : Positionner une illustration dans le texte d’un article.).

Comment ajouter une légende à une photo ?

Un exemple valant largement un long discours, utilisons l’image du logo du coreg   Centre-Val de Loire.

Voici l’image "brute" :
Le logo du Coreg Centre-Val de Loire

Attention, si l’image a un titre, elle apparaîtra au survol de l’image par la souris.

Voici la même image avec un titre, un descriptif et son crédit [1]

Le logo du Coreg Centre-Val de Loire
Cette version du logo fait 250 pixels de large et ne pèse que 34.3 Ko !

Le titre est affiché en gras juste au-dessous de l’image et son descriptif juste au-dessous. Le crédit [2] n’est pas affiché mais reste associé à l’image.

Pour ajouter le titre et le descriptif, en mode édition de l’article, après avoir télécharger le fichier image, cliquer sur le bouton "Modifier". Dans la fenêtre qui s’ouvre alors, renseigner les champs "Titre" (pas trop long puisque c’est un titre). Ajouter éventuellement un descriptif (ce n’est pas obligatoire) et facultativement le crédit. Ne pas oublier d’enregistrer (clic sur le bouton "Enregistrer"). Dans le code "img" a été remplacé par "doc". C’est ce code qu’il faut retenir pour afficher titre et descriptif.

Récapitulatif (synthèse)

Conseils

Pour que les imagettes d’illustration soient correctement disposées, voici quelques petites astuces qui devraient répondre à quelques petits problèmes de mises en page.

Avec le paramètre "left" (à gauche), il est fortement conseillé de mettre le code d’insertion en début de paragraphe alors qu’avec le paramètre "right" (à droite), c’est plutôt en fin de paragraphe. Avec le paramètre "center" (au centre), le code devrait être mis seul sur une ligne.


 Exercices

  • ajouter des fichiers images (jpg, png ou gif) et les inclure dans un article en affichant ou non titre et descriptif.

 Auto-évaluation

- Quelle est la taille préconisée pour insérer un logo à un article du site sous Spip ?
- Quels sont les deux codes principaux (les plus fréquemment utilisés) qui peuvent précéder le numéro d’une photo et son positionnement avec Spip?
- Qui attribue le numéro d’une image adjointe à un article sous Spip ?


Cours précédent :Préparer une image << Le programme >> Cours suivant :Créer un portfolio



Pour contacter le formateur, cliquer sur le lien suivant : contact

samedi 14 mars 2020 , par Roland Bouat (MDT)


[1Le crédit de l’image est l’attribution de l’auteur de l’image.

[2si le crédit n’est pas indiqué, la photo est considérée sous le crédit du coreg Centre-Val de Loire.

Mots clés : doc. web, Formation, web

Un message, un commentaire ?

modération a priori

Ce forum est modéré a priori : votre contribution n’apparaîtra qu’après avoir été validée par un administrateur du site.

Qui êtes-vous ?
Votre message

Pour créer des paragraphes, laissez simplement des lignes vides.

Ajouter un document


Article précédent : SNEJ 2020 : le projet pédagogique

Article suivant : Créer un portfolio