Comment créer un thème WordPress personnalisé en 5 étapes sans code

Vous souhaitez créer un thème WordPress personnalisé pour votre site Web ?

La création de votre propre thème WordPress à partir de zéro impliquait auparavant d'écrire du code complexe ou d'embaucher des développeurs de thèmes pour créer un thème pour vous. Mais grâce aux nouveaux générateurs de thèmes WordPress faciles à utiliser, n'importe qui peut créer un thème WordPress personnalisé sans écrire de code.

Cet article vous montrera comment créer un thème personnalisé dans WordPress étape par étape.

Qu'est-ce qu'un thème WordPress ?

Les thèmes WordPress sont des fichiers modèles écrits en PHP, HTML, CSS et JavaScript. Chaque fichier fonctionne ensemble pour créer la conception et les fonctionnalités de votre site WordPress.

Un thème WordPress typique comprendra certains, sinon tous, des fichiers de thème suivants :

• footer.php
• header.php
• index.php
• page.php
• sidebar.php
• archive.php

Les thèmes WordPress incluent également un fichier functions.php et un fichier style.css.

En règle générale, vous avez besoin d'une solide compréhension de plusieurs langages de conception Web ou d'un développeur Web pour créer un thème WordPress personnalisé.

Création de thèmes WordPress personnalisés pour les débutants

Si vous embauchez un développeur ou une agence de développement Web, le coût de la création d'un thème personnalisé à partir de zéro peut s'élever à des milliers de dollars. Parce que de nombreuses petites entreprises ne peuvent pas se permettre le coût, elles se contentent des thèmes WordPress par défaut fournis avec la plate-forme.

Pourtant, si vous êtes un propriétaire de site Web qui ne veut pas se contenter de la valeur par défaut, vous pouvez soit utiliser un framework de thème, comme Genesis par StudioPress par exemple, soit un plugin de création de page WordPress pour créer un thème personnalisé pour votre site WordPress.

Les cadres de thème WordPress facilitent la création d'un thème WordPress en gérant automatiquement une grande partie de la conception et des fonctionnalités. Cependant, ils restent une solution quelque peu compliquée, nécessitant des thèmes enfants par exemple, ils conviennent donc mieux aux développeurs qu'au propriétaire de site Web moyen.

D'un autre côté, les constructeurs de pages WordPress facilitent la création de mises en page personnalisées à l'aide d'une interface glisser-déposer, mais ils ont aussi leurs limites. Les constructeurs de pages vous permettent uniquement de créer des mises en page et vous ne pouvez généralement pas les utiliser pour créer des thèmes personnalisés.

Jusqu'à SeedProd, le meilleur constructeur de sites Web WordPress pour les thèmes personnalisés a décidé de résoudre ce problème avec son constructeur de thèmes WordPress.

Qu'est-ce que le générateur de thèmes SeedProd ?

SeedProd est déjà un puissant générateur de pages par glisser-déposer utilisé par plus d'un million de propriétaires de sites Web. Mais avec son constructeur de thèmes, tout utilisateur non technique peut créer un thème WordPress entièrement personnalisé sans code.

Au lieu de jongler avec les fichiers de contenu wp, vous pouvez créer des thèmes à partir de rien en quelques clics. SeedProd créera même votre feuille de style automatiquement.

SeedProd est livré avec :

• Interface visuelle par glisser-déposer
• Plus de 150 modèles Pro
• 2 millions de photos
• Prise en charge de WooCommerce
• Tableau de bord de gestion des abonnés
• Intégrations de marketing par e-mail

Et tant de fonctionnalités et de widgets supplémentaires dont vous avez besoin pour créer rapidement un site Web personnalisé à l'aide de WordPress.

Dans cet esprit, voyons comment créer un thème WordPress personnalisé sans écrire une seule ligne de code à l'aide de SeedProd.

Comment créer un thème WordPress personnalisé sans code

Pour créer un thème WordPress personnalisé avec SeedProd, vous aurez d'abord besoin d'un site Web WordPress pour installer le plugin SeedProd. Si vous n'avez pas encore d'installation WordPress, vous pouvez suivre ces étapes pour apprendre à créer un site Web WordPress.

