Rédiger et Modifier

Éditeur WordPress : Utiliser des blocs

Vous utilisez l’éditeur WordPress pour créer les pages et les articles de votre site Web. Voici comment utiliser l’éditeur.

Il s’agit d’un guide complet couvrant l’ensemble des fonctionnalités de l’éditeur WordPress.

Pour démarrer rapidement, accédez à comment ajouter du contenu à l’aide de blocs, visionnez ces vidéos ou suivez nos didacticiels de démarrage ici.

Table des matières

l'Éditeur WordPress avec un bloc Bannière, du texte et un bouton.
L’éditeur de blocs de WordPress

Vous pouvez utiliser l’éditeur WordPress pour créer des pages et des articles riches en contenu multimédia et pour contrôler facilement la mise en page. Vous n’avez plus à vous inquiéter de l’alignement et de l’organisation du texte, des citations et des images. Désormais, chaque élément d’un article ou d’une page possède son propre bloc. Vous n’avez plus qu’à vous concentrer sur la création.

Si votre éditeur est différent de la description fournie dans ce guide, consultez ces informations utiles sur les différents éditeurs.


Éléments de l'Éditeur WordPress

L’éditeur WordPress est constitué de trois zones : le menu supérieur, les menus latéraux et la zone de contenu principal.

Menu supérieur de l’éditeur WordPress

affiche les options dans le haut de l'éditeur pour l'ajout d'un bloc, la publication d'un article et l'ouverture du menu des paramètres.
Menu supérieur de l’éditeur WordPress

Options du menu supérieur

une icône plus.

Ajouter des blocs : parcourez tous les blocs, compositions de bloc et blocs réutilisables disponibles.

une icône en forme de crayon

Modes : les outils permettent différentes interactions pour la sélection et l’édition de blocs. Pour sélectionner, appuyez sur Échap, revenez à l’édition, puis appuyez sur Entrée.

icônes en forme de flèches vers la gauche et vers la droite.

Annuler et Rétablir : annulez une action ou rétablissez une action annulée.

un « I » entouré d'un cercle comme icône d'information.

Détails : le nombre de caractères, mots, en-têtes, paragraphes et blocs utilisés dans le document.

trois lignes verticales empilées

Vue d’ensemble : une liste de l’ensemble des blocs utilisés sur la page. Utile pour la navigation entre les différents blocs

Avant de publier votre page ou article, les options suivantes s’affichent :

liens avec le texte « Enregistrer le brouillon », « Aperçu », et un bouton « Publier ».

Enregistrer le brouillon : enregistrez un brouillon de votre page ou article
Aperçu : découvrez à quoi ressemble votre page/article avec le thème appliqué.
Publier : publiez votre page/article.

Une fois votre page ou article publié(e), les options suivantes sont disponibles :

liens avec le texte « Enregistrer en brouillon », « Aperçu », et un bouton « Mettre à jour ».

Enregistrer en brouillon : annulez la publication de la page ou de l’article et revenez au brouillon.
Aperçu : découvrez à quoi ressemble votre page/article avec le thème appliqué.
Mettre à jour : mettez à jour votre page/article publié avec le contenu nouvellement ajouté.

une icône pour les paramètres.

Paramètres : affichez ou masquez la page, le document et le menu de la colonne latérale Paramètres du bloc.

une icône avec un A au milieu.

Styles globaux : si vous utilisez un thème qui prend en charge des styles globaux, cette option vous permet de modifier les styles de police sur l’ensemble de votre site.

une icône vert et blanc pour Jetpack.

Jetpack : vous permet d’activer/désactiver les J’aime sur certaines pages et certains articles, d’afficher l’aperçu de vos partages sur les réseaux sociaux et d’obtenir le lien court vers votre page ou article.

icône avec trois points verticaux.

Options : ouvre les options d’affichage, le style de l’éditeur et les outils supplémentaires.

Menu de la colonne latérale de l’éditeur WordPress

