Migration d’un thème classique vers un « block Theme » avec le « Full Site Editor » (FSE)

Migration d’un thème classique vers un « block Theme » avec le « Full Site Editor » (FSE)

Migrer d’un thème classique WordPress vers un thème de blocs incorporant le nouvel Éditeur de Site ou Full Site Editor (FSE) peut sembler être une tâche complexe. Cependant, avec une bonne compréhension des nouvelles fonctionnalités et des outils disponibles, ce processus de migration peut être fluide et efficace. Ce guide vous accompagne à travers les étapes nécessaires pour réussir la migration de votre thème WordPress classique vers un thèmes à architecture de blocs en utilisant l’éditeur de site (FSE).

Les avantages de migrer vers un thème structuré en blocs

Migrer vers un thème avec système de blocs offre de nombreux avantages. Les « block Theme » WordPress offrent une expérience d’édition intuitive et unifiée, qui vous permet de modifier toutes les zones de votre site directement depuis l’éditeur de site. Cela vous permet de visualiser les changements en temps réel, réduisant ainsi les devinettes et les aller-retours constants autrefois nécessaires pour créer votre site.

De plus, en adoptant la structure du thème de bloc, vous assurez la pérennité de votre site web à mesure que WordPress continue de développer et d’améliorer son système d’éditeur de blocs. Cette transition représente une avancée dans la conception de sites web sur WordPress, vous permettant de tirer parti des dernières avancées en matière de technologie de création de sites.

Un autre avantage distinctif du thème modulaire basé sur des blocs par rapport au thème classique vient du fait que le premier offre plus de flexibilité et de personnalisation. Contrairement à être limité par les contraintes d’un thème traditionnel, vous pouvez mélanger et assortir les blocs pour créer des mises en page uniques, ajouter des designs personnalisés à n’importe quelle partie de votre site et maintenir des styles cohérents avec les paramètres de styles globaux.

Voici une liste non exhaustive des avantages du passage à un thèmes à architecture de blocs à partir d’un thème WordPress classique :

  • Performance améliorée : Les thèmes de blocs sont souvent plus légers et plus rapides, car ils s’appuient sur les fonctionnalités de base de WordPress et n’ont pas besoin de charger des scripts et des styles redondants typiques de nombreux thèmes classiques.
  • Expérience d’édition unifiée : Les thèmes de blocs vous permettent de modifier toutes les parties de votre site directement depuis l’interface d’édition globale du site , offrant une expérience d’édition plus unifiée et intuitive.
  • Changements en temps réel : Visualisez les modifications que vous effectuez en temps réel, réduisant ainsi les devinettes et les aller-retours constants précédemment nécessaires avec les thèmes traditionnels.
  • Plus grande personnalisation et flexibilité : Mixez et assortissez les blocs pour créer des mises en page uniques et ajoutez des designs personnalisés à n’importe quelle partie de votre site. Vous n’êtes plus limité par les contraintes d’un thème traditionnel.
  • Styles globaux : Maintenez des styles cohérents sur l’ensemble de votre site avec les paramètres de styles globaux.
  • Pérennisation de votre site : L’adoption de la structure du thème structuré en blocs assure que votre site web suit les derniers développements alors que WordPress continue d’évoluer son système d’éditeur de blocs.

Comment migrer son theme classique vers Gutenberg ou le FSE ?

  • Sauvegardez votre site Web : Avant de faire des changements significatifs, assurez-vous que vous avez une sauvegarde complète de votre site web.
  • Choisissez un thème de bloc : Recherchez et sélectionnez un template qui convient aux besoins de votre site web.
  • Installez et activez le thème structuré en blocs : Téléchargez et installez le thème que vous avez choisi.
  • Familiarisez-vous avec l’éditeur de thème : Prenez un certain temps pour comprendre comment fonctionne le Full Site Editor et vous familiariser avec l’ajout et l’édition de blocs.
  • Migration du logo du site : Remplacez le logo du site dans le Customizer par un bloc de logo de site dans le FSE
  • Migration des schémas de couleurs : Déplacez vos schémas de couleurs du Customizer vers les styles globaux dans l’éditeur de site.
  • Migration des menus de navigation : Remplacez vos menus de l’Apparence section par le bloc de navigation.
  • Migration des diaporamas de page d’accueil/sections de héros : Remplacez votre diaporama de page d’accueil ou la section de héros par un bloc de couverture.
  • Migration des widgets et de la barre latérale : Remplacez vos widgets et les éléments de la barre latérale de l’Apparence section par des blocs correspondants.
  • Vérifiez les options du thème : Examinez toutes les options spécifiques au thème et comprenez comment elles se traduisent dans l’interface complète de gestion de site.
  • Testez la fonctionnalité du site web : Vérifiez toutes les parties de votre site web pour vous assurer que tout fonctionne comme prévu. Cela doit inclure toutes les pages, les articles, les formulaires de contact et toute fonctionnalité supplémentaire comme le commerce électronique ou les abonnements.

Une fois que nous avons une idée générale de ce à quoi pourrait ressembler le processus de migration, examinons certaines de ces étapes en détail. Plus précisément, nous listerons ci-dessous les principales fonctionnalités et comment les configurer dans un thème orienté bloc.

