Créer un site WordPress magnifique avec Claude Code, de A à Z

Vous hésitez entre une IA comme Claude et WordPress pour créer votre site professionnel ? C’est logique : d’un côté, Claude permet de construire très vite des sites au design très avancé, sans aucune barrière technique. De l’autre, WordPress offre quelque chose d’essentiel : un véritable espace d’administration pour modifier, gérer et faire évoluer votre site facilement, sans dépendre de l’IA à chaque changement.

La bonne nouvelle, c’est qu’il n’y a plus besoin de choisir. Comme l’explique Julien, webdesigner freelance : « Claude + WordPress, c’est le combo parfait ».

Première utilisation de Claude ? Voici la mise en route en 30 secondes chrono.

• Rendez-vous sur claude.ai et créez un compte.
• Choisissez un plan : le plan Pro (≈ 18 €/mois) suffit largement pour créer un ou plusieurs sites. Le plan Max ne se justifie que pour un usage intensif.
• Téléchargez l’application desktop Claude (indispensable pour utiliser Claude Code), installez-la et ouvrez-la.
• Basculez de l’onglet « Chat » vers l’onglet « Code » pour arriver dans Claude Code.
• Assignez un dossier de travail (ex. « site-wordpress » sur le bureau) : Claude y écrira tout le code et les fichiers de votre site.
• Si on vous le demande, installez Git (30 secondes, étapes guidées).
• Sélectionnez le modèle le plus puissant disponible dans votre plan (famille Opus), et laissez le niveau d’effort sur « Extra » : excellent compromis qualité / consommation de tokens pour un site web.

Claude et WordPress ne parlent pas vraiment la même langue :

• Claude pense en code : un code parfait, mais figé — difficile à modifier sans repasser par l’IA ou sans compétences en développement.
• WordPress pense en blocs : des sortes de widgets (titre, paragraphe, image…) qui rendent le site modifiable visuellement.

Après des dizaines de méthodes testées (tutoriels, forums… souvent du bricolage aux résultats approximatifs), Julien a mis au point un processus qui transpose le site créé en pur code par Claude vers WordPress en blocs, puis l’a emballé dans un « Skill » offert gratuitement : un simple fichier ZIP contenant ses instructions.

Résultat : un prompt → la page d’accueil est créée → vous validez → les autres pages suivent → puis le site est importé automatiquement dans WordPress, pixel perfect, sans des milliers de retouches.

• Téléchargez gratuitement le Skill (lien en description de la vidéo : webmarketingtuto.com/claude-wordpress-skill). Vous obtenez un fichier ZIP.
• Dans Claude Code, glissez-déposez le ZIP dans la conversation avec le prompt : « Crée mon site WordPress ».
• Autorisez les permissions demandées (mode « toujours autoriser », ou mode « auto » pour moins de validations manuelles).
• Claude vous répond avec un prompt modèle à copier-coller et à remplir avec vos informations : c’est le point de départ de votre site.

Pour obtenir le meilleur résultat, votre prompt doit apporter assez de contexte :

• Votre entreprise : nom, secteur d’activité, description, coordonnées (email, téléphone).
• Les pages souhaitées : ex. Accueil, À propos, Services, Projets, Contact.
• Une ou plusieurs références visuelles : c’est LE secret d’un design premium. Sans référence, Claude produira un site générique.

🎯 Trouver l’inspiration sur Dribbble

Dribbble est gratuit et regorge de webdesigns professionnels. Créez un compte en 5 secondes, puis cherchez en anglais selon votre secteur (« lawyer website », « real estate website »…) dans la barre de recherche. Filtrez par « Web design », ouvrez un coup de cœur, faites défiler pour récupérer l’image complète du site, puis clic droit → enregistrer l’image.

Dans l’exemple de la vidéo : un cabinet d’architecture à Bordeaux spécialisé dans les maisons haut de gamme, avec 5 pages et une référence visuelle déposée par glisser-déposer avec le prompt. Ensuite, on envoie !

👀 Valider la page d’accueil

Claude génère la V1 de l’accueil, explique ses choix typographiques, corrige seul ses premiers bugs (notamment mobile), puis fournit un lien de prévisualisation. Images placeholder piochées chez Unsplash (banque gratuite et libre de droits), animations au survol, sections soignées : le rendu est déjà digne d’un pro.

C’est LA méthode recommandée pour ne pas perdre de temps :

L’erreur classique ? Valider une V1 qui ne satisfait pas encore, puis vouloir tout corriger dans WordPress : beaucoup plus long. Le global dans Claude, les détails dans WordPress.

📱 Le contrôle final avant export

• Parcourez chaque page générée (À propos, Services, Projets, Contact…).
• Vérifiez le responsive : clic droit → Inspecter → vue mobile (menu, alignements, espacements).
• Corrigez les derniers détails macro avec captures d’écran à l’appui.

