WordPress
time_read40mn de lecture

Comment créer un site avec Breakdance Builder sur WordPress ?

29 octobre 2026
Résumez avec:

Comment créer un site avec Breakdance Builder sur WordPress ?

Créer un site WordPress personnalisé sans écrire de code est aujourd’hui accessible grâce aux constructeurs de pages visuels. Mais choisir un outil ne suffit pas. Il faut également configurer son environnement, harmoniser les couleurs et les polices, organiser les différentes pages et veiller à la rapidité du site.✨ Breakdance Builder est un constructeur visuel développé par Soflyy qui permet de concevoir des sites WordPress directement depuis un éditeur graphique. Avec Breakdance 3.0, publié en octobre 2026, l’outil introduit notamment la possibilité de connecter des agents d’intelligence artificielle compatibles avec le protocole MCP.⚡

Contenus masquer

Pour créer un site avec Breakdance sur WordPress, installez le constructeur depuis son fichier ZIP, puis activez-le dans l’administration WordPress. Configurez ensuite les styles globaux, créez les modèles d’en-tête et de pied de page, puis construisez vos pages avec l’éditeur visuel. Breakdance 3.0 permet également de connecter un agent IA compatible MCP pour faciliter certaines tâches de création et de gestion du site.👨‍💻

Dans ce tutoriel, vous découvrirez comment installer Breakdance, définir l’identité visuelle de votre site, créer son en-tête, son pied de page et ses pages principales, puis vérifier son fonctionnement avant la mise en ligne.

Que pourrez-vous réaliser avec Breakdance Builder ?

L’objectif de ce tutoriel est de vous accompagner dans la création d’un site vitrine WordPress complet avec Breakdance Builder, depuis sa première configuration jusqu’à sa publication.✨ Vous apprendrez à installer le constructeur, à personnaliser les styles globaux et à concevoir une structure cohérente comprenant un en-tête, un pied de page et plusieurs pages. Nous verrons également comment intégrer un formulaire de contact, adapter l’affichage aux smartphones et utiliser les modèles pour organiser les contenus.🎢 Une partie sera consacrée aux nouvelles possibilités offertes par Breakdance 3.0, notamment la connexion d’agents IA compatibles MCP. Enfin, vous découvrirez comment contrôler les performances, le référencement et le fonctionnement général du site. À l’issue du guide, vous disposerez des étapes nécessaires pour réaliser un site vitrine de trois à quatre pages.

De quoi avez-vous besoin avant de créer un site avec Breakdance ?

Avant de commencer à créer votre site avec Breakdance Builder, vous devez disposer d’un environnement WordPress fonctionnel et de quelques éléments essentiels :

  • Un site WordPress installé : vous devez pouvoir accéder à son tableau de bord avec un compte administrateur.
  • Un hébergement web compatible : votre serveur doit respecter les recommandations techniques de Breakdance.
  • Un compte Breakdance : vous pouvez choisir entre la formule gratuite Free et une licence Pro.
  • Un nom de domaine : celui-ci doit déjà pointer vers l’hébergement de votre site.
  • Des connaissances de base sur WordPress : savoir installer une extension, créer une page et utiliser les menus d’administration facilitera votre progression.

Qu’est-ce que Breakdance et à qui s’adresse-t-il ?

Breakdance Builder est un constructeur visuel de sites WordPress développé par Soflyy, l’entreprise également à l’origine de WP All Import. Il permet de créer et de personnaliser des pages web sans écrire systématiquement du code HTML, CSS ou PHP.

Contrairement à l’éditeur classique de WordPress, Breakdance propose une interface visuelle permettant de modifier les éléments d’une page et de visualiser leur apparence directement.

Le constructeur intègre plusieurs fonctionnalités :

  • Un éditeur visuel pour organiser les textes, images, boutons et sections.

  • Des styles globaux pour harmoniser les couleurs, les polices et les espacements.

  • Un système de modèles pour personnaliser les en-têtes, pieds de page, articles et archives.

  • Une intégration WooCommerce pour concevoir des boutiques en ligne.

  • Des éléments dynamiques pour afficher automatiquement certains contenus WordPress.

Depuis octobre 2026, Breakdance 3.0 introduit notamment de nouvelles possibilités de personnalisation CSS et la connexion d’agents IA compatibles MCP.

L’outil s’adresse principalement aux indépendants, créateurs de sites et agences web qui souhaitent réaliser des projets WordPress personnalisés.

Pour découvrir d’autres approches, consultez nos tutoriels sur un autre constructeur de pages : Beaver Builder et Divi Builder.

Breakdance est-il gratuit ? Free ou Pro, que choisir ?

Breakdance propose une version gratuite et deux formules Pro payantes, avec des fonctionnalités et des limites d’utilisation différentes. Le plan Free permet de créer des sites WordPress sans abonnement, tandis que les offres Pro donnent accès à davantage d’éléments et d’options de personnalisation.

Voici les tarifs affichés sur le site officiel au 28 octobre 2026.

Caractéristiques Free Pro Pro Unlimited

Prix annuel

0 $

99,99 $

199,99 $

Nombre de sites

Illimité

1

Illimité

Éléments disponibles

80

145

145

Bibliothèque de modèles

Limitée

Complète

Complète

WooCommerce

Basique

Complet

Complet

Formulaires

Basiques

Complets

Complets

Popups

Basiques

Complets

Complets

Support premium

Non

Oui

Oui

Source : tarifs officiels de Breakdance, relevés le 28/10/2026. Ces montants sont susceptibles d’évoluer.

Quelles sont les limites de Breakdance Free ?

