Comment créer une barre latérale WordPress personnalisée sans code

Voulez-vous apprendre à créer une barre latérale WordPress personnalisée sans code ?

Une barre latérale bien conçue améliore l'expérience utilisateur et permet une meilleure navigation pour eux. Mais personnaliser votre barre latérale à l'aide des paramètres WordPress par défaut n'est pas toujours très simple. Et le codage est encore plus difficile.

Dans cet article, nous allons vous montrer comment ajouter une barre latérale dans WordPress en quelques étapes simples.

Pourquoi devriez-vous ajouter une barre latérale WordPress personnalisée

Les barres latérales offrent un moyen simple mais efficace d'afficher des informations importantes que vous souhaitez que les visiteurs voient. Dans de nombreux sites WordPress, il est courant de dédier des barres latérales pour fournir des liens rapides vers des publications connexes, des pages de médias sociaux et des formulaires optin.

Cela vous aide à garantir la meilleure expérience utilisateur pour vos utilisateurs et vous permet de rediriger les visiteurs vers les zones de votre site que vous aimeriez qu'ils voient. En conséquence, les barres latérales vous permettent d'augmenter les pages vues, le temps de séjour, l'engagement et les conversions.

Même si de nombreux thèmes WordPress sont livrés avec des barres latérales prêtes à l'emploi, ils ne fournissent pas le type de personnalisation visuelle facile que vous obtenez avec certains plugins WordPress.

SeedProd est le meilleur plugin WordPress pour créer des barres latérales avec une fonctionnalité simple de glisser-déposer. Par conséquent, nous utiliserons SeedProd pour vous montrer comment ajouter une barre latérale dans WordPress sans aucun code.

Comment créer une barre latérale WordPress personnalisée sans code

Pour savoir comment ajouter une barre latérale dans WordPress, suivez simplement les étapes ci-dessous :

1. Installation de SeedProd
2. Choisir un modèle de thème
3. Personnalisation de votre barre latérale WordPress
   • Ajouter un formulaire de contact dans la barre latérale
   • Ajout de messages récents dans la barre latérale WordPress
   • Suppression d'éléments de la barre latérale
4. Enregistrement des modifications et publication de la barre latérale

Commençons.

1. Installation de SeedProd

Pour commencer, vous devez avoir SeedProd installé sur votre site. Si vous ne savez pas comment l'installer, consultez ce tutoriel sur l'installation d'un plugin WordPress.

Pour accéder à la fonctionnalité de création de thèmes WordPress de SeedProd (dont vous aurez besoin pour créer une barre latérale), vous devrez acheter la licence SeedProd Pro. Lorsque vous avez effectué votre achat et créé un compte avec SeedProd, connectez-vous à votre espace de compte et accédez à l'onglet Téléchargements . Ici, vous trouverez votre clé de licence. Copiez-le (nous en aurons besoin plus tard).

Depuis votre tableau de bord WordPress, accédez à SeedProd » Paramètres. Sur cet écran, vous devriez voir votre champ Clé de licence . Collez la clé de licence ici et cliquez sur le bouton Vérifier .

Maintenant que SeedProd est configuré sur votre site, utilisons quelques modèles pour faciliter la tâche de création de notre barre latérale.

2. Choisir un modèle de thème

Depuis votre espace d'administration WordPress, cliquez sur SeedProd » Theme Builder.

Il s'agit du tableau de bord principal où vous pouvez contrôler les paramètres de tous vos différents éléments de thème, y compris la barre latérale.

Maintenant, cliquez sur le bouton orange Thèmes .

SeedProd propose différents thèmes pour différents types d'entreprises et d'organisations, notamment les agences de marketing, les restaurants, les courtiers en prêts hypothécaires, etc. Vous pouvez choisir un thème qui convient le mieux à votre entreprise, puis personnaliser la barre latérale jusqu'à ce qu'elle ressemble exactement à ce que vous souhaitez.

Pour cet exemple, nous allons utiliser le thème Starter, qui fonctionne très bien pour les sites Web simples. Lorsque vous sélectionnez le thème, votre zone de création de thème se remplira désormais automatiquement avec toutes les parties essentielles qui composent le thème.

Vous pouvez activer et désactiver chaque partie différente en fonction de vos besoins. Étant donné que nous n'utiliserons qu'une barre latérale pour la page de blog dans notre exemple, nous ne garderons que la barre latérale et l' index du blog, les archives, la recherche, les parties activées.

À l'aide des boutons bascule sous l'en-tête Publié , nous avons désactivé d'autres parties du thème et laissé la barre latérale à l'état OUI .

Nous sommes maintenant prêts à commencer à personnaliser la barre latérale.

3. Personnalisation de votre barre latérale WordPress

Pour commencer à personnaliser votre barre latérale WordPress, passez votre curseur sur l'option Barre latérale dans le tableau de bord du générateur de thème SeedProd et cliquez sur Modifier la conception.

Cela ouvrira l'interface du générateur de thème. La barre latérale du thème Starter comporte une barre de recherche, des catégories et des icônes de réseaux sociaux activées par défaut.

Mais vous pouvez ajouter plus d'éléments à la barre latérale ou remplacer ceux existants par autre chose. Dans le volet de gauche, vous trouverez des tonnes de blocs que vous pouvez faire glisser et déposer sur la zone de droite, qui est un aperçu en direct de votre barre latérale.

Ci-dessous, nous vous montrerons comment effectuer certaines personnalisations courantes de la barre latérale, mais ce sont toutes des étapes facultatives.