Les icônes Paramètres, Styles globaux et Jetpack dans le menu supérieur ouvrent différents menus dans la colonne latérale.

📌

Si vous n’utilisez pas un menu de la colonne latérale lorsque vous êtes dans l’éditeur de blocs, cliquez sur l’une des trois icônes dans le menu supérieur, près du bouton Publier/Mettre à jour.

Paramètres

Le menu de la colonne latérale Paramètres inclut les paramètres de votre page/document :

Lorsque vous cliquez sur un bloc spécifique, le menu de la colonne latérale Paramètres reprend des paramètres de bloc supplémentaires spécifiques à chaque type de bloc.

le menu supérieur avec l'icône Paramètres active.
Icône Paramètres

Styles globaux

Le menu Styles globaux vous permet de modifier les polices par défaut utilisées pour les en-têtes et le texte de base sur l’intégralité de votre site.

le menu supérieur avec l'icône Styles globaux active.
Icône Styles globaux

Jetpack

Le menu latéral Jetpack vous permet :

le menu supérieur avec l'icône Jetpack active.
Icône Jetpack

Zone de contenu de l’éditeur WordPress

Le troisième élément de l’éditeur WordPress est l’endroit où vous passerez le plus de temps. Il s’agit de la section principale de l’éditeur, où vous ajoutez des blocs de contenu.

L’éditeur offre une expérience en matière de création d’articles et de pages en toute simplicité. Les blocs vous permettent d’ajouter et de personnaliser rapidement plusieurs éléments visuels et média qui requièrent habituellement des codes abrégés compliqués, du code HTML personnalisé et des intégrations.

💡

Vous pouvez également commencer à rédiger immédiatement et réfléchir à la mise en page ultérieurement (ou jamais !)

Voici un guide pratique pour l’utilisation de l’éditeur WordPress comme outil de rédaction ou de création d’articles de blog.


↑ Table des matières ↑

Ajouter du contenu à l'aide de blocs

Dans l’éditeur WordPress, vous utiliserez des blocs pour créer du contenu. Il existe un bloc pour chaque élément que vous pourriez avoir envie d’ajouter : texte, images, vidéos, sons, colonnes, espaces, sauts de page, boutons de paiement, calendriers et bien plus encore !


↑ Table des matières ↑

Ajouter un bloc

Vous pouvez choisir parmi de nombreux  types de bloc, qui sont organisés par catégorie. Vous pouvez modifier ou déplacer chaque bloc indépendamment des autres. Certains blocs intègrent parfois leurs propres réglages de formatage pour offrir encore plus de contrôle sur la mise en page et leur fonctionnement.

une capture d'écran des différentes méthodes permettant d'ajouter de nouveaux blocs à l'éditeur WordPress.
Ajout de nouveaux blocs

Vous pouvez ajouter un bloc ou choisir le type de bloc dont vous avez besoin de plusieurs manières :

💡

Le moyen le plus rapide d’ajouter un bloc est de rechercher l’icône + sur votre écran. Dès que vous voyez l’icône +, vous pouvez cliquer pour ajouter un bloc.

Vous pouvez également écrire dans une zone vierge, qui correspond par défaut à un bloc Paragraphe.

  1. Cliquez sur l’icône + noire à côté d’un bloc vide.
  2. Cliquez sur l’icône + en haut à gauche de l’éditeur. Cette option est idéale pour afficher l’aperçu des différents styles de bloc.
  3. Appuyez sur la touche Entrée/Retour à partir d’un bloc sélectionné pour créer un nouveau bloc juste au-dessous.
  4. Cliquez sur les trois points juste au-dessus du bloc sélectionné et choisissez d’ajouter un bloc au-dessus ou au-dessous de ce dernier.

Une fois que vous vous êtes familiarisé(e) avec les noms des différents blocs, vous pouvez ajouter un bloc en entrant une barre oblique suivie d’un nom de bloc, comme /image ou /heading, par exemple.