La version gratuite de Breakdance convient pour découvrir l’éditeur et concevoir des pages simples. Toutefois, certaines fonctionnalités sont réservées aux abonnements Pro. Par exemple, le plan Free ne permet pas d’utiliser les sections animées avancées, de personnaliser entièrement certaines pages WooCommerce ou de déclencher des popups au chargement et au défilement. L’envoi des formulaires par e-mail est également limité.

Les deux formules Pro proposent les mêmes fonctionnalités. Leur principale différence concerne le nombre de sites autorisés. Breakdance annonce par ailleurs une garantie de remboursement de 60 jours. Selon l’éditeur, si vous ne renouvelez pas votre abonnement, votre site continue de fonctionner, mais vous perdez l’accès aux mises à jour, au support et à la bibliothèque de modèles.

Le service de rédaction assistée par IA est facturé séparément.

Notre expérience avec Breakdance Builder sur WordPress

Pour réaliser ce tutoriel, nous avons utilisé Breakdance Builder 3.0.0 dans sa version gratuite sur un hébergement WordPress LWS, le 28 octobre 2026. Notre objectif était de découvrir les fonctionnalités du constructeur et de concevoir un site vitrine pour une agence spécialisée dans la création de sites web et l’intelligence artificielle.

Environnement utilisé pour le test

Voici la configuration technique de notre environnement :

Caractéristiques Environnement de test

Hébergeur

LWS

Offre d’hébergement

Formule d’hébergement WordPress

Version WordPress

Dernière version disponible lors du test

Version PHP

8.4

Version Breakdance

3.0.0

Formule Breakdance

Free (gratuite)

Thème WordPress

Astra

Date du test

28/10/2026

Testé le 28/10/2026 sur un hébergement WordPress LWS, avec PHP 8.4, le thème Astra et Breakdance 3.0.0 Free.

Création d’un site vitrine pour une agence web et IA

Dans le cadre de notre démonstration, nous avons créé un site vitrine destiné à une agence spécialisée dans la création de sites internet et les solutions d’intelligence artificielle.

Le site comprend cinq pages principales :

  • Accueil : présentation de l’agence, de ses activités et de ses principaux services.
  • Services : présentation des prestations de création de sites web et des solutions reposant sur l’intelligence artificielle.
  • À propos : présentation de l’agence, de son expertise et de son approche.
  • Contact : page permettant aux visiteurs de prendre contact avec l’agence.
  • Télécharger : page dédiée à la présentation et au téléchargement des ressources proposées par l’agence.

Pour construire ce site, nous avons utilisé l’éditeur visuel de Breakdance, en travaillant sur la structure des pages, la disposition des contenus et l’harmonisation de l’identité visuelle.

Ce projet constitue un exemple concret d’utilisation de Breakdance Free pour créer un site WordPress professionnel, sans avoir recours à une licence Pro. Les captures d’écran du site permettent d’illustrer le résultat obtenu, notamment la page d’accueil, la navigation et les différentes pages créées avec le constructeur.

Quel hébergement faut-il pour faire tourner Breakdance ?

Breakdance nécessite un hébergement WordPress disposant d’une configuration PHP compatible et de ressources serveur suffisantes. Avant d’installer le constructeur, il est donc important de vérifier les caractéristiques techniques de votre hébergement.

D’après la documentation officielle de Breakdance, les recommandations sont les suivantes :

Ressource Recommandation Breakdance

Version PHP

PHP 7.4 ou supérieure

Breakdance AI (extension distincte)

PHP 8.1 ou supérieure

Extensions PHP

mbstring, curl, zip

Processeur

Double cœur

Mémoire serveur

512 Mo de RAM recommandés

Compression

Brotli ou Gzip

Cache

Mise en cache côté serveur

La valeur de 512 Mo correspond à une recommandation de mémoire serveur, et non nécessairement au paramètre PHP memory_limit. Les ressources nécessaires peuvent augmenter selon les extensions installées et la taille de votre site.

Comment vérifier la version PHP depuis le LWS Panel ?

Si votre site est hébergé chez LWS, vous pouvez contrôler la configuration PHP depuis votre espace d’hébergement.

  • Connectez-vous à votre espace client LWS.

Se connecter à l'espace client LWS

  • Sélectionnez l’hébergement associé à votre nom de domaine.
  • Accédez au LWS Panel.

Sélectionner et gérer l'hébergement dans LWS Panel

  • Recherchez l’outil de gestion de la version PHP.

Outil de gestion de php dans LWS Panel

  • Vérifiez la version actuellement utilisée et sélectionnez une version compatible avec WordPress, Breakdance et vos extensions.

Outil de sélection de PHP dans LWS Panel

Même si Breakdance documente une compatibilité à partir de PHP 7.4, privilégiez une version PHP récente et maintenue, après vérification de sa compatibilité avec les composants de votre site.

Enfin, vous pouvez utiliser LWS Optimize pour gérer les optimisations de cache disponibles sur votre hébergement. Son efficacité devra être mesurée après configuration.

Plus d'informations


Besoin d’un hébergement pour votre site WordPress ?

Vérifiez que votre formule permet de sélectionner une version PHP compatible avec Breakdance et dispose des ressources nécessaires à votre projet. Consultez les caractéristiques actuelles de notre offre d’hébergement WordPress LWS.

Comment installer WordPress avant Breakdance ?

Avant d’utiliser Breakdance Builder, vous devez installer WordPress sur votre hébergement. Si vous disposez d’un hébergement LWS compatible, cette opération peut s’effectuer depuis WP Manager, sans installation manuelle des fichiers WordPress.

Pour commencer :

  • Connectez-vous à votre espace client LWS.
  • Ouvrez le LWS Panel, puis accédez à WP Manager.

Accéder à WP Manager dans le panel LWS

  • Sélectionnez un pack d’installation WordPress et cliquez sur le bouton « Installer ».

Choisir un pack d'installation de WordPress dans le panel LWS

  • Suivez les indications pour terminer l’installation.

