Aide mémoire : Les images dans l'éditeur texte

Dernière mise à jour de l'article : 2024-08-28 07:40:09 -0400

TABLE DES MATIÈRES

Ajouter une image existante dans l'éditeur de texte

Ce document vous aide à intégrer et à modifier vos images et vos photographies dans votre éditeur de texte.

1. Dans l'éditeur texte, placez votre curseur à l'endroit où vous souhaitez insérer l'image.


2. Cliquez sur l'icône Image (Insérer / Éditer une image).







3. Une fenêtre d’édition d’image s’ouvrira. Cliquez sur l’icône à la droite du champ URL pour parcourir vos images.





4. Dans la fenêtre « Gestion de documents », recherchez l'image souhaitée dans votre gestionnaire de documents et sélectionnez-la dans le dossier approprié.





5. Sélectionnez votre image à l'aide de la case à cocher (1) et cliquez sur « Insérer » (2) pour ajouter l'image à votre éditeur de texte.







Importez une image pour l’ajouter à l'éditeur de texte



1. Dans l'éditeur texte, placez votre curseur à l'endroit où vous souhaitez insérer l'image.


2. Cliquez sur l'icône Image (Insérer / Éditer une image).







3. Une fenêtre d’édition d’image s’ouvrira. Cliquez sur l’icône à la droite du champ URL pour parcourir vos images.




4. Pour ajouter une nouvelle image dans la fenêtre « Gestion de documents ».


1- Cliquez sur le bouton « Transférer », situé en haut à droite de la fenêtre.


2- Déposez votre nouvelle image à l’endroit où il est écrit « Glisser les fichiers ici ».


3- Utilisez également le bouton « Ajouter des fichiers » pour rechercher et sélectionner vos images.


 


5. Dans la fenêtre de transfert, vous verrez une barre de progression indiquant le pourcentage du téléchargement et le temps restant.
Une fois le téléchargement terminé, cliquez sur le bouton « Transférer ».



 



6. Sélectionnez votre image à l'aide de la case à cocher (1) et cliquez sur « Insérer » (2) pour ajouter l'image à votre éditeur de texte.







Modifier l'apparence de votre image dans l'éditeur texte 


1. Pour modifier l'apparence de votre image, cliquez sur l'image, faites un clic droit et sélectionnez l'option « Insérer / Éditer une image », ou utilisez l'icône correspondante.







2. Une fenêtre d’édition d’image s’ouvrira pour vous permettre de modifier l'apparence de votre image.


1- Cliquez sur l'onglet « Apparence ».

2- Le champ « Alignement »:  vous permet de définir l'alignement de votre image.


3- La case gauche du champ « Dimensions»: Vous permet de définir la taille de votre image.
Veuillez toujours inscrire un pourcentage de grandeur d’image dans la case de droite.


4- La case droite du champ « Dimensions»: Veuillez effacez le contenu pour que le mode responsive fonctionne correctement. Évitez d’utiliser des tailles fixes pour vos images ; un pourcentage est préférable pour un affichage adaptatif.


5- Les champs «Espacement vertical» et « Espacement horizontal » : vous permettent d'ajouter un espace vertical et/ou horizontal entre l'image et les autres éléments dans l'éditeur.


6-  Le champ « Classe  »: Vous permet de définir la fonction de l'image insérée. 

Dans ce cas, sélectionnez « responsive_img » (image adaptative) dans le menu déroulant.


7- Cliquez sur « Insérer » pour appliquer les paramètres définis à votre image dans la page libre.






3. Voici un exemple d'image intégrée dans l'éditeur de texte à 60 % de la largeur de l'éditeur (la hauteur reste proportionnelle). Vous pouvez également choisir de la centrer en cliquant sur « Centrer ».









Pour comprendre l'utilisation des classes dans votre éditeur texte 



Découvrez avec cette vidéo comment utiliser judicieusement les classes dans l’éditeur de texte afin de créer du contenu dynamique et attractif pour vos visiteurs !

Bon visionnement !
















Cet article a-t-il été utile ?

C'est super !

Merci pour votre commentaire

Désolé ! Nous n'avons pas pu vous être utile

Merci pour votre commentaire

Dites-nous comment nous pouvons améliorer cet article !

Sélectionner au moins l'une des raisons
La vérification CAPTCHA est requise.

Commentaires envoyés

Nous apprécions vos efforts et nous allons corriger l'article

Viglob

Simplifiez la gestion de votre organisation.