Votre site Web doit également avoir un thème WordPress simple installé. Vous pouvez trouver de nombreuses solutions gratuites dans le répertoire des thèmes WordPress. Vous n'aurez pas à vous soucier de l'apparence du thème, car SeedProd le remplacera lorsque vous publierez vos personnalisations.

C'est également une bonne idée d'utiliser un environnement de développement lors du changement de votre thème WordPress pour éviter de casser accidentellement votre site Web. Les sociétés d'hébergement WordPress populaires telles que BlueHost proposent des environnements de test par défaut.

Vous devez également sauvegarder votre site Web avant d'apporter des modifications importantes. Voici une liste des meilleurs plugins de sauvegarde WordPress que vous pouvez utiliser.

Une fois votre site WordPress prêt, suivez les étapes ci-dessous pour créer un thème WordPress personnalisé sans code.

Étape 1. Installer et activer SeedProd

La première étape consiste à installer et à activer le plugin de création de site Web SeedProd. Pour accéder à la fonctionnalité de création de thèmes, vous aurez besoin d'une licence SeedProd Pro ou Elite.

Après avoir téléchargé le fichier zip du plugin SeedProd sur votre ordinateur, téléchargez-le, installez-le et activez-le sur votre tableau de bord WordPress. Si vous avez besoin d'aide pour cette étape, suivez ce guide sur l'installation d'un plugin WordPress.

Après avoir installé SeedProd, accédez à SeedProd ≫ Paramètres depuis votre zone d'administration WordPress et entrez votre clé de licence SeedProd.

Vous pouvez trouver votre clé de licence en visitant votre espace de compte SeedProd et en la copiant depuis l'onglet Téléchargements.

Vous pouvez maintenant accéder à SeedProd ≫ Theme Builder et voir la vue d'ensemble du Theme Builder. C'est ici que vous pouvez créer une hiérarchie de modèles pour votre thème WordPress.

En d'autres termes, c'est là que vous pouvez créer toutes les parties individuelles qui composent votre thème, telles que les suivantes :

• Entête
• Bas de page
• Message unique
• Une seule page
• Archives (page de blog)
• Page d'accueil
• Barre latérale

Vous pouvez créer chacune de ces parties de thème individuellement en cliquant sur le bouton Ajouter un nouveau modèle de thème .

Mais si cela semble trop écrasant pour votre premier essai, il existe une autre façon de créer votre thème.

Vous pouvez utiliser les modèles de thèmes prédéfinis de SeedProd pour créer rapidement le cadre de base de votre thème et les personnaliser en fonction de vos besoins de conception, sans code. Parce que cette solution est super facile pour les débutants, c'est ce sur quoi nous allons nous concentrer pour ce tutoriel.

Remarque : SeedProd propose également des centaines de modèles de page de destination réactifs pour vous aider à créer des pages de destination personnalisées.

Étape 2. Choisissez un modèle de thème

Le générateur de thèmes de SeedProd a déjà plusieurs thèmes créés pour vous. Pour les trouver, cliquez sur le bouton Thèmes .

Au moment de la rédaction de ce guide, il existe 9 modèles de thèmes, dont :

1. Thème de démarrage
2. Entreprise moderne
3. Agence de commercialisation
4. Thème de conception de produit
5. Entreprise de soins pour animaux de compagnie
6. Thème de stratégie numérique
7. Thème de la musique en direct
8. Thème du courtier en hypothèques
9. Thème des restaurants

Pour choisir un modèle de thème pour votre site Web, passez votre souris sur la vignette et cliquez sur l'icône de coche. Pour ce guide, nous utiliserons le thème de démarrage SeedProd.

Après avoir choisi votre template, SeedProd crée automatiquement toutes les parties qui composent votre thème.

S'il y a une fonctionnalité spécifique que vous ne souhaitez pas afficher sur votre site Web, vous pouvez cliquer sur la bascule sous l'en-tête Publier et désactiver cette partie du thème.

