Ville de Somain

Intégrer des images aux articles et à la photothèque

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

  1. Elles peuvent faire parti 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 sous le titre "photos associées" (voir en exemple en bas de cette article).
  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.

Recadrer l’image

Pour recadrer l’image, vous disposez de 2 outils :

  • Une petite croix est visible sur les vignettes des documents que téléversez sur votre site. Elle permet de créer un focus autour duquel l’image est automatiquement recadrée.
  • Un outil nommé "Modifier et recadrer une image" permet de recadrer plus précisément chaque image.

Insèrer une image

Pour insérer une image dans le texte :

  1. Utiliser l’encart "insérer un modèle" visible sur la colonne latérale lorsque vous éditez votre article.
  2. Choisir "un document"
  3. Plusieurs options apparaissent : Choisir tout d’abord le document à inclure. Si celui-ci est déjà associé à votre article , cliquer sur "Parcourir l’article". Puis selectionner le document voulu, sinon, cliquer sur "Parcourir la médiathèque". Puis sélectionner le document voulu danss l’ensemble de documents du site.
  4. Puis sélectionnez les options ci-dessous en fonction de vos besoins.

Placer une vignette ou insérer le document ?

Lorsque vous insérez un document, un encart gris apparaît autour de celui-ci de manière à englober l’ensemble des éléments qui seront affichés dans l’espace dédié à celui-ci.

Lorsque vous affichez une vignette, un aperçu de la vignette apparaît seul (sans encart).

Carnaval
Vignette affichée
Carnaval
Document inséré

Alignement :

Une image peut être alignée à gauche, centrée, Ou alignée à droite.

Carnaval
image alignée à gauche
Carnaval
image alignée à droite
Carnaval
image sans alignement
Carnaval
image centrée

Une image alignée à gauche ou à droite laisse passer du texte ou d’autre élément sur l’un des deux cotés de l’image. 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.

Ne pas mettre d’alignement sur une image peut permettre de placer celle-ci entre une image alignée à gauche et une image alignée à droite.

Une image centrée prend toute la largeur de la page. Aucun alignement est alors possible.

Par contre, une image centrée ne laissera passer aucun texte sur ses coté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 à 771px de large pour qu’elle ne puisse pas déborder de la largeur de la page.

Redimensionnement

Les images sont disponibles en 5 dimensions : icone, petit, moyen, grand et original.
Il est aussi possible de personnaliser les dimensions pour avoir une image à la dimension exacte souhaitée.
Il est possible de réduire une image, mais il n’est pas possible de l’agrandir. Sinon celle-ci serait pixelisée.

Carnaval
icone
Carnaval
Petite taille
Carnaval
Moyenne taille
cette taille est idéale pour créer des lignes de trois images
Carnaval
Grande taille
cette taille est idéale pour créer des lignes de deux images
Carnaval
Taille originale


Attention : Pour afficher une image en grandeur nature, il faut sélectionner "ne pas redimensionner" dans le champ date. Contrairement à ce que l’on pourrait penser, sélectionner "grand" n’est donc pas (forcement) le plus grand redimensionnement possible.

Une image trop grande est automatiquement redimensionnée à 771px de large pour qu’elle ne puisse pas dépasser la largeur de la page.

Si l’image est plus grande, un clic sur celle-ci l’affichera aux dimensions originales. Attention tout de même à ne pas afficher d’images trop grandes. Elle ralentiraient le site en mettant trop de temps à se charger. Le site est d’ailleurs limité aux images de moins de 3500px de large et de 3000 px de haut (ces dimensions sont déjà plus importante que n’importe quel écran du marché !).

Légende

Il est possible d’insérer une multitude d’informations (Titre, description, Type de document, crédits, poids (en octet) ) sous forme de légende. Pour modifier ces informations, cliquez sur "modifier" dans la colonne de gauche sous le documents.

Carnaval

Liens

Il est possible de créer un lien sur une image. l’image ci-dessous pointe sur le site des Gilles de Bachy.
Carnaval

Descriptif

De manière à respecter les normes à d’accessibilité, lorsque vous insérez une image, vous devez nécessairement ajouter un descriptif à destination des personnes malvoyantes. Le champ "Texte alternatif" est fait pour cela.

Dispositif pour éviter les doublons dans le diaporama

Pour éviter les redondances, les images insérés dans le texte de l’article seront automatiquement retirées de la galerie en bas de page

Photothèque

Lorsqu’un article contient au moins 2 photos d’une largeur de plus de 250px, celles-ci sont ajoutées à la photothèque du site

Plan du site

Nous contacter

Place Jean Jaurès
BP 39 - 59490 Somain
03 27 86 93 00 Contact

Horaires

Du lundi au jeudi :
de 8h30 à 12h30 et de 13h30 à 18 h
Le vendredi :
de 8 h 30 à 19 h (sans interruption)