Interface d'installation de WordPress via LWS WP Manager avec tous les paramètres

  • Une fois WordPress installé, accédez à son tableau de bord depuis WP Manager ou votre adresse d’administration.

Fenêtre de réussite d'installation de WordPress sur une formule Linux standard

Sur les formules d’hébergement cPanel, vous pouvez également installer WordPress avec Softaculous. Pour découvrir toutes les fonctionnalités de cet outil, consultez notre tutoriel consacré à WP Manager LWS.

À cette étape, WordPress est prêt à accueillir Breakdance Builder, que nous allons installer et configurer dans la suite du tutoriel.

Comment installer et activer Breakdance ?

Pour installer Breakdance Builder sur WordPress, vous devez télécharger son fichier ZIP, l’ajouter comme extension et procéder à son activation. L’installation s’effectue directement depuis le tableau de bord WordPress, sans manipulation des fichiers du serveur.

Étape 1 : télécharger Breakdance Builder

Rendez-vous sur le site officiel de Breakdance et cliquez sur le bouton « Get Started ».

Cliquer sur le bouton "Get started" sur le site officiel de Breakdance

Sélectionnez ensuite la formule Free ou Pro correspondant à vos besoins.

Sélectionner la formule gratuite de Breakdance

Une fois votre compte créé, vous pouvez récupérer le constructeur depuis le portail client Breakdance.

Télécharger gratuitement Breakdance

Il vous suffit de cliquer sur le bouton de téléchargement de l’extension Breakdance. Téléchargez le fichier breakdance.zip et conservez-le sur votre ordinateur.

Obtenir le fichier zip du plugin Breakdance

Il n’est pas nécessaire de le décompresser.

Trucs et astuces


Remarque : la formule Free ne nécessite pas l’achat d’une licence Pro. L’accès aux téléchargements et aux clés dépend de l’offre associée à votre compte.

Étape 2 : installer le plugin sur WordPress

Connectez-vous à l’administration de votre site WordPress, puis suivez ces étapes :

  • Cliquez sur la section « Extensions > Ajouter une extension ».

Interface "Ajouter une extension" dans le répertoire WordPress

  • Ensuite, cliquez sur le bouton « Téléverser une extension ».

Téléverser une extension depuis le répertoire officiel

  • Cliquez sur l’option « Choisir un fichier » et sélectionnez breakdance.zip.
  • Cliquez sur le bouton « Installer maintenant ».

Sélectionner et installer le plugin Breakdance dans WordPress

  • Une fois l’installation terminée, cliquez sur le bouton « Activer l’extension ».

Cliquer sur le bouton Activer l'extension pour activer Breakdance

Breakdance apparaît alors dans le menu d’administration de WordPress.

Attention : Breakdance est une extension WordPress, pas un thème. Vous devez donc l’installer depuis le menu Extensions, et non depuis la section « Apparence > Thèmes ».

Étape 3 : configurer Breakdance et activer la licence

Après l’activation, Breakdance 3.0 peut proposer un assistant de configuration permettant notamment de préparer la connexion d’un agent IA. Cette étape n’est pas indispensable pour commencer à concevoir vos pages manuellement.

Si vous disposez d’une licence Pro, ouvrez la section « Breakdance > Réglages > License ».

Renseigner et activer la licence dans WordPress

Copiez votre clé depuis la rubrique License Keys du portail client, collez-la dans le champ prévu, puis enregistrez.

Vérifiez ensuite son statut d’activation. Une licence valide permet d’accéder aux mises à jour incluses dans votre abonnement.

Étape 4 : vérifier l’installation

Ouvrez la section « Pages > Ajouter une page », saisissez un titre, puis recherchez l’action permettant de modifier la page avec Breakdance.

Cliquer sur le bouton "Edit" avec Breakdance

Si l’éditeur s’ouvre correctement, le constructeur est prêt à être utilisé.

Vous pouvez également consulter les réglages du thème dans Breakdance. Le constructeur dispose de son propre système de modèles et peut fonctionner sans que vous ayez à concevoir les pages du thème WordPress.

Comment définir l’identité visuelle avec les styles globaux ?

Les styles globaux de Breakdance permettent de définir les couleurs, typographies, boutons et espacements de votre site depuis une interface centralisée. Ils évitent de répéter les mêmes réglages sur chaque page et facilitent les modifications ultérieures.

Étape 1 : accéder aux styles globaux

Ouvrez une page avec l’éditeur Breakdance. Dans la barre supérieure, affichez le menu principal et sélectionnez l’option « Global Settings ».

Modifier les styles globaux du site avec le constructeur Breakdance

Plusieurs catégories sont disponibles : Colors, Typography, Buttons, Forms et Containers.

Étape 2 : configurer les couleurs et la typographie

Dans la section « Couleurs », définissez une palette adaptée à votre identité visuelle. Pour un site vitrine, vous pouvez prévoir une couleur principale, une couleur secondaire, une couleur de texte et une couleur d’arrière-plan.

Personnaliser les couleurs globales du site dans Breakdance

Dans la section « Typographie », choisissez les polices utilisées pour les paragraphes et les titres. Définissez également leurs tailles, graisses et espacements afin de garantir une hiérarchie visuelle cohérente.

Personnaliser la typographie globale du site dans Breakdance

Veillez à conserver un contraste suffisant entre le texte et l’arrière-plan pour améliorer la lisibilité. Retrouvez nos conseils pour rendre un site WordPress accessible.

Étape 3 : personnaliser les boutons et les espacements

Dans la section « Boutons », configurez l’apparence des boutons principaux et secondaires : couleurs, bordures, arrondis et états au survol.

Personnaliser le style global de boutons dans l'éditeur Breakdance