Si vous cliquez sur le lien des conditions pour chaque élément de modèle, vous pouvez modifier son nom, son type, sa priorité et choisir quand et où il apparaît sur votre site Web.

Étape 3. Personnalisez vos parties de thème WordPress

Une fois les éléments de base de votre thème en place, il est maintenant temps de commencer à modifier chaque section de thème pour créer un thème WordPress vraiment personnalisé pour votre site.

Pour modifier une section de thème, survolez-la et cliquez sur le lien Modifier le design .

Nous allons commencer par modifier l'en-tête.

En-tête et pied de page

Lorsque vous modifiez une section de thème dans SeedProd, vous accédez à son générateur visuel de glisser-déposer. Vous pouvez personnaliser l'en-tête de votre thème sur cet écran en pointant et en cliquant simplement.

Comme vous pouvez le voir, le thème de démarrage est livré avec un en-tête à 2 colonnes qui comporte un logo et un menu de navigation. Vous pouvez le personnaliser pour afficher votre logo personnalisé en cliquant sur le logo dans l'aperçu en direct.

À partir de là, vous pouvez supprimer le logo de l'espace réservé dans le panneau de gauche et en télécharger un nouveau depuis votre ordinateur ou votre médiathèque WordPress.

Vous pouvez ajuster la taille et l'alignement de votre logo dans le même panneau et ajouter un lien personnalisé, comme l'URL de votre site Web principal.

Si vous souhaitez modifier la couleur d'arrière-plan de votre en-tête, survolez la section d'en-tête jusqu'à ce qu'elle ait un contour violet, puis cliquez dessus pour afficher les paramètres de la section dans le panneau de gauche. À partir de là, vous pouvez donner à votre en-tête une couleur d'arrière-plan personnalisée, une image et choisir la largeur de l'en-tête.

Et dans l'onglet Avancé , vous pouvez personnaliser l'ombre, l'espacement, la bordure, etc. de votre en-tête.

Lorsque vous êtes satisfait de votre en-tête WordPress personnalisé, cliquez sur le bouton Enregistrer dans le coin supérieur droit et revenez au créateur de thème.

Répétez maintenant ces étapes pour modifier votre pied de page WordPress. Cliquez sur Modifier le design pour l'ouvrir dans l'éditeur visuel, puis cliquez sur n'importe quel élément pour personnaliser le contenu, les couleurs, les liens, etc.

Page d'accueil

Ensuite, nous personnaliserons la page d'accueil de votre site WordPress, qui est souvent la première page que les utilisateurs voient lorsqu'ils visitent votre site Web. Ouvrez donc la section Page d'accueil dans l'éditeur visuel.

Comme nous avons déjà personnalisé la conception de l'en-tête et du pied de page, vous verrez vos nouvelles conceptions en haut et en bas de votre page d'accueil. Mais ne vous inquiétez pas, les modifications que vous apportez sur cet écran n'affecteront pas votre en-tête ou votre pied de page ; ils sont simplement là comme guide visuel.

Le modèle de thème de démarrage de SeedProd possède toutes les fonctionnalités dont la plupart des sites Web d'entreprise ont besoin, notamment :

• Zone des héros
• Logos clients
• Caractéristiques
• Témoignages
• Foire aux questions

Tout comme l'en-tête, vous pouvez personnaliser chaque centimètre pour le rendre unique. Commençons par changer la zone des héros.

La zone des héros a les fonctionnalités suivantes :

• Section
• Mise en page à 2 colonnes
• Image
• Titre
• Texte
• Bouton

Pour changer l'image par défaut, cliquez simplement dessus et téléchargez une nouvelle image, comme vous l'avez fait avec votre logo.

Vous pouvez également modifier le titre et la description en cliquant sur chaque bloc et en remplaçant le contenu par votre texte personnalisé.

Si vous cliquez sur le bloc de boutons, vous pouvez modifier le texte du bouton, le lien, l'alignement, etc.

