Comme le dit le vieil adage, une image vaut mille mots. On pourrait dire que c’est en fait beaucoup moins, mais on ne peut nier que le web les icônes sont puissantes et intuitives, en particulier ceux des réseaux sociaux. Ce joyeux oiseau bleu en vol ? L’appareil photo carré stylisé ? Le rectangle rouge aux coins arrondis avec le symbole de jeu ? Vous savez ce qu’ils représentent sans même y penser. Les logos des réseaux sociaux sont parmi les images les plus mémorables qui soient.
L’ajout d’icônes de réseaux sociaux à votre menu WordPress est simple et ne prend pas de temps. Nous allons vous montrer comment. Mais avant de passer aux choses sérieuses, laissez-nous discuter des raisons pour lesquelles vous voulez que vos icônes de réseaux sociaux dans votre menu.
De nombreuses icônes peuvent encombrer votre interface, en particulier sur les appareils mobiles. En les mettant dans un menu, vous pouvez facilement éviter cela. Les utilisateurs sont habitués à les rechercher dans les menus, et vous pouvez rendre un menu plus élégant et intuitif en y ajoutant des icônes.
De même, vous pourriez créer un menu social spécial avec uniquement vos icônes de réseaux sociaux, et intégrez ce menu dans n’importe quelle zone prête pour les widgets pour que vos visiteurs accèdent à votre contenu de réseaux sociaux d’un simple clic et sans avoir à quitter votre site Web. Vos utilisateurs mobiles seront particulièrement reconnaissants.
Si vous utilisez notre thème Bridge polyvalent, l’ajout d’icônes sociales à votre menu d’en-tête ou de pied de page est à peu près aussi simple que possible. Nous avons même un widget dédié pour cela !
Tout ce dont vous avez vraiment besoin pour installer des icônes de réseaux sociaux dans votre en-tête ou votre pied de page est ce didacticiel vidéo pratique :
Mais si vous préférez vos tutoriels sous forme de texte, faites défiler vers le bas. Nous vous guiderons étape par étape à travers tout ce que vous devez faire. Nous allons vous montrer comment procéder pour votre menu d’en-tête, mais les zones de pied de page fonctionnent de la même manière en principe.
Les zones de widgets qui vous sont disponibles dépendent de la démo Bridge que vous utilisez. L’en-tête de la démo que nous utilisons ne contient aucune icône sociale.
Pour résoudre ce problème, vous devez accéder à Apparence/Widgets via le menu de droite sur votre tableau de bord WordPress.
Ensuite, vous devez trouver la bonne zone de widget. Nous voulons que nos icônes sociales soient à côté du menu et, dans cette démo de Bridge, la zone correspondante est En-tête en bas à droite. Pour placer une icône sociale dans n’importe quelle zone de widget, vous devez faire glisser un Icône sociale de Qode widget pour cela.
Ensuite, vous devez configurer ce widget. Nous sélectionnerons le Cercle type d’icône (vous pouvez choisir un type d’icône différent, selon le style et l’apparence de votre site Web), le Police élégante pack d’icônes (également pris en charge est Font Awesome), et le Facebook icône de la Icône élégante de police menu déroulant et entrez le Format personnalisé et Taille de forme personnalisée (10 et 13 pixels pour nous, respectivement, mais vous pouvez sélectionner le vôtre). Pour les besoins de cette démonstration, nous fournirons au widget le lien hypertexte de notre page Facebook (vous utiliserez bien entendu le vôtre) et modifierons la cible en Nouvelle fenetre. le Icône sociale de Qode widget contient également de nombreux paramètres de conception que nous n’aborderons pas pour le moment. Qu’il suffise de dire que la multitude de paramètres de taille, de couleur et de bordure rend le widget très polyvalent et adaptable à n’importe quel style.
Vous pouvez remplir la même zone avec d’autres icônes sociales, si vous le souhaitez, comme nous l’avons fait ici. L’ordre dans lequel vous triez vos icônes sociales est l’ordre (de gauche à droite) dans lequel les icônes apparaîtront dans l’en-tête. Et maintenant, votre en-tête contiendra des pistes pour vos comptes de médias sociaux.
Mais que se passe-t-il si vous souhaitez associer des icônes sociales aux éléments de votre menu ? Bridge peut le faire aussi, tout comme d’autres thèmes que vous utilisez peut-être, mais nous montrerons comment le faire avec notre thème.
Tout d’abord, vous devez naviguer vers Apparence/Menus et trouvez votre menu de navigation supérieur. Dans notre cas, son nom est Mega Menu. Ensuite, vous devez ajouter un lien vers un profil de réseau social, notre profil Twitter dans notre cas. Pour ce faire, vous devez ajouter un Lien personnalisé élément de menu à votre menu. Trouvez le Liens personnalisés élément dans le Ajouter des éléments de menu menu et collez votre URL dans le URL domaine. Pour notre Twitter, nous taperons simplement Notre Twitter dans le Texte du lien champ et cliquez sur le Ajouter au menu bouton.
L’élément est maintenant au bas de votre Structure des menus, ce qui signifie qu’il apparaîtra à l’extrême droite du menu de navigation supérieur. On s’y plait, mais vous pouvez bien entendu organiser vos menus comme bon vous semble. Développez l’élément pour le configurer. Pour Taper, vous devez sélectionner large avec des icônes, car c’est le seul type d’élément de menu qui affichera une icône dans Bridge. Nous sélectionnerons également le Police géniale pour notre Pack d’icônes, et fa-twitter pour notre Icône. Bien sûr, vous pouvez sélectionner le Police élégante pack d’icônes et l’icône que vous aimez pour votre profil social. En faisant défiler un peu plus bas, cliquez sur le Enregistrer le menu bouton.
Et maintenant, votre menu contiendra un lien avec son icône sociale. Tu peux ajoutez autant de ces liens sociaux que vous le souhaitez, et également attribuer des icônes à d’autres éléments de menu, mais cela dépasse le cadre de cette démonstration.
Notre première suggestion est toujours d’utiliser la fonctionnalité intégrée d’un thème pour tout effet que vous souhaitez obtenir. Si le thème que vous utilisez n’a pas les fonctionnalités que vous souhaitez, un plugin offre souvent une bonne solution de contournement. Le plugin que nous utiliserons est Image du menu. Après avoir installé et activé le plugin, vous serez d’abord invité à activer les notifications pour ce plugin (que nous allons Sauter), puis dirigé vers l’écran Paramètres. Ici, vous pouvez modifier la taille de vos icônes en fonction du style de votre site Web. Nous allons simplement Sauvegarder les modifications et avance.
Ensuite, accédez à Apparence/Menus et trouvez votre menu de navigation supérieur, le Mega Menu. Sélectionner Liens personnalisés du Ajouter des éléments de menu sur le côté gauche et configurez-le. Pour les besoins de cette démonstration, nous collerons l’URL de notre profil Instagram dans le URL champ, et légendez-le avec Notre Instagram dans le Texte du lien champ avant de cliquer sur le Ajouter au menu bouton, tandis que vous pouvez choisir le profil social et l’icône que vous aimez.
Cela placera un Liens personnalisés élément au bas de votre Structure des menus, ce qui signifie qu’il apparaîtra à l’extrême droite de votre menu. Vous pouvez organiser vos menus comme bon vous semble, mais nous en resterons là. Vous devez développer l’élément pour le configurer. Nous allons définir le Titre Poste à Après, ce qui signifie que l’icône apparaîtra au à gauche du Étiquette de navigation, et cliquez Définir l’image pour sélectionner une image dans votre médiathèque ou en télécharger une.
Nous avons fourni à notre médiathèque une icône Instagram gratuite. Vous pouvez télécharger n’importe quelle autre image que vous aimez pour chaque élément de menu, mais nous en resterons là, car nous voulons que notre icône sociale se démarque vraiment et soit instantanément reconnaissable. Vous pouvez également sélectionner une version différente pour une icône au survol, en cliquant sur le bouton Définir l’image au survol icône. Enfin, une fois que vous êtes satisfait de vos paramètres, vous devez cliquer sur le bouton Enregistrer le menu bouton.
Et votre lien de profil Instagram sera désormais la vedette de notre menu de navigation supérieur !
En conclusion
Comme nous l’avons montré, l’ajout d’icônes à vos éléments de menu est simple et rapide. Que vous utilisiez les options intégrées de votre thème ou un plugin, vous pouvez faire connaître votre présence sur les réseaux sociaux aux visiteurs de votre site Web en quelques clics de souris. De nos jours, pouvez-vous vous permettre de ne pas le faire ?
Soutenez notre effort ❤️
Si vous avez apprécié cet article, pensez à laisser un pourboire pour nous aider à continuer à publier du contenu de qualité.