Dans la section « Conteneurs », ajustez la largeur des contenus et les espacements des sections. Ces paramètres contribuent à maintenir une présentation homogène sur l’ensemble du site.

Personnaliser le style global de conteneurs dans l'éditeur Breakdance

Avec Breakdance 3.0, vous pouvez également utiliser des variables CSS globales. Par exemple, la variable --section-spacing peut définir un espacement réutilisable dans plusieurs éléments. Toute modification de sa valeur se répercute sur les éléments qui l’utilisent.

Cliquez sur le bouton « Sauvegarder » pour enregistrer les styles, puis vérifiez leur application sur les différentes pages.

Sauvegarder les styles globaux de l'éditeur Breakdance

Comment créer un header et un footer ?

Breakdance permet de créer un en-tête (header) et un pied de page (footer) réutilisables sur toutes les pages WordPress. Ces deux éléments facilitent la navigation et assurent la cohérence visuelle du site.

Étape 1 : créer le header du site

Depuis l’administration WordPress, rendez-vous dans la section « Breakdance > En-têtes ».

Accéder au réglage de l'en-tête du site dans Breakdance

Cliquez sur le bouton « Ajouter un en-tête ».

Cliquer sur le bouton "Ajouter un en-tête" dans le constructeur Breakdance

Donnez un nom à votre en-tête, par exemple « En-tête principal », puis sélectionnez l’option « Partout » dans le paramètre Location pour l’afficher sur tout le site.

Saisir les détails de l'en-tête créée dans Breakdance

Validez sa création et cliquez sur le bouton « Modification dans Breakdance ».

Choisir l'option "Modifier" dans Breakdance pour personnaliser l'en-tête du site

Dans l’éditeur visuel, vous pouvez ajouter un élément Header Builder pour organiser le logo, le menu de navigation et un éventuel bouton d’action.

Utiliser le bloc Header Builder dans Breakdance

Pour notre exemple de site vitrine, le menu pourra contenir les liens « Accueil, Services, À propos et Contact« .

Interface de création de l'en-tête dans Breakdance

Étape 2 : adapter le header aux mobiles

Sélectionnez les modes d’affichage proposés dans l’éditeur pour examiner le comportement de votre en-tête sur les écrans plus étroits.

Ouvrir le Mode de prévisualisation de l'en-tête dans Breakdance

Vérifiez que le logo reste visible, que le menu est facilement accessible et qu’aucun élément ne dépasse de l’écran. Les réglages disponibles dépendent des éléments utilisés. Un contrôle sur un véritable smartphone reste recommandé.

Étape 3 : créer le footer

Revenez dans l’administration WordPress et ouvrez la section « Breakdance > Pieds de page ».

Accéder à la section Pieds de page pour la construction

Cliquez sur le bouton « Ajouter un pied de page », saisissez un titre et choisissez également partout.

Cliquer sur le bouton "Ajouter un pied de pages" dans le constructeur Breakdance

Ouvrez ensuite le pied de page dans l’éditeur Breakdance.

Cliquer sur le bouton Modification dans Breakdance de l'en-tête du pied de page

Ajoutez les informations utiles à vos visiteurs : nom de l’entreprise, coordonnées, liens vers les pages importantes, mentions légales et politique de confidentialité.

Construction entière du pied de pages dans Breakdance et enregistrement

Étape 4 : définir les conditions d’affichage

Dans les paramètres du header ou du footer, « Location » détermine les emplacements concernés, « Conditions » permet d’affiner les règles d’affichage et « Priority » départage plusieurs modèles applicables.

Fixer les conditions d'affichage du pied de page dans Breakdance

Pour un site vitrine simple, le réglage Everywhere convient généralement aux modèles principaux.

Enregistrez les modifications et vérifiez leur affichage sur plusieurs pages.

Comment créer sa première page avec l’éditeur visuel ?

Pour créer une page avec Breakdance Builder, ajoutez une nouvelle page WordPress, ouvrez-la dans l’éditeur visuel et assemblez les sections et éléments nécessaires à votre contenu. Vous pouvez partir d’une page vide ou importer une mise en page depuis la bibliothèque de design.

Étape 1 : créer une page d’accueil

Dans WordPress, rendez-vous dans la section « Pages > Ajouter une page ». Donnez-lui le titre « Accueil », puis enregistrez-la. Ouvrez ensuite la page avec Breakdance.

Ouvrir la page dans le constructeur Breakdance

L’éditeur permet d’ajouter des éléments, de modifier leurs propriétés et de visualiser le résultat directement dans la zone de conception.

Interface pour éditer la page d'accueil dans Breakdance

Étape 2 : construire la structure de la page

Pour notre site vitrine, nous allons prévoir quatre sections principales :

  • Une section d’accueil avec un titre H1, une présentation et un bouton de contact.

Ajouter la section principale de la page d'accueil avec le bloc Hero

  • Une section « Présentation » expliquant l’activité et ses avantages.

Ajouter une section "Présentation" de l'agence dans la page d'accueil dans Breakdance

  • Une section « Services » présentant les principales prestations.

Ajouter la section Services sur la page d'accueil dans Breakdance

  • Une section « Contact » encourageant les visiteurs à prendre contact.

Ajouter la section "Contact" dans la page d'accueil sur Breakdance

Dans Breakdance, utilisez les éléments « Section, Container, Columns et Div » pour structurer les contenus.

Utiliser les sections Colonnes et Div dans l'éditeur Breakdance

Ajoutez ensuite les éléments adaptés : Heading pour les titres, Text pour les paragraphes, Image pour les illustrations et Button pour les liens d’action.

Le plan gratuit comprend 80 éléments, contre 145 dans les offres Pro, selon les tarifs relevés le 28 octobre 2026.

Étape 3 : importer une section depuis la bibliothèque