exemple d'utilisation du raccourci clavier / pour rechercher différents blocs.
Raccourci pour ajouter un bloc

Afficher les blocs que vous utilisez le plus

Pour activer la catégorie regroupant les blocs les plus utilisés, procédez comme suit :

  1. Cliquez sur l’icône des trois petits points en haut à droite de l’écran de l’éditeur.
  2. Choisissez Préférences.
  3. Cochez la case en regard de Afficher les blocs les plus utilisés.
les préférences générales avec la case « Afficher les blocs les plus utilisés » cochée.
Afficher les blocs les plus utilisés

Une fois l’option blocs les plus utilisés sélectionnée, vous pouvez parcourir les blocs que vous utilisez le plus dans la bibliothèque de blocs.

Cliquez sur l’icône + dans le menu supérieur pour accéder à la bibliothèque de blocs. Vos blocs les plus utilisés s’afficheront en haut dans la bibliothèque.

la bibliothèque de blocs développée, avec les blocs les plus utilisés visibles.
Catégorie regroupant les blocs les plus utilisés

↑ Table des matières ↑

Déplacer des blocs

Vous pouvez déplacer des blocs en sélectionnant et en faisant glisser les six points de la barre d’outils de bloc qui s’affichent lorsque vous cliquez dans un bloc. Vous pouvez également utiliser les flèches haut et bas pour faire glisser un bloc d’un emplacement vers le haut ou vers le bas.

Déplacement des blocs

↑ Table des matières ↑

Personnaliser des blocs

Chaque bloc possède ses propres réglages. Pour les trouver, cliquez sur un bloc : une barre d’outils apparaît en haut du bloc. Vous trouverez d’autres réglages dans la colonne latérale située dans la partie droite de l’éditeur.

📌

Si vous ne voyez pas les réglages du bloc à droite de votre éditeur, cliquez sur l’icône de réglages ⚙️ (qui ressemble à un engrenage ou un pignon) en regard du bouton Publier/Mettre à jour pour développer le menu de la colonne latérale.

l'icône Paramètres en regard du bouton Publier en surbrillance.

Exemples des différentes barres d’outils de bloc

Barre d'outils du bloc de paragraphe située au-dessus du bloc.
Barre d’outils du bloc de paragraphe
Barre d'outils du bloc d'image située au-dessus du bloc.
Barre d’outils du bloc d’image
Barre d'outils du bloc de liste située au-dessus du bloc
Barre d’outils du bloc de liste

Réglages du bloc – Barre d’outils

Cliquez sur les trois points à droite de la barre d’outils du bloc pour accéder à des options supplémentaires qui sont présentes dans la plupart des blocs.

  1. Masquer les réglages du bloc permet de fermer le menu des réglages.
  2. Dupliquer permet de créer un second bloc sur la même page reprenant le même contenu.
  3. Insérer avant/après permet d’ajouter un nouveau bloc avant ou après le bloc actuel.
  4. Modifier en HTML permet de basculer le bloc en mode HTML afin de pouvoir modifier directement le code HTML. En mode de modification HTML, cette option devient Modifier visuellement.
  5. Ajouter aux blocs réutilisables vous permet de créer un bloc utilisable sur d’autres pages afin de conserver le contenu et le style du bloc. En savoir plus.
  6. Supprimer le bloc permet de supprimer le bloc de votre page/article.