Ajouter un formulaire de contact dans la barre latérale

Dans cet exemple, nous allons vous montrer comment ajouter un simple formulaire de contact à votre barre latérale. Mais d'abord, assurez-vous que WPForms est installé. Si vous avez besoin d'aide, consultez ce document sur l'installation de WPForms.

WPForms s'intègre automatiquement à SeedProd. Ainsi, tous les formulaires que vous avez créés avec WPForms peuvent être ajoutés en tant que bloc dans votre barre latérale à l'aide de SeedProd.

Pour ce faire, tapez simplement "formulaire de contact" dans la barre de recherche sous l'onglet Blocs . Ensuite, faites glisser et déposez le bloc Formulaire de contact à l'endroit où vous souhaitez le placer sur votre barre latérale.

Après avoir placé le formulaire dans la barre latérale, cliquez sur le bloc WPForms pour ouvrir les options du formulaire. À partir de là, vous pouvez ajouter un formulaire déjà créé ou même en créer un nouveau en appuyant sur le bouton + Nouveau formulaire .

Nous allons utiliser un formulaire que nous avons déjà créé avec WPForms en cliquant sur le menu déroulant Sélectionner un formulaire et en en choisissant un dans la liste.

Voici à quoi ressemble le formulaire.

Si vous avez besoin de modifier le formulaire, cliquez sur Modifier le formulaire sélectionné. Cela ouvrira le générateur WPForms dans la même fenêtre et vous pourrez apporter les modifications souhaitées sans avoir à quitter l'écran du générateur de thème.

En dehors de cela, vous pouvez personnaliser la conception du formulaire en accédant à l'onglet Avancé . Ici, SeedProd fournit des options pour modifier le style, les attributs, l'espacement et la visibilité de l'appareil du formulaire.

Par exemple, si vous souhaitez masquer la barre latérale lorsque votre site est affiché sur les mobiles, cliquez simplement sur le menu Visibilité de l'appareil , puis activez le bouton Masquer sur mobile .

Ensuite, nous allons vous montrer comment ajouter des messages récents dans la barre latérale de votre blog.

Ajout de messages récents dans la barre latérale WordPress

Encore une fois, utilisez le champ de recherche sous l'onglet Blocs du créateur de thème et tapez "messages récents". Maintenant, faites glisser et déposez le bloc Articles récents dans la zone que vous souhaitez afficher.

Le widget Articles récents se remplit automatiquement lorsque de nouveaux articles de blog sont publiés sur votre site Web.

Si vous cliquez sur le widget lorsqu'il est placé sur le côté droit du générateur, vous pouvez accéder à des paramètres tels que le contrôle du nombre de publications que vous souhaitez afficher.

Il n'y a que 3 messages sur notre exemple de site de test. Mais c'est une bonne règle d'or d'inclure 5 messages récents à afficher sur votre barre latérale.

Suppression d'éléments de la barre latérale

Avec le générateur de thèmes SeedProd, supprimer des éléments de la barre latérale est aussi simple que d'ajouter de nouveaux éléments.

Dans notre exemple, nous allons supprimer le bloc Barre de recherche de la barre latérale. Il vous appartient entièrement de décider quelles parties vous souhaitez supprimer de votre barre latérale. Nous supprimons uniquement la barre de recherche à des fins de démonstration.

Normalement, il est recommandé de garder votre barre latérale simple et ciblée, alors essayez de ne pas inclure trop de widgets dans votre barre latérale.

Pour supprimer un bloc, passez votre souris jusqu'à ce qu'un contour orange apparaisse autour du bloc que vous souhaitez supprimer et appuyez sur l'icône de la corbeille.

Vous verrez alors une invite pour confirmer l'action de suppression. Appuyez sur Oui, supprimez-le ! bouton pour continuer.

C'est tout ce qu'il faut pour supprimer n'importe quel bloc ou élément de votre barre latérale.

4. Enregistrement des modifications et publication de la barre latérale

Lorsque vous avez terminé de personnaliser la barre latérale à votre guise, cliquez sur le bouton Enregistrer en haut à droite.

Maintenant, cliquez sur le bouton croix pour quitter le générateur de thème.

Cette action ajoutera la barre latérale à votre page de blog. Ouvrez la page de blog de votre site depuis l'interface pour voir votre barre latérale WordPress nouvellement créée. (Dans cet exemple, seules les icônes des médias sociaux et le formulaire de contact sont activés).

Et c'est tout! Vous savez maintenant comment ajouter une barre latérale dans WordPress et la personnaliser pour qu'elle ressemble à ce que vous aimez.

Ensuite, configurez un sous-domaine de messagerie

Souhaitez-vous maintenir la réputation de votre messagerie et maintenir des taux de délivrabilité élevés ? Vous devriez envisager de configurer un sous-domaine de messagerie dans ce cas. Consultez notre guide sur les sous-domaines de messagerie pour savoir comment mieux gérer votre réputation de messagerie et configurer un sous-domaine de messagerie.

Vous voudrez peut-être également en savoir plus sur la délivrabilité des e-mails et son importance. Vous pouvez consulter notre article sur l'amélioration de la délivrabilité des e-mails pour plus de détails.

​​Prêt à réparer vos e-mails ? Commencez dès aujourd'hui avec le meilleur plugin WordPress SMTP. WP Mail SMTP Elite comprend une configuration complète de White Glove et offre une garantie de remboursement de 14 jours.

Si cet article vous a aidé, veuillez nous suivre sur Facebook et Twitter pour plus de conseils et de tutoriels WordPress.