Si vous préférez utiliser un modèle existant, ouvrez la section « Bibliothèque » dans l’éditeur Breakdance. Vous pouvez également utiliser le raccourci Ctrl + B sous Windows.

Accéder à la bibliothèque Breakdance

Choisissez une collection, recherchez une mise en page adaptée, puis survolez la section souhaitée et cliquez sur le bouton « Add to page ».

Ajouter un modèle depuis la bibliothèque Breakdance

Le modèle est inséré dans votre page. Vous pouvez ensuite remplacer les textes, images et couleurs par les vôtres.

La bibliothèque propose également l’importation de pages complètes. Attention cependant : certaines opérations d’importation des réglages globaux peuvent remplacer les styles déjà définis sur votre site.

Étape 4 : adapter l’affichage sur mobile

Une fois les contenus ajoutés, vérifiez leur présentation sur différents formats d’écran avec les outils responsive de Breakdance.

Vérifier l'affichage du site dans les interfaces mobiles après création de la page d'accueil

Contrôlez particulièrement la taille des titres, la largeur des images, les espacements et la disposition des colonnes. Une mise en page à plusieurs colonnes sur ordinateur doit rester confortable à consulter sur smartphone.

Étape 5 : enregistrer et publier la page

Cliquez sur le bouton « Sauvegarder » pour conserver les modifications effectuées dans Breakdance, puis prévisualisez la page.

Sauvegarder la page d'accueil du site

Pour utiliser cette page comme accueil du site, rendez-vous dans la section « Réglages > Lecture » dans WordPress. Sélectionnez Une page statique, puis choisissez « Accueil » dans le champ correspondant.

Sélectionner la page d'accueil dans Breakdance

Enregistrez les modifications et ouvrez l’adresse publique de votre site pour vérifier le résultat.

Voir la page publique du site après création dans Breakdance

Vous pouvez désormais appliquer la même méthode pour créer les pages « Services, À propos et Contact« , en réutilisant vos styles globaux et vos modèles.

Comment utiliser les modèles pour articles, archives et page 404 ?

Breakdance Builder permet de créer des modèles WordPress réutilisables pour personnaliser automatiquement l’affichage des articles, des archives, des résultats de recherche et des pages d’erreur 404.

Ces modèles évitent de reconstruire chaque page individuellement. Une modification apportée à un modèle peut ainsi s’appliquer à tous les contenus concernés.

Créer un modèle pour les articles WordPress

Pour personnaliser la présentation de vos articles, procédez comme suit :

  • Depuis WordPress, accédez à la section « Breakdance > Modèles ».

Accéder à la section Modèle dans Breakdance

  • Cliquez sur le bouton « Ajouter un modèle » et nommez votre modèle « Articles du blog ».
  • Dans les paramètres « Location« , sélectionnez l’emplacement correspondant aux articles (Single Posts).

Sélectionner l'option Single post

  • Ouvrez le modèle avec Edit in Breakdance.
  • Ajoutez les éléments nécessaires : titre dynamique, image à la une, informations de publication et zone de contenu.

Personnaliser la page Blog du site dans Breakdance

L’élément Template Content Area permet notamment d’intégrer une zone de contenu propre à chaque article, tout en conservant une structure commune.

Créer une page d’erreur 404 personnalisée

Une page 404 s’affiche lorsqu’un visiteur tente d’accéder à une URL inexistante.

Dans la section « Breakdance > Modèle », choisissez le modèle 404 – Not Found Error.

Choisir le modele 404 dans le constructeur de modèle de Breakdance

Ajoutez un message explicatif, par exemple « Cette page est introuvable », puis un bouton renvoyant vers l’accueil.

Personnaliser le modèle page 404

Breakdance propose également des modèles Archive et Search pour personnaliser les listes d’articles et les résultats de recherche. Enregistrez vos modifications, puis ouvrez volontairement une adresse inexistante pour vérifier l’affichage de la page 404.

Comment ajouter un formulaire de contact ?

Breakdance intègre un constructeur de formulaires appelé Form Builder, permettant de collecter les messages des visiteurs directement depuis une page WordPress.

Étape 1 : insérer le formulaire

Ouvrez votre page « Contact » dans l’éditeur Breakdance.

Cliquez sur le bouton « Ajouter > Form Builder », puis ajoutez le formulaire à la section souhaitée.

Créer un formulaire de contact dans Breakdance

Par défaut, l’élément contient trois champs : Name, Email et Message.

Dans la section « Content > Form > Fields », personnalisez les intitulés, ajoutez des champs et définissez ceux qui sont obligatoires.

Étape 2 : configurer la réception des messages

Dans les propriétés du formulaire, ouvrez la section « Actions > Actions After Submission ».

Sélectionner l'action du formulaire dans Breakdance

La documentation prévoit une action Email permettant d’envoyer les données vers une adresse de destination. Cette fonctionnalité est toutefois réservée aux capacités prévues par votre formule : le plan Free présente des restrictions concernant l’envoi par e-mail.

Configurer l'email de réception du message après soumission dans le formulaire

Avec une formule compatible, configurez le destinataire dans la section « Email > Emails > To Email ». Vérifiez également l’adresse d’expédition et le contenu du message.

Vous pouvez utiliser {all_fields} pour intégrer les champs soumis au message de notification.

Étape 3 : tester le formulaire

Enregistrez le formulaire, ouvrez sa page publique et envoyez un message de test.

Vérifiez que la notification arrive dans la boîte du destinataire, y compris dans les courriers indésirables. Si les messages n’arrivent pas, contrôlez les réglages d’expédition WordPress.

Une configuration SMTP adaptée à votre messagerie peut être nécessaire. Consultez notre guide sur les paramètres de messagerie WordPress.

Enfin, ajoutez les informations nécessaires sur le traitement des données personnelles et consultez les recommandations de la CNIL concernant le RGPD.