Vous pouvez trouver tous ces éléments dans le panneau des blocs de gauche. De cette façon, vous pouvez faire glisser un bloc depuis la gauche et le déposer sur votre conception pour ajouter plus de contenu à votre thème.

Suivez ce processus pour personnaliser le reste de votre page d'accueil jusqu'à ce qu'elle reflète votre entreprise. Par exemple, vous pouvez ajouter des informations sur les services de votre entreprise ou mettre en évidence les fonctionnalités de votre produit dans la section des fonctionnalités.

Ensuite, vous pouvez utiliser le bloc Témoignages intégré de SeedProd pour ajouter une preuve sociale positive de vos clients et clients existants.

Nous avons également modifié la couleur d'arrière-plan de cette section pour qu'elle corresponde à notre en-tête de thème en ouvrant les paramètres de la section et en choisissant une couleur différente.

Après avoir personnalisé votre page d'accueil, vous pouvez cliquer sur l'icône d'aperçu mobile pour voir à quoi ressemble votre conception sur les appareils mobiles.

Si quelque chose ne va pas, vous pouvez déplacer les éléments jusqu'à ce que l'écran de votre mobile offre une bonne expérience utilisateur.

Lorsque vous êtes satisfait de l'apparence de votre page d'accueil, cliquez sur le bouton Enregistrer et revenez au créateur de thème.

Page de blog, articles uniques et pages

Il y a de fortes chances que vous souhaitiez inclure une page personnalisée pour les articles de blog dans votre nouveau thème WordPress. La bonne nouvelle est que SeedProd a une partie thématique que vous pouvez personnaliser spécifiquement à cette fin.

Cette section s'appelle Blog Index, Archives, Search dans le générateur de thème. Il vous permet de personnaliser la page des articles de votre blog, les archives des articles et la page des résultats de recherche pour qu'ils correspondent au reste de l'image de marque de votre site Web.

Cliquez donc sur le lien Modifier la conception pour ouvrir cette partie de thème dans le générateur de glisser-déposer.

Sur cette page, le thème de démarrage utilise des balises de modèle pour extraire des informations dynamiques de WordPress, notamment le titre de l'archive et les publications. Lorsque vous cliquez sur l'un de ces blocs, vous verrez leurs paramètres dans le panneau de gauche.

Par exemple, lorsque vous cliquez sur la balise de modèle de publication, vous pouvez afficher les publications par défaut, personnalisées (publications, médias ou publications personnalisées) ou manuelles en saisissant des paramètres de requête spécifiques.

Vous pouvez également choisir le nombre de colonnes, de publications par page, afficher ou masquer l'image sélectionnée, afficher un extrait, et bien plus encore.

Après avoir personnalisé votre archive ou votre page de blog, revenez au créateur de thème et modifiez la section Single Posts .

Cette partie de thème utilise les balises de modèle suivantes pour extraire des informations sur les publications WordPress individuelles :

• Titre de l'article
• Informations sur la publication
• Publier un contenu
• Boîte Auteur
• Poster des commentaires
• Navigation dans les messages

Vous pouvez modifier chacun de ces blocs comme vous le feriez avec n'importe quel autre bloc SeedProd. Cliquez simplement sur n'importe quel élément et personnalisez-le dans le panneau des paramètres.

Par exemple, si vous cliquez sur le bloc Post Info , vous pouvez ajouter plus de méta-informations, modifier l'alignement et ajuster les couleurs des icônes.

Barre latérale

De nombreux sites Web WordPress utilisent encore des barres latérales pour afficher des informations importantes aux visiteurs, telles que leurs profils de médias sociaux, leurs derniers messages et leur boîte d'inscription à la newsletter. Mais contrairement à de nombreux thèmes WordPress prédéfinis, vous pouvez utiliser SeedProd pour créer une barre latérale WordPress personnalisée avec ses blocs de construction visuels.

Pour ce faire, cliquez sur Modifier la conception dans la partie du modèle de la barre latérale. À partir de là, vous pouvez faire glisser et déposer tout contenu que vous aimez sur la conception de votre barre latérale.

