Vous êtes ici : Accueil -> Forum - Site - Divers -> Tutoriel pour les rédacteurs -> Tutoriel pour les rédacteurs - SPIP - Mettre une image dans un article

Tutoriel pour les rédacteurs - SPIP - Mettre une image dans un article

D 28 juillet 2007     H 22:30     A Pierre     C 0 messages A 5474 LECTURES


agrandir

Tutoriel illustré à l’usage des rédacteurs du site : pas à pas, la méthode pour insérer une image dans un article

Les étapes (en zone "privée") :

Etape 1 : mettre l’article en mode modification. Clic sur le bouton "Modifier cet article"
Etape 2 : sélectionner l’image à insérer. En cliquant sur "parcourir" vous ouvrez une fenêtre avec les répertoires de votre ordinateur. Choisissez l’image à insérer.

Important : la taille des images : Dans la plupart des cas une image de 550-600 pixels de large sera tout à fait suffisante pour remplir le corps de l’article en pleine page, sans texte ni à droite, ni à gauche de l’image.

Au-delà de cette taille, il y a risque de faire "éclater" la page avec des ascenseurs horizontaux du plus mauvais effet.

Pour une image "habillée" par du texte, une largeur de 350-400 pixels est suffisante.

La mise des images à la dimension voulue doit être faite avec un programme adapté à cet usage, avant le téléchargement.

Pour les utilisateurs habitués aux logiciels de traitement d’images,

- les images au format jpeg conservent leur qualité jusqu’à un certain niveau de compression. Il n’est donc généralement pas nécessaire d’utiliser des images de haute définition. Une définition moyenne permet d’accélérer l’affichage de la page et charge moins le serveur.

- les images au format gif et png permettent les transparences.

JPEG -
Dimensions de cette image (Titre)
210 pixels de large x 142 pixels de haut (description).

Cette image est en mode "left"Etape 3 : clic sur le bouton "télécharger" pour transférer une copie de l’image vers le serveur distant.

L’image téléchargée s’affiche en miniature.

Il est possible de saisir pour cette image un titre et une description ou un commentaire

Confirmer la saisie en cliquant sur le bouton "Enregistrer", dans ce cadre.

JPEG -
Cette image est en mode "left"

Etape 4 : choisir le mode d’habillage image/texte

- avec le mode "left", l’image se place à gauche du texte, et le texte "habille" la droite de l’image

- avec le mode "center", il n’y a aucun texte de part et d’autre de l’image

- avec le mode "right", l’image se place à droite du texte, et le texte "habille" la gauche de l’image

JPEG -
Cette image est en mode "right"
Elle fait 481 pixels de large.

Etape 5 : placer le code image dans le texte. Pour cela : ou bien saisir à la main, ou faire un copier-coller du code qui est à côté de l’image miniature. Autre méthode : placer le curseur clignotant à l’endroit du texte où l’image doit être insérée, puis faire un double-clic sur le code-image retenu.

L’image s’affichera dans la page à l’endroit où vous placez le code (ne pas oublier les crochets "<" et ">" au début et à la fin du code image, et le séparateur obtenu par [AltGr] et la touche [6] en haut du clavier.

Attention : si vous avez saisi un titre (et commentaire) pour l’image à l’étape 3, remplacer les lettres "img" par "doc", sinon le titre et le commentaire ne s’affichent pas.

Etape 6 : sauvegarder l’article
JPEG -
Cette image est en mode "center"

sinon, vous auriez fait tout cela pour rien.

Etape 7 : vérifier en ligne si tout va bien

Répondre à cet article

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 ?
  • [Se connecter]
Votre message
Ajouter un document

Suivre les commentaires : RSS 2.0 | Atom

Les mots-clés de l'article

pour en savoir plus sur : Site Histoire Passion - SPIP -

Chercher dans le site

Les plus lus --- Les 50 +

1.  Calendrier révolutionnaire ou républicain - Conversion en date grégorienne

2.  Carte satellite des voies romaines, des chemins anciens de Saintonge, Aunis et Angoumois

3.  FAQ & R - Le Forum Aux Questions ... & aux Réponses

4.  Conversion des monnaies d’avant la Révolution en valeur actuelle

5.  Carte satellite Googlemap avec moteur de géolocalisation : rechercher une ville, une commune, un village


5 articles au hasard

1.  1860 - Société Archéologique et Historique de la Charente - Bulletins et mémoires - Série 3 Tome II

2.  1863 - Pièces angoumoisines inédites ou rares - Sté Archéologique et Historique de la Charente

3.  1532 - Mesnac (16) - Déni de grossesse ? - qui a jeté le bébé dans le puits ? - suivez l’enquête...

4.  1699 - Mémoire sur la Généralité de la Rochelle - Election de St Jean d’Angély

5.  Histoire du Château de Gademoulins à Gensac-La Pallue (16) par Paul de Lacroix (1906)


Les plus populaires --- Les 50 +

1.  Les enceintes urbaines et villageoises de Saintonge et d’Aunis

2.  Carte satellite des voies romaines, des chemins anciens de Saintonge, Aunis et Angoumois

3.  Conversion des monnaies d’avant la Révolution en valeur actuelle

4.  Carte satellite Googlemap avec moteur de géolocalisation : rechercher une ville, une commune, un village

5.  1120 - Cartulaire de l’église d’Angoulême - Terre de Bouchereau à Macqueville (17)


Brèves --- Toutes

1.  Au château de la Roche Courbon, fête de la préhistoire les 23 et 24 avril 2016

2.  Antiquité-Avenir. Réseau des Associations liées à l’Antiquité - Communiqué de presse

3.  Temples de la Saintonge Maritime : Une histoire mouvementée

4.  2.644.259 visiteurs sur Histoire Passion - Statistiques au 31/12/2013

5.  Archéologie et histoire du fleuve Charente à Taillebourg - Port d’Envaux