Comment construire un site avec l’IA dans Breakdance 3.0 ?

Breakdance 3.0 permet de connecter un agent d’intelligence artificielle compatible MCP pour créer et modifier des éléments WordPress à partir d’instructions rédigées en langage naturel.

Disponible depuis le 26 octobre 2026, cette version introduit notamment la connexion d’agents tels que Claude, Codex ou Cursor. Selon Soflyy, les agents compatibles peuvent intervenir sur les pages, les modèles, les styles et certains paramètres du site.

Étape 1 : préparer WordPress pour l’utilisation de l’IA

Avant de commencer, vérifiez la compatibilité de votre serveur. La documentation recommande notamment PHP 8.1 ou une version supérieure pour les fonctionnalités associées à l’intégration IA.

Effectuez également une sauvegarde complète de votre site WordPress avec les outils disponibles sur votre hébergement LWS.

Cette précaution est importante, car les actions exécutées par un agent peuvent modifier la structure et les contenus du site.

Étape 2 : connecter un agent IA avec MCP

Le protocole MCP (Model Context Protocol) permet à un agent compatible de communiquer avec des outils externes.

Voici la procédure décrite dans la documentation officielle :

  • Connectez-vous à votre administration WordPress.
  • Rendez-vous dans la section « Breakdance > Settings > Agents & MCP ».
  • Cliquez sur le bouton « Install Agent Connector » ou activez-le s’il est déjà installé.

Cliquer sur le bouton Installer Agent Connector et Universal Abilities

  • Cliquez sur le bouton « Connect » pour ouvrir l’assistant de connexion.
  • Sélectionnez votre agent IA et suivez les instructions correspondant à ce client.

Sélectionner un agent pour le connecter à l'extension Breakdance

Dans la section « Agents & MCP », vérifiez que l’option autorisant l’accès aux outils Breakdance est activée.

Suivre les instructions de connexion de ChatGPT à Breakdance

Pour mieux comprendre ce protocole, consultez notre tutoriel expliquant comment créer un plugin MCP pour WordPress.

Étape 3 : demander à l’agent de créer une page

Une fois l’agent connecté, vous pouvez lui transmettre une instruction précise, par exemple :

Crée une page « À propos » en brouillon avec Breakdance. Ajoute une introduction présentant notre entreprise, une section de trois services et un bouton de contact. Réutilise les couleurs et les typographies du site. Ne publie pas la page sans ma validation.

L’objectif est de laisser l’agent préparer la structure, puis de contrôler manuellement les textes, les images et l’affichage responsive.

La documentation présente aussi Universal Abilities, une extension facultative donnant davantage de capacités de gestion WordPress à l’agent. N’activez ces possibilités qu’en fonction des autorisations réellement nécessaires.

Étape 4 : vérifier le résultat

Ouvrez la page créée dans Breakdance et contrôlez sa structure, ses liens et ses styles avant publication.

Il est également intéressant de comparer cette page à une version construite manuellement, en relevant le temps consacré et les corrections nécessaires.

Comment vérifier les performances et le référencement du site ?

Pour vérifier les performances et le référencement d’un site créé avec Breakdance, utilisez des outils indépendants comme Google PageSpeed Insights et Google Search Console.

Les affirmations de rapidité publiées par l’éditeur ne remplacent pas une mesure effectuée sur votre propre site.

Mesurer la vitesse avec PageSpeed Insights

Rendez-vous sur PageSpeed Insights et saisissez l’adresse de votre site.

Vérifier les performances du site sur PageSpeed Insight

L’outil analyse notamment trois indicateurs essentiels :

  • LCP (Largest Contentful Paint) : mesure le chargement du principal contenu visible.

  • INP (Interaction to Next Paint) : évalue la réactivité aux interactions.

  • CLS (Cumulative Layout Shift) : mesure la stabilité visuelle des éléments.

Effectuez un premier relevé, activez ensuite les réglages de cache compatibles avec votre hébergement, notamment via LWS Optimize, puis répétez les mesures dans des conditions comparables.

Score de performances après installation de LWS Optimize

Conservez les résultats avant et après optimisation pour identifier les améliorations réelles, sans attribuer automatiquement toutes les variations au cache.

Vérifier les éléments SEO des pages

Dans Breakdance, utilisez les éléments Heading pour organiser correctement les titres H1, H2 et H3. Chaque page doit posséder une structure de titres cohérente.

Pour les balises title et meta description, utilisez un plugin SEO WordPress adapté, comme All in One SEO. Vérifiez également les textes alternatifs des images, les liens internes et l’indexation dans Google Search Console.

Enfin, Breakdance propose des paramètres dans la section « Settings > Performance » pour désactiver certaines ressources WordPress inutilisées.

Améliorer les performances du site dans Breakdance

Testez chaque modification, car certains éléments peuvent rester nécessaires à votre thème ou à vos extensions.

Comment vérifier que le site fonctionne correctement ?

Avant de mettre en ligne votre site WordPress créé avec Breakdance, vérifiez son affichage, sa navigation, ses formulaires et ses performances. Ces contrôles permettent de détecter les problèmes qui pourraient empêcher les visiteurs d’utiliser correctement votre site.

Commencez par vider les caches disponibles, puis ouvrez votre site dans une fenêtre de navigation privée. Testez ensuite les différentes pages sur ordinateur, tablette et smartphone.

Voici une checklist de vérification à suivre avant la publication définitive :

  • Affichage responsive : les textes, images et boutons s’adaptent aux différentes tailles d’écran.
  • Header et footer : les modèles apparaissent correctement sur les pages concernées.
  • Formulaire de contact : un message de test est envoyé et reçu à l’adresse prévue.
  • Page 404 : une URL inexistante affiche la page d’erreur personnalisée.
  • Performances : les pages principales ont été analysées avec PageSpeed Insights.
  • Cache : les dernières modifications restent visibles après le vidage des caches.

