15%

Économisez 15% sur tous les services d'hébergement

Testez vos compétences et obtenez Réduction sur tout plan d'hébergement

Utilisez le code :

Skills
Commencer
21.10.2024

Comment utiliser les modèles de démarrage dans WordPress pour créer n’importe quel site dont vous avez besoin

Les modèles de démarrage dans WordPress sont des mises en page entièrement conçues et prédéfinies que vous pouvez importer sur votre site en un seul clic, vous offrant une structure visuelle complète — en-têtes, pieds de page, pages internes, typographie et palettes de couleurs — sans écrire une seule ligne de code. Ils sont fournis avec des thèmes comme Astra, Neve, Kadence et OceanWP, et sont accessibles via des plugins complémentaires qui se connectent à une bibliothèque de designs spécifiques à chaque secteur.

La valeur pratique est significative : au lieu d’assembler une page d’accueil de zéro, vous importez un modèle correspondant à votre niche (produit SaaS, cabinet d’avocats, boutique WooCommerce, portfolio), puis remplacez le contenu fictif par le vôtre. L’ensemble du processus, d’une installation WordPress vierge à un site multi-pages stylisé, peut prendre moins de 30 minutes — à condition que votre environnement d’hébergement soit correctement configuré.

Ce dont vous avez besoin avant de commencer

Avant de toucher au tableau de bord WordPress, vérifiez les prérequis côté serveur suivants. De nombreux échecs d’importation de modèles sont dus à une configuration d’hébergement inadéquate, et non à des bugs de plugins.

