Atelier Wordpress


Trucs et astuces de votre CMS préféré

Catégories


Atelier Wordpress

/ 0

Astuces

Ajouter des icônes de réseaux sociaux à un menu WordPress

26 juin 2015

Vous souhaitez ajouter des icônes de vos réseaux sociaux à votre menu WordPress ? Alors cet article est fait pour vous. L’avantage de cette démarche est la flexibilité en terme d’ordre de ces icônes : vous pouvez les placer à peu près partout sur votre barre latérale comme sur un autre emplacement de votre menu.

Ajouter vos icônes dans votre menu avec un plugin

Vous devez tout d’abord installer et activer le plugin Menu Social Icons sur votre site WordPress et vous rendre dans Apparence > Menu pour commencer à utiliser ce plugin.

La première étape est de créer un nouveau menu.

Création d'un nouveau menu de navigation dans WordPress

Cliquez ensuite sur « Custom Links » sur la barre latérale gauche et personnalisez chaque icône de réseau social en entrant du texte, le lien correspondant… Il vous suffit ensuite d’ajouter chaque bouton au menu.

Ajout d'icônes de médias sociaux pour un menu WordPress

Vous devez ensuite choisir un emplacement du menu pour vos icônes de réseaux sociaux. En fonction du thème, plusieurs endroits de votre menu vous seront proposés.

Ajouter vos icônes dans la barre latérale

Vous pouvez afficher vos icônes de réseaux sociaux dans la barre latérale de votre site où se trouvent les widgets. Pour cela, rendez-vous dans Apparence > Widgets et faites glisser le widget « Custom Menu » dans la zone que vous souhaitez.

Ajout d'icônes de médias sociaux à WordPress sidebar

Dans les paramètres du widget, sélectionnez le menu que vous venez de créer et cliquez sur « Save ». Certains thèmes proposent des zones de widgets un peu partout sur le site : pied de page, en-tête… qui peuvent ainsi contenir vos icônes de réseaux sociaux.

Utilisation de FontAwesome au sein du plugin

Le plugin Menu Social Media utilise la bibliothèque d’icônes populaires FontAwesome. Alors que le plugin est livré avec l’ensemble des icônes de cette bibliothèque, il affiche seulement ceux des réseaux sociaux dans WordPress.

Si vous souhaitez utiliser d’autres icônes de FontAwesome, il vous faudra le faire avec du code. Pour cela, rendez vous sur FontAwesome, sélectionnez l’icône que vous souhaitez voir apparaître dans WordPress et ajouter ce code dans le fichier functions.php de votre thème ou plugin (exemple avec l’icône de flux RSS).

add_filter( 'storm_social_icons_networks', 'storm_social_icons_networks');
function storm_social_icons_networks( $networks ) {

    $extra_icons = array (
        '/feed' => array(                  // Enable this icon for any URL containing this text
            'name' => 'RSS',               // Default menu item label
            'class' => 'rss',              // Custom class
            'icon' => 'icon-rss',          // FontAwesome class
            'icon-sign' => 'icon-rss-sign' // May not be available. Check FontAwesome.
        ),
    );

    $extra_icons = array_merge( $networks, $extra_icons );
    return $extra_icons;

}
Pour ajouter d’autres icônes, remplacez simplement le nom « RSS » par le nom de l’icône en question.

Ajouter vos icônes personnels dans le menu WordPress

Pour ce faire, vous devez tout d’abord ajouter le plugin Menu Image à votre site WordPress. Rendez-vous ensuite dans Apparence > Menu où vous pouvez téléchargez vos propres icônes dans chaque rubrique du menu.

Télécharge icônes de médias sociaux personnalisés aux menus WordPress

Sources :

Pour des explications plus détaillées sur les différentes méthodes pour ajouter vos icônes de réseaux sociaux à votre site WordPress, rendez-vous vite sur l’article source de WPbeginner et lancez-vous !

Logo vector designed by Freepik

Commentaires

Il n'y a aucun commentaire.

*