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

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 5483 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.

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.

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

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
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.  1805 - M. Regnaud de Saint-Jean d’Angély plaide en faveur de l’abandon du calendrier révolutionnaire

2.  1260 (c) - Le pseudo-Turpin ou l’histoire légendaire de la Saintonge

3.  Toponymes en Poitou-Charentes : les villas de Pasius

4.  1573-1582 - Angoulême (16) : Disette. Mortalité. Misère générale. Bilan de la guerre civile.

5.  1794 - Les citoyens de La Rochelle expliquent le nouveau système des poids et mesures


Les plus populaires --- Les 50 +

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

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

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

4.  Le théâtre gallo-romain des Bouchauds et Sermanicomagus, la ville disparue

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


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