Maxime BJ présente

La formation

Créer un site WordPress avec le Full Site Editing

60 cours

Découvrez cette formation dans son intégralité

Bienvenue ! Certains cours accessibles gratuitement, mais la majorité est réservée aux détenteurs d'une offre premium.

Débloquez dès maintenant l'intégralité des cours et les vidéos.

Formules e-learning ou En présentiel

Partie

Partie 1

Tout ce qu'il faut savoir sur le FSE

Avant de nous lancer dans le vif du sujet, découvrons comment fonctionne le FSE, quel est son historique, et pourquoi c'est une bonne idée de s'y mettre dès maintenant.

Partie

Partie 2

Maîtriser l'utilisation de l'éditeur de blocs (Gutenberg)

Dans ce chapitre, on va revoir quelques bases de l'éditeur visuel Gutenberg, afin de bien comprendre les mécanismes de mise en page, et de se faire à l'ergonomie de cet outil.

Partie

Partie 3

Du design system au site : un langage commun entre designers et développeurs

Ce qui rend le Full Site Editing génial, c'est le langage commun entre les designers et les développeurs, au travers d'un design system. De Figma à WordPress, découvrez comment créer un process fluide et sans faille pour intégrer votre site.

Partie

Partie 4

Créer un site WordPress en FSE

C'est le moment de nous lancer dans la création de notre tout premier thème FSE. Et tant qu'à faire, on va le concevoir afin qu'il soit réutilisable entre chaque projet, pour gagner du temps !

1 • Créer la base de son thème FSE

Ici, on va mettre en place les bases de notre thème, afin de l'activer. On va également installer un site en local pour travailler dans de bonnes conditions. Après ça, vous serez parés pour réaliser tout type de site FSE avec WordPress.

Bonus Premium : Télécharger le thème de base FSE
Passer Premium et télécharger

2 • Point stratégique

Avant de nous lancer corps et âme dans le développement de notre thème, j'aimerais qu'on fasse un point stratégique afin de vous présenter ma méthodologie en 5 étapes qui vous apportera une efficacité optimale pour créer des sites WordPress FSE.

3 • Intégrer le design system

Dans cette partie, le fichier theme.json sera à l'honneur puisque c'est lui qui va permettre d'intégrer notre design system, d'activer ou désactiver les fonctionnalités de l'éditeur, et définir les styles par défaut des éléments de votre site.

4 • Les variations de styles des blocs

Afin de modifier l'apparence des blocs existants, on va pouvoir très facilement créer des variations de styles dont on contrôlera le CSS, afin de pousser au maximum la personnalisation de nos sites sans devoir tout réinventer.

5 • Les compositions

Cette partie est l'une des plus importantes de la formation. La création de compositions réutilisables va nous permettre de gagner énormément de temps grâce à une approche plus granulaire. On pense désormais un site par compositions, et non plus par pages.

6 • Les templates

Maintenant, on va créer visuellement les différents modèles de notre site : les pages, les articles, les archives...

7 • Les blocs Gutenberg et le sur-mesure pour répondre à tous les besoins

Enfin, quand on a épuisé toutes les autres techniques, il nous reste le développement de fonctionnalités sur-mesure grâce notamment à la création de blocs Gutenberg. Ainsi, on pourra répondre à toutes les demandes de nos clients sans aucune limite technique.

Bifurcation vers la formation : Développement de blocs sur-mesure
Suivre la formation

Partie

Partie 5

Projet fil rouge

Dans cette partie purement premium, je réalise un site Full Site Editing de A à Z afin de mettre en application tout ce que l'on aura vu jusqu'à présent.

Bonus Premium : Télécharger le site fil rouge
Passer Premium et télécharger

Partie

Partie 6

Migrer vers FSE : les problématiques des agences

Passer au Full Site Editing va pas mal chambouler les process de votre agence, mais pour le mieux ! Cette partie aborde la tarification d'un site FSE, l'estimation du temps, la nouvelle répartition des compétences en interne et vous permettra un virage plus efficace vers le FSE.

Partie

Partie 7

Aller plus loin : FSE et Gutenberg avancés

Dans cette dernière partie, nous allons emmener notre thème au niveau supérieur et créer un système permettant de déclarer nos variations, nos blocs sur-mesure en JSON afin de ne plus jamais devoir toucher du PHP. On verra également comment sont gérées les données de l'éditeur dans la base de données.

Bonus Premium : Télécharger le thème de base amélioré
Passer Premium et télécharger

Partie

Bonus

Snippets et astuces pratiques

Dans cette partie bonus, je partage avec vous quelques bouts de codes, hooks et astuces qui pourraient bien vous être utiles dans le FSE.