Le thème de démarrage comprend un champ de recherche, des icônes de médias sociaux et des catégories de publication par défaut. Mais vous pouvez ajouter tout ce que vous voulez ici. Par exemple, vous pouvez afficher une liste des articles de blog récents ou une image renvoyant vers un partenaire affilié.

Vous pouvez également utiliser le bloc de formulaire d'inscription de SeedProd et collecter des adresses e-mail pour développer votre liste, directement dans votre barre latérale. La meilleure chose est que vous n'aurez besoin d'aucune connaissance technique pour y arriver.

CSS global

À présent, vous avez créé la plupart de votre thème WordPress personnalisé sans code. Mais il y a une autre partie que vous devriez examiner pour vous assurer que tout est cohérent dans votre thème.

C'est votre CSS global , qui contrôle le style global, la typographie, les couleurs et la mise en page de votre thème. Cliquez donc sur Modifier le design sur cette partie de thème pour l'ouvrir dans l'éditeur de page.

Comme vous pouvez le constater, cette page vous permet de contrôler une grande partie du style de votre thème. Dans le panneau de gauche se trouvent des sections pour :

• Couleurs
• Polices
• Arrière-plan
• Boutons
• Formes
• Disposition
• CSS personnalisé

Par exemple, vous pouvez ouvrir la section Boutons et choisir une couleur personnalisée. Ensuite, cette couleur apparaîtra sur chaque bouton de votre thème.

Vous pouvez faire de même dans l'en-tête Polices et attribuer une couleur personnalisée à chaque lien de votre thème.

Alors allez-y et ajustez ces paramètres jusqu'à ce que votre thème ressemble exactement à ce que vous voulez, puis cliquez sur le bouton Enregistrer pour enregistrer vos modifications.

Étape 4. Connectez votre service de marketing par e-mail

Si l'un de vos objectifs commerciaux est de développer votre liste de diffusion, il est probable que vous ayez ajouté un formulaire d'inscription quelque part dans la conception de votre thème WordPress. Mais pour ajouter automatiquement de nouveaux contacts à votre liste, vous devrez connecter votre formulaire à votre service de marketing par e-mail.

SeedProd s'intègre directement à de nombreux services de marketing par e-mail populaires, tels que Constant Contact, Mailchimp, Drip, etc. Et c'est un jeu d'enfant de se connecter à votre compte.

Modifiez simplement n'importe quelle partie du thème et cliquez sur l'onglet Connexion en haut de l'écran.

Ensuite, cliquez sur n'importe quelle intégration dans la liste et suivez les instructions à l'écran. En conséquence, toute personne qui remplit votre formulaire d'inscription sera automatiquement ajoutée à votre liste de diffusion.

Étape 5. Activez votre thème WordPress personnalisé

La dernière étape de la création d'un thème WordPress personnalisé avec SeedProd consiste à faire vivre le thème sur votre site Web. Pour ce faire, recherchez l'en-tête Activer le thème SeedProd dans le coin supérieur droit et basculez la bascule en position "on".

Votre nouveau thème remplacera votre thème par défaut, vous permettant de voir vos personnalisations sur le front-end de votre site Web.

C'est ça! Votre nouveau thème WordPress personnalisé est en ligne sur votre site Web. Voyons à quoi ça ressemble.

Voici la page d'accueil avec vos nouveaux en-tête et pied de page :

Voici la page de blog avec votre barre latérale WordPress personnalisée :

Toutes nos félicitations!

Vous savez maintenant comment créer un thème WordPress personnalisé sans code.

Avec le générateur de thèmes WordPress simple et puissant de SeedProd, vous n'aurez besoin d'aucune expérience technique, de développeurs WordPress ou d'un budget massif pour créer un thème WordPress personnalisé.

La puissance et les fonctionnalités sont entre vos mains dès que vous installez le plugin.

Alors qu'est-ce que tu attends?

Merci d'avoir lu. Veuillez nous suivre sur YouTube, Twitter et Facebook pour plus de contenu utile pour développer votre entreprise.