Exigences minimales en matière de PHP et de mémoire :

  • PHP 7.4 ou supérieur (PHP 8.1+ recommandé pour les thèmes modernes)
  • memory_limit défini à au moins 256 MB dans php.ini
  • max_execution_time de 300 secondes ou plus
    upload_max_filesize et post_max_size tous deux à 64 MB ou plus
    
    Si vous disposez d’un plan Hébergement VPS, vous pouvez modifier ces valeurs directement dans /etc/php/8.1/fpm/php.ini (ajustez le chemin de version pour correspondre à votre stack) et recharger PHP-FPM :
    sudo nano /etc/php/8.1/fpm/php.ini
    # Set: memory_limit = 256M, max_execution_time = 300
    sudo systemctl reload php8.1-fpm
    Dans les environnements mutualisés, ces limites sont souvent définies via le panneau de contrôle de l’hébergement. Si vous utilisez un plan d’Hébergement Web Mutualisé, vérifiez la section de configuration PHP dans cPanel ou contactez le support pour augmenter les limites avant de tenter une importation complète du site.
    SSL est fortement recommandé avant le lancement. Importer un modèle en HTTP puis passer en HTTPS ultérieurement entraîne des problèmes de contenu mixte dans les images et scripts intégrés. Configurez votre Certificat SSL avant d’exécuter l’importation.
    Étape 1 : Choisir un thème qui prend en charge les modèles de démarrage
    Tous les thèmes WordPress ne sont pas accompagnés d’une bibliothèque de modèles. Les quatre suivants constituent les écosystèmes les plus matures, chacun avec des centaines de modèles et un développement actif :
    
    
    
    Thème
    Taille de la bibliothèque de modèles
    Compatibilité avec les constructeurs de pages
    Base légère (KB)
    Niveau gratuit
    
    
    
    
    
    
    
    
    —
    —
    —
    —
    —
    
    
    
    
    
    
    
    
    **Astra**
    250+ modèles
    Elementor, Gutenberg, Beaver Builder, Brizy
    ~50 KB
    Oui
    
    
    
    
    
    
    
    
    **Neve**
    100+ modèles
    Elementor, Gutenberg, Brizy
    ~30 KB
    Oui
    
    
    
    
    
    
    
    
    **Kadence**
    100+ modèles
    Gutenberg (natif), Elementor
    ~40 KB
    Oui
    
    
    
    
    
    
    
    
    **OceanWP**
    50+ modèles
    Elementor, Gutenberg
    ~60 KB
    Oui
    
    
    
    
    
    Astra est l’option la plus largement déployée et possède l’intégration Elementor la plus poussée. Kadence est le meilleur choix si vous souhaitez rester entièrement dans l’éditeur de blocs natif Gutenberg et éviter une dépendance à un constructeur de pages tiers. Neve est le plus optimisé pour les performances dès la sortie de la boîte.
    Pour installer le thème de votre choix :
    
    Connectez-vous à votre tableau de bord WordPress.
    Accédez à Apparence > Thèmes.
    Cliquez sur Ajouter, recherchez votre thème par son nom.
    Cliquez sur Installer, puis sur Activer.
    
    Étape 2 : Installer le plugin Starter Templates
    Chaque écosystème de thèmes utilise un plugin légèrement différent pour exposer sa bibliothèque de modèles. Le tableau ci-dessous associe les thèmes à leurs plugins complémentaires :
    
    
    
    Thème
    Nom du plugin
    Identifiant WordPress.org
    
    
    
    
    
    
    
    
    —
    —
    —
    
    
    
    
    
    
    
    
    Astra
    Starter Templates
    `astra-sites`
    
    
    
    
    
    
    
    
    Neve
    Neve Pro / Otter Blocks
    `otter-blocks`
    
    
    
    
    
    
    
    
    Kadence
    Kadence Starter Templates
    `kadence-starter-templates`
    
    
    
    
    
    
    
    
    OceanWP
    Ocean Extra
    `ocean-extra`
    
    
    
    
    
    Pour Astra (le flux de travail le plus courant) :
    
    Allez dans Extensions > Ajouter.
    Recherchez Starter Templates.
    Installez et activez le plugin nommé Starter Templates – Elementor, Gutenberg & Beaver Builder Templates.
    
    Une fois activé, un nouvel élément de menu apparaît sous Apparence > Starter Templates.
    Cas limite critique : Si vous migrez un site existant et que vous avez déjà du contenu, n’exécutez pas une importation complète du site. Cela écrasera vos pages, menus et widgets existants. Utilisez plutôt Importer une seule page ou Importer le modèle d’accueil, et fusionnez manuellement les éléments de design dont vous avez besoin.
    Étape 3 : Sélectionner et importer un modèle de démarrage
    Après avoir activé le plugin, l’assistant d’importation se lance automatiquement ou est accessible via Apparence > Starter Templates.
    Flux de travail :
    
    Choisissez votre constructeur de pages. L’assistant vous demande si vous souhaitez utiliser Elementor, Gutenberg ou Beaver Builder. Ce choix est définitif pour l’importation — vous ne pouvez pas mélanger les constructeurs dans une seule importation de modèle. Choisissez Gutenberg si vous souhaitez une configuration plus légère sans plugins supplémentaires ; choisissez Elementor si vous avez besoin d’une flexibilité avancée de glisser-déposer.
    
    
    Filtrez par catégorie. Les modèles sont organisés par secteur (Entreprise, eCommerce, Agence, Restaurant, Portfolio, Éducation, etc.). Utilisez la barre de recherche pour filtrer par mots-clés.
    
    
    Prévisualisez avant d’importer. Cliquez sur la miniature d’un modèle pour ouvrir un aperçu en direct. Inspectez les pages internes (À propos, Contact, Blog) — pas seulement la page d’accueil — car la page d’accueil semble souvent soignée tandis que les pages internes sont peu fournies.
    
    
    Choisissez la portée de votre importation :
    
    
    Importer le site complet — importe toutes les pages, articles, menus, widgets et paramètres du personnalisateur de thème. Idéal pour les nouveaux sites.
    Importer le modèle d’accueil — importe uniquement la mise en page de la page d’accueil. Idéal pour les sites existants où vous souhaitez uniquement rafraîchir la page principale.
    
    
    Confirmez l’importation. Le plugin téléchargera le contenu de démonstration, les images (depuis Unsplash ou le CDN du plugin) et les paramètres du personnalisateur. Sur des connexions lentes ou des serveurs restrictifs, cela peut prendre 60 à 90 secondes.
    
    Ce qui est importé et ce qui ne l’est pas :
    
    
    
    Élément
    Importé
    Remarques
    
    
    
    
    
    
    
    
    —
    —
    —
    
    
    
    
    
    
    
    
    Mises en page
    Oui
    Toutes les pages de la démo
    
    
    
    
    
    
    
    
    Images de démonstration
    Oui
    Images fictives depuis le CDN Unsplash
    
    
    
    
    
    
    
    
    Plugins (WooCommerce, etc.)
    Proposé
    L’installateur de plugins s’exécute dans le cadre de l’assistant
    
    
    
    
    
    
    
    
    Vos articles/pages existants
    Non
    Le contenu existant n’est pas supprimé sauf si vous choisissez « Supprimer les données précédemment importées »
    
    
    
    
    
    
    
    
    Paramètres de domaine/DNS personnalisés
    Non
    Doit être configuré séparément
    
    
    
    
    
    
    
    
    Certificat SSL
    Non
    Doit être préconfiguré
    
    
    
    
    
    Étape 4 : Personnaliser le modèle
    Utilisation de l’éditeur Elementor
    Accédez à Pages, survolez n’importe quelle page et cliquez sur Modifier avec Elementor. L’éditeur visuel s’ouvre avec la mise en page importée entièrement modifiable.
    Actions de personnalisation clés :
    
    Remplacer les images : Cliquez sur n’importe quel widget d’image, puis cliquez sur la miniature de l’image dans le panneau de gauche pour ouvrir la médiathèque. Remplacez les images de démonstration par vos propres ressources.
    Modifier le texte en ligne : Cliquez directement sur n’importe quel élément de texte pour le modifier sur place.
    Couleurs et polices globales : Dans Elementor, allez dans Paramètres du site > Couleurs globales et Polices globales pour définir votre palette de marque et votre système typographique à l’échelle du site. Modifier une couleur globale met à jour chaque élément qui y fait référence sur toutes les pages simultanément.
    Structure des sections et des colonnes : Faites un clic droit sur n’importe quelle section pour la dupliquer, la supprimer ou la déplacer. Utilisez le panneau Navigateur (l’icône de calques dans la barre d’outils inférieure) pour les mises en page complexes avec des sections imbriquées.
    
    Après avoir modifié, cliquez sur Mettre à jour (pas sur Publier — la page est déjà publiée ; Mettre à jour enregistre vos modifications).
    Utilisation de l’éditeur de blocs Gutenberg
    Accédez à Pages, cliquez sur Modifier sur la page cible. L’éditeur de blocs s’ouvre avec la mise en page basée sur des patterns importée.
    Actions de personnalisation clés :
    
    Cliquez sur n’importe quel bloc pour le sélectionner. Utilisez la barre d’outils au-dessus du bloc pour les options d’alignement, de couleur et de mise en forme.
    Utilisez la Vue en liste (l’icône de lignes empilées dans la barre d’outils supérieure) pour voir et naviguer dans la hiérarchie complète des blocs — essentiel pour les modèles complexes avec des blocs Groupe et Couverture imbriqués.
    Pour modifier les styles globaux, allez dans Apparence > Éditeur > Styles (thèmes Full Site Editing) ou Apparence > Personnaliser (thèmes classiques).
    Le panneau Styles dans l’éditeur de site vous permet de définir la typographie globale et les palettes de couleurs qui se propagent à tous les blocs.
    
    Note sur les performances : Les modèles basés sur Gutenberg génèrent un HTML plus propre et se chargent plus rapidement que ceux basés sur Elementor, car ils ne nécessitent pas le JavaScript d’exécution d’Elementor. Pour les sites où les Core Web Vitals sont une priorité, le chemin Gutenberg est mesurément meilleur.
    Étape 5 : Configurer les paramètres globaux du thème
    Après l’importation, ouvrez Apparence > Personnaliser pour affiner le système de design global. Les panneaux disponibles varient selon le thème, mais tous les principaux thèmes de modèles de démarrage exposent :
    Typographie :
    
    Définissez la famille de polices principale pour les titres (H1–H6) et le corps du texte.
    Définissez les tailles de police, les hauteurs de ligne et l’espacement des lettres globalement.
    Utilisez des polices système (-apple-system, BlinkMacSystemFont, sans-serif) ou une sélection Google Fonts. Les polices système éliminent une requête HTTP externe et améliorent les scores LCP.
    
    Couleurs :
    
    Définissez une couleur principale (accent de marque), une couleur secondaire, une couleur de texte et une couleur d’arrière-plan.
    Ces valeurs alimentent les propriétés CSS personnalisées (--wp--preset--color--primary) auxquelles tous les blocs et widgets importés font référence.
    
    Mise en page :
    
    Définissez la largeur globale du conteneur (généralement 1200px–1440px pour les designs modernes).
    Configurez la mise en page de l’en-tête : en-tête fixe, en-tête transparent au défilement, comportement du menu mobile.
    Configurez les colonnes du pied de page, les zones de widgets et le texte de copyright.
    
    Spécifique à Astra : Le personnalisateur d’Astra dispose d’un panneau Performance où vous pouvez désactiver le chargement de Google Fonts (utile si vous hébergez vous-même les polices pour la conformité RGPD) et activer la minification CSS.
    Étape 6 : Remplacer le contenu fictif
    Le contenu de démonstration des modèles est intentionnellement générique. Un remplacement systématique est plus rapide que de modifier page par page :
    
    Allez dans Pages et triez par Date pour trouver toutes les pages importées lors de la configuration du modèle.
    Ouvrez chaque page et remplacez :
    
    
    Les titres et le corps du texte par votre contenu réel.
    Les images de démonstration par vos propres photos ou des images sous licence. Utilisez un texte alt descriptif pour chaque image.
    Les numéros de téléphone, adresses et adresses e-mail fictifs.
    Les liens de navigation de démonstration — vérifiez Apparence > Menus pour vous assurer que tous les éléments de menu pointent vers de vraies pages.
    
    
    Mettez à jour le Titre du site et le Slogan sous Réglages > Général.
    Définissez votre Page d’accueil et votre Page des articles sous Réglages > Lecture.
    
    Étape critique pour le SEO : Après avoir remplacé le contenu, installez Yoast SEO ou Rank Math et définissez un méta-titre et une méta-description uniques pour chaque page. Les importations de modèles ne renseignent pas les métadonnées SEO.
    Étape 7 : Étendre les fonctionnalités avec des plugins
    Les modèles de démarrage fournissent une structure de design, pas des fonctionnalités. Selon le type de votre site, vous aurez besoin de plugins supplémentaires :
    
    
    
    Type de site
    Plugin recommandé
    Objectif
    
    
    
    
    
    
    
    
    —
    —
    —
    
    
    
    
    
    
    
    
    eCommerce
    WooCommerce
    Catalogue de produits, panier, paiement
    
    
    
    
    
    
    
    
    Génération de leads
    WPForms ou Contact Form 7
    Formulaires de contact et de demande
    
    
    
    
    
    
    
    
    Adhésion
    MemberPress ou Restrict Content Pro
    Contenu réservé aux membres
    
    
    
    
    
    
    
    
    SEO
    Rank Math ou Yoast SEO
    SEO on-page, sitemaps, schema
    
    
    
    
    
    
    
    
    Performance
    WP Rocket ou LiteSpeed Cache
    Mise en cache, minification, chargement différé
    
    
    
    
    
    
    
    
    Sécurité
    Wordfence ou Solid Security
    Pare-feu, analyse des malwares
    
    
    
    
    
    
    
    
    Sauvegarde
    UpdraftPlus
    Sauvegardes automatisées hors site
    
    
    
    
    
    Si vous utilisez WooCommerce, vérifiez que votre plan d’hébergement peut gérer la charge de base de données supplémentaire. Un VPS avec cPanel vous offre la marge de ressources et l’interface de gestion nécessaires pour gérer WooCommerce à grande échelle sans les contraintes de l’hébergement mutualisé.
    Étape 8 : Prévisualiser, tester et lancer
    Avant de publier, parcourez cette liste de contrôle pré-lancement :
    Contrôle qualité visuel :
    
    Prévisualisez sur ordinateur, tablette et mobile en utilisant l’aperçu responsive du Personnalisateur WordPress ou les DevTools du navigateur.
    Vérifiez qu’aucune image de démonstration ne reste sur aucune page.
    Vérifiez que toutes les polices se sont chargées correctement (la limitation de bande passante dans les DevTools peut révéler un scintillement lors du chargement des polices).
    
    Tests fonctionnels :
    
    Soumettez chaque formulaire et confirmez que l’e-mail de notification arrive. Vérifiez votre configuration d’Hébergement E-mail si les e-mails transactionnels ne sont pas délivrés — le wp_mail() par défaut de WordPress repose sur la fonction mail() de PHP, que de nombreux hébergeurs bloquent. Utilisez un plugin SMTP (WP Mail SMTP, Post SMTP) avec des identifiants authentifiés.
    Cliquez sur chaque lien de navigation et chaque bouton. Les modèles importés contiennent parfois des URL de démonstration codées en dur.
    Testez le processus de paiement si WooCommerce est actif.
    
    Référence de performance :
    
    Effectuez un test PageSpeed Insights sur la page d’accueil. Visez un LCP inférieur à 2,5 secondes et un score CLS inférieur à 0,1.
    Si les scores sont mauvais, activez la mise en cache, optimisez les images (convertissez en WebP) et envisagez un CDN.
    
    Sécurité :
    
    Assurez-vous que HTTPS est appliqué sur l’ensemble du site. Vérifiez qu’il n’y a pas d’avertissements de contenu mixte dans la console du navigateur.
    Changez le nom d’utilisateur administrateur WordPress par défaut s’il est encore admin.
    Définissez les permissions des fichiers : répertoires à 755, fichiers à 644, et wp-config.php à 600.
    
    Une fois toutes les vérifications effectuées, le site est prêt. S’il est encore sous un domaine temporaire, mettez à jour l’Adresse WordPress (URL) et l’Adresse du site (URL) sous Réglages > Général après avoir pointé votre domaine. Vous pouvez enregistrer ou transférer votre domaine via l’Enregistrement de domaine si vous ne l’avez pas encore fait.
    Pièges courants et comment les éviter
    L’importation échoue en cours de processus : Généralement causé par un memory_limit ou un max_execution_time PHP trop faible. Augmentez ces valeurs comme décrit dans la section des prérequis, puis réessayez l’importation.
    Les images de démonstration ne se chargent pas après l’importation : Le plugin Starter Templates récupère les images depuis un CDN externe. Si votre serveur a des restrictions HTTP sortantes ou un pare-feu bloquant les requêtes externes, les images ne seront pas téléchargées. Autorisez les domaines CDN du plugin ou assouplissez temporairement les règles sortantes pendant l’importation.
    Le modèle est différent de l’aperçu : Cela signifie presque toujours qu’un plugin requis (Elementor Pro, un module complémentaire spécifique) n’a pas été installé. L’assistant d’importation liste les plugins requis — installez-les tous avant d’importer.
    Les modifications du personnalisateur ne s’appliquent pas aux pages importées : Certains modèles Elementor utilisent les propres paramètres globaux d’Elementor plutôt que le personnalisateur de thème. Les modifications effectuées dans Apparence > Personnaliser n’affecteront pas les éléments contrôlés par Elementor. Utilisez Elementor > Paramètres du site pour ces pages.
    Régression des performances après l’importation : Les importations complètes de site chargent tous les plugins et ressources de démonstration. Auditez vos plugins actifs après l’importation et désactivez tout ce dont vous n’avez pas besoin. Chaque plugin actif ajoute une surcharge d’exécution PHP à chaque chargement de page.
    Matrice de décision technique : choisir votre chemin de construction
    
    
    
    Scénario
    Chemin recommandé
    
    
    
    
    
    
    
    
    —
    —
    
    
    
    
    
    
    
    
    Nouveau site, pas de contenu existant, besoin de rapidité
    Astra + Starter Templates + Elementor, importation complète du site
    
    
    
    
    
    
    
    
    Site critique en termes de performance (priorité Core Web Vitals)
    Kadence + Kadence Starter Templates + Gutenberg uniquement
    
    
    
    
    
    
    
    
    Site existant, refonte de la page d’accueil uniquement
    N’importe quel thème + importation d’un modèle de page unique
    
    
    
    
    
    
    
    
    Boutique WooCommerce
    Astra ou Kadence + modèle spécifique WooCommerce
    
    
    
    
    
    
    
    
    Développeur travaillant pour un client
    Neve + thème enfant + importations de blocs sélectives
    
    
    
    
    
    
    
    
    Empreinte minimale de plugins requise
    Kadence + Gutenberg, sans Elementor
    
    
    
    
    
    Liste de contrôle pré-lancement
    
    La limite de mémoire PHP est de 256 MB ou plus avant l’importation
    Le certificat SSL est actif et HTTPS est appliqué
    L’importation complète du site a d’abord été effectuée sur un environnement de staging, puis poussée en production
    Tout le texte et les images fictifs de démonstration ont été remplacés
    Les méta-titres et descriptions SEO sont définis sur chaque page
    Tous les formulaires testés avec la livraison réelle des e-mails confirmée
    Menus de navigation vérifiés — pas de liens morts ni d’URL de démonstration
    Référence de performance mesurée avec PageSpeed Insights
    Plugin de mise en cache actif et configuré
    Nom d’utilisateur administrateur changé depuis la valeur par défaut admin
  • Permissions wp-config.php définies à 600
  • DNS du domaine pointant vers l’IP correcte du serveur