Corrigez les problèmes identifiés, puis effectuez une dernière vérification avant de communiquer l’adresse de votre site.

Quelles sont les erreurs fréquentes avec Breakdance ?

Les problèmes rencontrés avec Breakdance Builder peuvent provenir de la configuration PHP, des autorisations du serveur, de la licence ou des mécanismes de cache WordPress. Il est important d’identifier leur origine avant de modifier les paramètres du site.

Voici plusieurs situations à vérifier si le constructeur ne fonctionne pas comme prévu.

Problème rencontré Cause possible Vérification ou solution

L’éditeur ne fonctionne pas correctement

Configuration PHP incompatible ou ressources insuffisantes

Comparer la configuration du serveur aux recommandations de Breakdance

Message « Required Directories Are Missing or Not Writable »

Dossiers nécessaires absents ou non accessibles en écriture

Contrôler les autorisations des répertoires concernés

Mises à jour Pro indisponibles

Licence absente, expirée ou non reconnue

Vérifier la licence dans les paramètres Breakdance

Modifications invisibles sur le site

Cache conservant une ancienne version

Vider les caches WordPress, serveur et navigateur

Affichage incohérent

Interactions possibles avec le thème ou une extension

Tester sur une copie du site en désactivant les composants concernés

Ces situations constituent des pistes de diagnostic, et non des erreurs reproduites dans le cadre de ce tutoriel.

Si une anomalie persiste, consultez la documentation officielle de Breakdance avant toute intervention importante.

Évitez notamment de modifier les permissions des dossiers sans avoir identifié le problème exact. Une configuration trop permissive pourrait compromettre la sécurité de votre installation WordPress.

Quelles bonnes pratiques adopter ?

Pour conserver un site WordPress fiable avec Breakdance, privilégiez les sauvegardes régulières, les mises à jour contrôlées et une configuration cohérente. Ces précautions sont particulièrement importantes lors du passage à une nouvelle version majeure du constructeur.

Voici les principales bonnes pratiques à appliquer :

  • Effectuer des sauvegardes régulières : sauvegardez les fichiers et la base de données avant toute modification importante, notamment lors d’une mise à jour majeure de Breakdance.

  • Utiliser un environnement de test : vérifiez les nouvelles versions sur une copie de votre site avant de les déployer en production. Breakdance précise que les installations locales, de développement et de staging ne comptent pas dans les limites de licences Pro.

  • Maintenir WordPress à jour : planifiez les mises à jour du CMS, de Breakdance, des extensions et de PHP, après vérification des compatibilités.

  • Limiter les extensions superflues : évitez d’installer plusieurs constructeurs de pages lorsque leurs fonctionnalités se chevauchent inutilement.

  • Privilégier les styles globaux : centralisez les réglages des couleurs, des polices et des boutons pour faciliter la maintenance.

  • Respecter l’accessibilité et la confidentialité : vérifiez les contrastes, la navigation au clavier et les informations fournies aux visiteurs concernant leurs données personnelles.

Si vous utilisez les agents IA de Breakdance 3.0, accordez uniquement les autorisations nécessaires et contrôlez les changements avant leur publication.

Ces recommandations permettent de simplifier la maintenance du site et de réduire les risques lors des évolutions techniques.

FAQ

Breakdance est-il gratuit ?

Oui. Breakdance Free est disponible gratuitement, avec une utilisation sur un nombre illimité de sites WordPress, 80 éléments et une bibliothèque de modèles limitée. Les fonctionnalités avancées sont proposées dans les offres Pro, à partir de 99,99 $ par an, selon les tarifs relevés le 28 octobre 2026.

Breakdance fonctionne-t-il avec n’importe quel thème ?

Breakdance dispose de son propre système de modèles et permet de gérer une grande partie de l’apparence du site indépendamment du thème. Toutefois, la compatibilité avec tous les thèmes WordPress ne peut pas être garantie sans vérification. Testez votre thème sur une installation de démonstration avant de modifier un site existant.

Que se passe-t-il si je ne renouvelle pas la licence Breakdance ?

Selon l’éditeur, votre site continue de fonctionner et les fonctionnalités Pro déjà utilisées restent actives. En revanche, vous perdez l’accès aux mises à jour, au support premium et à la bibliothèque de modèles inclus dans l’abonnement.

Peut-on utiliser Breakdance pour créer des sites clients ?

Oui. Breakdance autorise la création de sites WordPress pour des clients, sans obligation pour ces derniers d’acheter leur propre licence. Vous devez simplement respecter le nombre de sites autorisés par votre formule. Les installations de développement ne sont pas comptabilisées dans cette limite.

Breakdance convient-il à une boutique WooCommerce ?

Oui. Breakdance propose des fonctionnalités de personnalisation WooCommerce. La version Free comprend une intégration basique, tandis que Breakdance Pro donne accès à des possibilités plus complètes pour créer les pages produits et les différentes interfaces d’une boutique en ligne.

Faut-il une IA payante pour utiliser le mode IA de Breakdance ?

Breakdance 3.0 permet de connecter des agents IA compatibles MCP, notamment Claude, Codex et Cursor. Le coût dépend du service choisi, de son abonnement éventuel et de ses conditions d’utilisation. Il n’est donc pas possible d’affirmer qu’un abonnement IA payant est toujours obligatoire. Le fonctionnement et les éventuels frais doivent être vérifiés auprès du fournisseur de l’agent.

Plus d'informations


Prêt à publier votre site WordPress ?

Avec un hébergement WordPress LWS, vous pouvez installer WordPress depuis votre interface d’hébergement, puis ajouter Breakdance Builder pour concevoir votre site. Consultez les caractéristiques des offres afin de choisir un environnement adapté à votre projet.