Pour l’instant, votre site n’existe qu’en local (dans le dossier de votre ordinateur). Pour le publier, il faut deux choses : un hébergement (qui stocke code et images sur internet) et un nom de domaine (l’adresse de votre site). Le tout s’installe en un clic chez un hébergeur — Julien recommande Hostinger, son choix pour tous ses projets.

• Ouvrez le lien Hostinger ci-dessous : une promotion s’affiche automatiquement.
• Choisissez la formule la moins chère : elle suffit largement (jusqu’à 3 sites hébergés + domaine offert).
• Passez la durée à 12 mois (≈ 43,41 €/an), puis appliquez le code promo « WEB10 » : la facture passe sous les 40 €. Garantie 30 jours satisfait ou remboursé.
• Créez votre compte, renseignez la facturation et le paiement, puis cliquez sur « Démarrer la configuration ».
• « Créer un nouveau site » → choisissez WordPress → suivant.
• Réclamez votre domaine gratuit (ex. mon-site.com). Attention : en changer plus tard coûte environ 10 €/an. Enregistrez ensuite les informations du domaine.
• Sélectionnez le data center proposé (le plus proche / meilleure latence, ex. France ou Royaume-Uni).
• Créez vos identifiants WordPress (différents du compte Hostinger) : conservez-les précieusement, ce sont les clés de votre back-office.
• Cliquez sur « Créer de A à Z »… et laissez WordPress s’installer.

🔑 Accéder au back-office WordPress

• Méthode 1 : depuis le tableau de bord Hostinger → « Sites » → « WordPress admin » (connexion automatique).
• Méthode 2 : ajoutez /wp-admin à votre URL, puis entrez email + mot de passe WordPress.

Une fois inside, pas de panique : Articles (blog), Médias (images), Pages (votre site), Extensions (fonctionnalités supplémentaires, dont le SEO), Utilisateurs, Réglages… Dans notre cas, l’essentiel se passe dans Pages et Médias. La barre noire en haut permet de basculer entre back-office et site visible.

Pour que Claude puisse envoyer votre site dans WordPress en autonomie, on installe une extension gratuite servant de connecteur : Novamira. C’est un plugin open source qui donne à votre IA un accès complet à WordPress via MCP (PHP, WP-CLI, base de données, fichiers).

• Sur novamira.ai, cliquez sur « Download for free » : l’extension est téléchargée gratuitement sous forme de ZIP.
• Dans WordPress → Extensions : désactivez puis supprimez les extensions Hostinger installées par défaut (site plus propre).
• Ajouter une extension → Téléverser une extension → choisissez le ZIP Novamira → Installer → Activer.
• Un nouvel onglet Novamira apparaît : ouvrez-le, cochez la case demandée puis enregistrez.
• Choisissez l’outil « Claude Desktop », puis le mode de connexion « mot de passe d’application » (recommandé pour Hostinger).
• Générez le mot de passe d’application, puis téléchargez le fichier de connexion (étape 4).

À partir de là : rien à faire, juste attendre. Claude importe votre site dans WordPress :

• Chaque page est reconstruite en blocs modifiables, fidèle au pixel près au design validé.
• Le thème custom créé par Claude est installé automatiquement.
• Les bugs éventuels sont détectés et corrigés par le Skill, sans intervention de votre part.
• Le rendu desktop et mobile est vérifié page par page : menu, formulaire de contact, animations au survol… tout répond présent.

C’est toute la force du processus : pas un site « rafistolé » à retoucher pendant des heures, mais un résultat propre, 100 % éditable dès le premier coup.

Direction Pages → votre page → Modifier. Et là, magie :

• Cliquez sur un texte : il se modifie directement, comme dans un traitement de texte.
• Cliquez sur une image : « Remplacer » → téléversez la vôtre depuis votre ordinateur.
• Une image de fond ? Ouvrez le groupe / la section qui la contient, puis remplacez-la depuis le panneau du bloc.
• Formulaire de contact : page Contact → Modifier → onglet Mail → renseignez l’adresse email qui recevra les demandes.
• N’oubliez pas d’enregistrer après chaque page modifiée.

Remplacez aussi les contenus « inventés » par l’IA (noms de projets, équipe, adresse…) par vos vraies informations. Quant aux photos Unsplash en pleine taille : pas d’inquiétude, WordPress les compresse automatiquement.

Félicitations : votre site professionnel est en ligne, autonome et entièrement à vous. Une fois les micro-contenus remplacés, vous pouvez même résilier votre abonnement Claude : l’admin WordPress suffit désormais à toutes vos modifications futures, et l’écosystème d’extensions (SEO, boutique, formulaires avancés…) vous ouvre toutes les évolutions possibles.

Si ce guide vous a aidé, pensez à liker, commenter et vous abonner à la chaîne Web Marketing Tuto : Julien y partage ses processus et ressources gratuitement, sans publicité.