Maintenance de sites Gutenberg
Notre agence est spécialisée en maintenance de sites réalisés avec l'éditeur moderne de WordPress : Gutenberg; et l'Éditeur de Site ou Full Site Editor (FSE).
Thierry Pigot

Checklist : Migration d’un thème classique vers un thème orienté bloc

Cette liste de contrôle vous guidera à travers les étapes essentielles pour migrer votre site web d’un thème classique vers un thème de bloc.

1. Fonctionnalités précédemment localisées dans le Customizer

Le Customisateur dans WordPress offrait des options pour divers éléments du site, tels que le logo du site et les schémas de couleurs. Avec les thèmes de blocs, ceux-ci ont été déplacés vers de nouveaux emplacements.

Logo du site

Auparavant, vous définissiez votre logo de site via le Customizer. Avec les thèmes de blocs, vous pouvez maintenant utiliser le bloc de logo du site pour définir votre logo. Voici comment procéder :

  • Naviguez vers l’éditeur du site.
  • Sélectionnez la partie du modèle d’en-tête.
  • Ajoutez un bloc de logo de site et téléchargez ou sélectionnez votre logo.

Schémas de couleurs

Les schémas de couleurs étaient précédemment gérés dans le Customizer. Avec les thèmes de blocs, ces paramètres sont maintenant situés dans l’éditeur de site. Voici comment y accéder :

  • Naviguez vers l’éditeur du site.
  • Cliquez sur l’icône Styles Globaux (située en haut à droite de l’éditeur).
  • Sélectionnez « Parcourir les styles » pour gérer les schémas de couleurs de votre thème.

2. Menus de navigation

Auparavant, les menus de navigation étaient gérés via la section Apparence > Menus de votre tableau de bord WordPress. Avec les thèmes de blocs, la navigation est gérée avec le bloc de navigation. Voici comment procéder :

  • Naviguez vers l’éditeur du site.
  • Sélectionnez la partie du modèle d’en-tête.
  • Ajoutez un bloc de navigation et structurez votre menu comme vous le souhaitez.

3. Diaporamas de la page d’accueil et sections héroïques

Auparavant, les diaporamas ou sections de héros sur votre page d’accueil pourraient avoir été configurés via les Options du thème, le Customizer, ou en utilisant un plugin comme Elementor (🤢). Désormais, vous pouvez utiliser le bloc de couverture dans votre modèle de page d’accueil. Voici comment le faire :

  • Modifiez votre page d’accueil ou le modèle utilisé sur votre page d’accueil (selon votre configuration).
  • Ajoutez un bloc de couverture en haut du contenu et personnalisez-le avec l’image ou la vidéo, le texte, les boutons et autres contenus souhaités.
  • Cliquez sur l’icône « Basculer en hauteur complète » dans la barre d’outils du bloc en haut et changez l’alignement du bloc en « Pleine largeur ». Ces deux étapes feront apparaître le bloc de couverture en hauteur et en largeur complètes.

4. Widgets et barre latérale

Les widgets, tels que ceux dans le pied de page ou la barre latérale, étaient précédemment gérés via la section Apparence de votre tableau de bord WordPress. Avec les thèmes de blocs, vous pouvez les gérer à travers l’éditeur de site en modifiant des parties spécifiques du modèle comme le pied de page ou la barre latérale. Voici comment le faire :

  • Naviguez vers l’éditeur du site.
  • Sélectionnez la Partie du Modèle que vous souhaitez modifier (comme le pied de page ou la barre latérale).
  • Ajoutez les blocs souhaités et arrangez-les comme vous le souhaitez.

5. Options du thème

Si vous êtes habitué à un thème avec beaucoup d’options, vous vous demandez peut-être où sont passées ces options dans un thème de bloc. La bonne nouvelle est que de nombreuses fonctionnalités que vous pourriez être habitué à contrôler via les options du thème peuvent maintenant être modifiées directement dans l’éditeur de site. Par exemple, les mises en page d’en-tête et de pied de page peuvent être modifiées directement dans l’éditeur. De plus, la section des styles globaux peut contrôler des choses comme la typographie et les schémas de couleurs pour l’ensemble de votre site.

En conclusion, bien que le processus de migration nécessite certains ajustements, la transition vers un thème modulaire basé sur des blocs avec le Full Site Editor peut offrir plus de flexibilité et de contrôle sur la conception et la fonctionnalité de votre site. Avec un peu de patience et d’exploration, vous tirerez bientôt parti de la puissance des thèmes de blocs pour créer un site WordPress plus dynamique et personnalisable.

C’est la cata sur votre site ?
Nos experts WordPress sont rodés à toutes les situations

Thierry Pigot

Vous aimerez aussi lire
Questions fréquemment posées
A propos de Thierry Pigot
Fondateur WP Assistance - CEO WeAre[WP], Agence WordPress

Thierry est un expert WordPress basé en France. Il a plus de 15 ans d’expérience dans le développement Web et le référencement professionnel. Il est reconnu pour ses compétences et son expertise en matière de développement et de gestion de sites Web WordPress.

Vous souhaitez travailler avec notre agence ?