le menu des petits points (Plus d'options) développé pour afficher les options de bloc supplémentaires.
Options de barre d’outils de bloc supplémentaires

⚠️

Tous les codes ne sont pas opérationnels lors de l’édition en HTML. Si votre code est correct et sans erreur, vérifiez qu’il figure dans la liste des balises HTML approuvées et qu’il ne s’agit pas d’un code restreint, comme JavaScript.

Réglages du bloc – Colonne latérale

Les réglages du bloc sur la droite de votre éditeur proposent différentes options en fonction du bloc utilisé.

Sur la capture d’écran à droite, le bloc actif est un Paragraphe. Il y a donc des options pour modifier la taille de la police, la couleur de la police et de l’arrière-plan, ainsi que des options avancées pour créer des sauts de page ou ajouter une classe CSS.

📌

Si vous ne voyez pas les réglages du bloc à droite de votre éditeur, cliquez sur l’icône de réglages ⚙️ (qui ressemble à un engrenage ou un pignon) en regard du bouton Publier/Mettre à jour pour développer le menu de la colonne latérale.

l'icône Paramètres en regard du bouton Publier en surbrillance.
la colonne latérale des paramètres du bloc affichant les options du bloc de paragraphe, telles que les paramètres de texte, de couleur et AMP.
Les réglages du bloc dans la colonne latérale intègrent des options supplémentaires propres au bloc que vous modifiez.

↑ Table des matières ↑

Modifier le type de bloc

Que se passe-t-il si vous voulez modifier un type de bloc ? Aucun problème ! Vous pouvez transformer chaque bloc en un autre type de bloc similaire ou associé. Par exemple, vous pouvez transformer un paragraphe en titre, liste ou citation.

une capture d'écran de l'option de barre d'outils du bloc montrant le changement du type de bloc de paragraphe à citation ou en-tête.
Modification d’un type de bloc

↑ Table des matières ↑

Certains blocs sont imbriqués dans d’autres blocs (appelés bloc parent). Vous devez pouvoir sélectionner facilement le bloc parent. 

Vous avez par exemple un bloc de colonnes dont vous voudriez étendre la largeur au maximum. Cliquer sur une colonne spécifique ne vous donnera pas cette option. Accéder au bloc parent (le bloc de colonnes) vous donnera la possibilité de modifier le style de mise en page du bloc Colonnes.

Pour sélectionner le bloc parent, placez-vous sur l’icône la plus à gauche sur la barre d’outils du bloc, comme dans la capture d’écran :

une capture d'écran de la sélection de l'option du bloc parent sur la barre d'outils du bloc.

Cette fonction peut s’avérer pratique si vous devez sélectionner un bloc de colonnes contenant du texte ou si vous devez sélectionner un bloc de boutons contenant plusieurs boutons.

Vous pouvez également utiliser le menu Détails pour naviguer parmi les blocs que vous avez ajoutés à votre page/article :

le menu Détails dans le menu supérieur développé pour afficher la liste des blocs utilisés sur la page/l'article.

Le menu Détails est une liste déroulante de tous les blocs insérés sur votre page ou article. Il permet de voir la structure de votre page et de sélectionner un bloc existant sur lequel vous voulez travailler.


Pour accéder au menu Détails, cliquez sur l’icône qui ressemble à une petite liste à puces avec trois lignes horizontales. Elle se situe après la structure du contenu (icône d’informations) dans le coin supérieur gauche de l’éditeur.

Le menu Détails est particulièrement utile pour accéder à des blocs difficiles à atteindre, comme une colonne individuelle dans un bloc de colonnes ou un bloc dans un bloc de groupe :

une capture d'écran du menu Détails développé avec la sélection d'un bloc spécifique pour activer le bloc.
À l’aide de l’outil bloc de navigation, vous pouvez accéder directement à n’importe quel bloc sur la page pour le modifier.

↑ Table des matières ↑

Supprimer un bloc

Pour supprimer un bloc, sélectionnez-le et cliquez sur les trois points dans la barre d’outils juste au-dessus. Parmi les réglages figure l’option de suppression du bloc.

les petits points du menu de la barre d'outils du bloc développé pour sélectionner l'option Supprimer le bloc en surbrillance.
Supprimer un bloc

↑ Table des matières ↑

Compositions de bloc

Les compositions de bloc sont une collection de blocs que vous pouvez insérer dans des articles et des pages. Elles vous permettent d’ajouter du contenu dans des compositions visuellement attrayantes.

Par exemple, il existe un bloc « Motifs » pour insérer trois images côte à côte.

Pour insérer un bloc « Motifs » :

  1. Cliquez sur l’icône + dans le menu supérieur pour ajouter un nouveau bloc.
  2. Cliquez sur l’onglet Compositions.
  3. Cliquez sur la composition à insérer. La composition sera alors insérée dans le document à l’emplacement de votre curseur.
l'icone + dans le menu supérieur développé et l'option Compositions sélectionnée pour afficher les différentes compositions de bloc disponibles.

Pour plus d’informations, consultez notre guide sur le bloc « Motifs ».


↑ Table des matières ↑

Aperçu de la page ou de l'article

Même si l’éditeur de blocs vous offre une représentation visuelle du rendu de la page une fois publiée, certains petits changements peuvent être visibles une fois le thème ou la personnalisation de thème appliqué(e).

l'option Aperçu avec un cadre pour la mettre en évidence.
L’option Aperçu dans le menu supérieur

L’option Aperçu charge la page sur laquelle vous travaillez, avec le thème et les personnalisations de thème enregistrées (comme CSS personnalisé).

L’aperçu permet également de voir le rendu d’une page ou d’un article sur un PC de bureau, une tablette ou un appareil mobile. Avec le plan WordPress Business ou supérieur, vous pouvez également afficher l’aperçu du rendu de votre page lors de recherches et de partages sur les réseaux sociaux.

dans l'option Aperçu, avec l'affichage des options permettant de viualiser le rendu sur un PC de bureau, une tablette, un téléphone ou les réseaux sociaux.
Aperçu sur différents appareils

↑ Table des matières ↑

Paramètres du document

À droite de l’éditeur de blocs, le menu Réglages du document vous permet d’ajouter des étiquettes et des catégories, de choisir une image mise en avant, de voir et de modifier l’état de votre article, entre autres. Ces options s’appliquent à l’intégralité de la page ou de l’article.

Cliquez sur la flèche bas en regard de chaque en-tête dans les réglages du document pour modifier ces options spécifiques.

📌

Si vous ne voyez pas les réglages du document à droite de l’éditeur de blocs, cliquez sur l’icône de réglages ⚙️ ressemblant à un engrenage/pignon en haut à droite pour ouvrir les réglages du document.

l'icône Paramètres en regard du bouton Publier en surbrillance.

↑ Table des matières ↑

Plus d’options

Personnalisez votre expérience de modification en fonction de vos besoins grâce aux trois points à droite de l’icône Réglages.

Vue

Propose des options permettant de définir l’emplacement des barres d’outils du bloc pendant vos modifications.

Éditeur

L’éditeur visuel est activé par défaut. Basculez vers l’éditeur de code pour afficher l’intégralité de la page en code HTML.

Tous les codes ne sont pas compatibles avec la fonction Modifier comme HTML. Si votre code est correctement rédigé et s’il ne contient pas d’erreur, vérifiez qu’il figure bien dans la liste des étiquettes HTML approuvées et qu’il ne s’agit pas d’un code restreint comme JavaScript.

Outils

Gérez les blocs réutilisables existants, copiez tout le contenu à coller sur une autre page ou découvrez les raccourcis du clavier.

Options

Choisissez les réglages du document présents dans la colonne latérale.

le menu des trois petits points sur la barre d'outils supérieure développé pour montrer l'affichage, l'éditeur, les extensions et les autres paramètres d'affichage pour l'éditeur de blocs.
Plus d’options

↑ Table des matières ↑

Questions fréquemment posées

Comment puis-je modifier le contenu HTML dans l’éditeur WordPress ?

Vous pouvez ajouter un bloc HTML personnalisé si vous souhaitez créer votre propre code HTML.

D’autres options de modification du code HTML dans l’éditeur WordPress sont disponibles ici.

Tous les codes ne sont pas opérationnels lors de l’édition en HTML. Si votre code est correct et sans erreur, vérifiez qu’il figure dans la liste des balises HTML approuvées et qu’il ne s’agit pas d’un code restreint, comme JavaScript.

À quoi ressemblera mon contenu existant ?

Si vous êtes passé de l’éditeur classique à l’éditeur de blocs, votre contenu actuel devrait toujours être le même. Si vous modifiez une page ou un article existant dans le nouvel éditeur, l’intégralité du contenu sera placée dans un bloc classique, dont le traitement sera identique à celui de l’éditeur précédent. Voici plus d’informations sur la conversion en blocs.

Pourquoi l’apparence de mon contenu diffère-t-elle entre l’éditeur et le site ?

Vous pouvez voir quelques différences entre votre contenu dans l’éditeur et sur le site. Cela provient généralement de la façon dont votre thème affiche les différents éléments visuels. Certains thèmes incluent des styles pour que l’éditeur ressemble davantage à la page d’accueil du site, contrairement à d’autres. Si votre thème comprend une colonne latérale, par exemple, vous ne la verrez pas dans l’éditeur, ce qui peut avoir une incidence sur la largeur de votre contenu lors de l’affichage sur votre site.

Pourquoi certains réglages sont-ils disponibles sur l’un de mes sites, mais pas sur d’autres ?

Si votre site utilise le plan WordPress.com Business, vous possédez peut-être des extensions qui ajoutent des blocs personnalisés à votre éditeur. Ces derniers ne seront pas disponibles sur un autre site qui ne possède pas l’extension concernée.

Certains réglages des blocs (« large » ou « pleine largeur ») doivent être pris en charge par votre thème. Lorsque les mêmes blocs sont présents sur différents sites, les réglages spécifiques applicables à ces blocs peuvent légèrement varier en fonction du thème actif.

Pourrai-je toujours utiliser l’ancien éditeur ?

L’ancien éditeur, également appelé « éditeur classique » peut être utilisé dans l’éditeur de blocs, grâce au bloc classique. Voici comment utiliser le bloc classique.

Les codes abrégés fonctionnent-ils toujours ?

Oui. L’éditeur intègre un bloc de codes abrégés que vous pouvez utiliser pour les codes abrégés comme vous le faisiez auparavant. À l’avenir, de nombreux codes abrégés deviendront des blocs à part entière.

Cet éditeur est-il accessible ?

Notre objectif est que l’éditeur WordPress soit aussi accessible que les éditeurs précédents, si ce n’est plus. Nous souhaitons que tout le monde puisse l’utiliser. Les normes de codage d’accessibilité de WordPress stipulent que « Tous les codes nouveaux ou mis à jour dans WordPress doivent respecter les directives WCAG 2.0 au niveau AA ». Il n’y aura pas d’exception. Si vous rencontrez un problème d’accès, contactez-nous.

Dois-je utiliser un thème particulier pour le nouvel éditeur ?

Non. Le nouvel éditeur de blocs sera compatible avec tous les thèmes. Cependant, seuls certains thèmes prendront en charge des fonctionnalités spécifiques de mise en page (comme le contenu « large » ou « pleine largeur »).

Où puis-je consulter une liste complète des raccourcis clavier ?

Une liste complète des raccourcis clavier est disponible dans le manuel de WordPress.

Comment puis-je afficher le nombre de mots et le correcteur orthographique notamment ?

Pour afficher le nombre de mots que contient votre page ou article, cliquez sur l’icône d’informations qui ressemble à la lettre i dans un cercle en haut à gauche de l’écran. Cette option n’est disponible que sur la version bureau, pas dans la version mobile.

Une vérification orthographique et grammaticale n’est pas proposée, tout simplement parce que tous les navigateurs modernes proposent cette option. Vous pouvez utiliser ce dernier pour corriger les erreurs dans les articles.

Ce guide a-t-il été utile ?