FAQ

Puis-je utiliser un modèle de démarrage sur un site WordPress existant sans perdre mon contenu actuel ?

Oui, mais vous devez sélectionner « Importer une seule page » ou « Importer le modèle d’accueil » plutôt que « Importer le site complet ». L’importation complète du site écrasera les pages, menus et zones de widgets existants. Effectuez toujours une sauvegarde complète avant toute opération d’importation.

Les modèles de démarrage fonctionnent-ils avec n’importe quel thème WordPress, ou uniquement avec des thèmes spécifiques ?

Les modèles de démarrage sont liés à des écosystèmes de thèmes spécifiques. Le plugin Astra Starter Templates ne fonctionne qu’avec le thème Astra. Kadence Starter Templates nécessite le thème Kadence. Vous ne pouvez pas importer des modèles entre des thèmes incompatibles.

Pourquoi mes pages importées sont-elles différentes de l’aperçu du modèle ?

La cause la plus fréquente est un plugin requis manquant — généralement Elementor Pro ou un module complémentaire premium. L’assistant d’importation liste tous les plugins requis ; installez-les tous avant d’importer. Une cause secondaire est une limite de mémoire PHP qui a provoqué l’échec silencieux de l’importation, laissant certaines ressources non téléchargées.

L’utilisation d’un modèle de démarrage nuira-t-elle au SEO de mon site ?

Pas intrinsèquement, mais les modèles de démarrage importent du contenu de démonstration sans métadonnées SEO. Vous devez définir manuellement des méta-titres, descriptions et données structurées uniques pour chaque page. De plus, certains modèles lourds en Elementor génèrent un HTML volumineux qui peut affecter négativement les Core Web Vitals — auditez avec PageSpeed Insights après l’importation.

Puis-je passer à un autre modèle de démarrage après avoir déjà personnalisé mon site ?

Techniquement oui, mais c’est destructif. L’importation d’un nouveau modèle de site complet écrase vos personnalisations existantes. L’approche pratique consiste à exporter vos paramètres actuels du personnalisateur (en utilisant un outil d’exportation de thème), à importer le nouveau modèle sur un site de staging, à migrer manuellement votre contenu, puis à pousser le site de staging en production.

15%

Économisez 15% sur tous les services d'hébergement

Testez vos compétences et obtenez Réduction sur tout plan d'hébergement

Utilisez le code :

Skills
Commencer