Conclusion

Breakdance Builder permet de créer un site WordPress personnalisé sans maîtriser la programmation. Grâce à son éditeur visuel, ses styles globaux et ses modèles réutilisables, vous pouvez concevoir les différentes pages de votre site tout en conservant une présentation cohérente. 💥Dans ce tutoriel, nous avons parcouru les principales étapes : installation du constructeur, configuration de l’identité visuelle, création du header et du footer, ajout de pages et de formulaires, puis vérification des performances et du référencement.🪕Avec Breakdance 3.0, la connexion d’agents IA compatibles MCP ouvre également de nouvelles possibilités pour automatiser certaines tâches de création et de gestion. Vous disposez désormais des bases nécessaires pour développer votre site vitrine. Vous pourrez ensuite enrichir votre projet avec WooCommerce, explorer les fonctionnalités d’intelligence artificielle et poursuivre l’optimisation de votre site WordPress.⚡

Besoin d’un hébergement WordPress rapide et de qualité ?

Profitez de l'offre exclusive de LWS : hébergement WordPress en France à -42% ! Démarrez dès maintenant à partir de 3,49€/mois au lieu de 5,99€. Performance 🚀 et support exceptionnel garantis ! 😊

Découvrir l’offre

Avez-vous déjà utilisé Breakdance Builder pour créer un site WordPress ? Partagez votre expérience, vos questions ou les difficultés rencontrées dans les commentaires ci-dessous, nous serons ravis de vous répondre !

Avatar de l'auteur

Auteur de l'article

Joseph

Bonjour, je m'appelle Joseph. Je suis rédacteur spécialisé dans WordPress, PrestaShop et d'autres CMS. Fort d'une expertise approfondie en PHP et MySQL, je partage mes connaissances à travers des tutoriels simples et accessibles. Passionné par le développement et la transmission de savoir, j'aime expliquer et rendre les concepts techniques compréhensibles pour tous

Avis client de l'hébergeur LWS

Nos avis Trustpilot Nos avis Hostadvice Nos avis sur avis.lws.fr
Avis trustpilot 30/04/2022

LWS l'hébergeur par excellence !

LWS est pour moi l'hébergeur par excellence, que cela soit au niveau de l'hébergement qui est très performant, les mails qui sont d'une qualité professionnelle et de la gestion du domaine facile à comprendre.

PauseGreen

Avis hostadvice 27/04/2022

Super, au top !

Au top, prix attractif. Service très rapide et réactif. Je l'ai même personnellement recommandé à des proches. La vie est bien plus facile avec LWS

Masset Eliot

Avis avislws 26/04/2022

Support

Clair, efficace, rapide et à tarif abordable. J'ai maintenant un site superbe à mon image, puisque je le fais moi-même. L'équipe technique est au top, j'ai une réponse en 20 minutes, cela change d'autres hébergeurs pourtant plus connu.

Lady Whip

Avis hostadvice 24/04/2022

Bravo et merci

Bravo et merci aux équipes techniques pour leur réactivité et leur professionnalisme depuis plus de 10 ans chez eux et de nombreux sites !!! Merci

Olivier Delmas

Avis trustpilot 23/04/2022

Je suis très satisfait.

J'ai commandé un hébergement pour le site d'une association. Tout s'est passé très rapidement et sans la moindre embuche. La tarification est attractive et me parait très claire. Le panneau d'administration de l'hébergement est facile à utiliser et à comprendre. Je n'ai pas encore installé Wordpress car le contenu n'est pas prêt mais ce sera la prochaine étape et je suis très confiant. Merci !

Pierre-André Liné

Avis avislws 20/04/2022

Un service technique excellent

Je suis client chez LWS depuis 2011 avec une boutique OSCommerce qui tourne comme une horloge depuis cette date sur un hébergement mutualisé. La disponibilité de la boutique est très proche de 100%. Concernant les rares problèmes rencontrés en huit ans, j’ai eu à chaque fois un technicien compétent qui a résolu le problème très rapidement et efficacement. Je suis en train de migrer sur une plateforme Pretashop sur un VPS, avec l’offre LWS Debian 9 et Prestashop. Un technicien m’a grandement aidé pour finaliser l’installation de la boutique lors de la mise à jour vers la dernière version de Prestashop 1.7 qui posait problème. Je suis très satisfait de LWS, et ce sur la durée : réponses et réactions rapides et efficaces. Je recommande cet hébergeur et encore merci.

Alain

Avis trustpilot 16/04/2022

Une expérience jamais égalée !

Étant Développeur Web & Mobile Full-Stack depuis plus de 5 ans déjà, j'ai rarement eu un service client aussi rapide et efficace. Sans compter la qualité du service en ligne. Je recommande VIVEMENT LWS !

Chris KOUAKAM

Avis hostadvice 12/04/2022

Très bon hébergeur

J'ai un serveur VPS chez eux et je n'ai aucun problème, dès qu'il y a un problème le service technique est la pour vous aider et répond assez rapidement à votre demande. Je recommande vivement cet hébergeur.

Vanden Cruyce

Avis avislws 09/04/2022

Je suis ravie

Je suis ravie d'être avec LWS sur tous les plans, je remercie les Techniciens (Fabrice, Omar, Sandy-Mahitsison) depuis plus de 8 ans j'ai évolué avec LWS et toujours soutenue. Une véritable relation humaine même si les questions ou nos inquiétudes ne correspondent pas à leurs missions, ils sont là pour nous répondent et nous rassurent. Mon site c'est mon travail ma source de revenue donc il sont mes partenaires ! les travailleurs de l'ombre merci à eux ! Merci LWS

L'atelier-and-Co

Commentaires (0)

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée.