Ajouter des icônes au menu de navigation
Vous pouvez facilement ajouter des icônes à votre menu de navigation à l’aide du Icônes de menu plugin développé par ThemeIsle. Installez et activez simplement le plugin et vous pourrez maintenant ajouter des icônes personnalisées à vos éléments de menu.
Vous pouvez choisir parmi différentes sources de types d’icônes (#1). Si vous souhaitez utiliser vos propres images d’icônes personnalisées, vous devez activer le Image(s) option. Cela vous permettra de télécharger vos propres icônes personnalisées. Une fois que vous avez activé vos types d’icônes personnalisées, vous pouvez désormais ajouter des icônes personnalisées à vos éléments de menu (#2).
Si vous souhaitez ajouter des icônes à votre menu de navigation sans utiliser de plugins, vous pouvez le faire via le CSS personnalisé de votre thème.
Tout d’abord, vous aurez besoin d’une icône, de préférence de 25 x 25 pixels, puis téléchargez-la sur votre site Web. Nous vous recommandons de créer un nouveau dossier appelé «icônes» dans votre installation racine de WordPress et d’y télécharger toutes vos icônes personnalisées. Vous vous référerez ensuite à vos icônes via ./icons/votrenomicone.png sur votre extrait de code CSS personnalisé.
Voici un exemple de CSS personnalisé que vous pouvez ajouter à votre thème. Ceci est testé fonctionnant parfaitement sur le thème TwentyTwenty. Vous devrez peut-être les ajuster pour s’adapter parfaitement au thème que vous utilisez.
.homemenuicon a {padding-left: 30px; background-image: url (./ icons / youriconname.png); background-position: gauche; background-repeat: pas de répétition; }
Vous pouvez ajouter du CSS personnalisé à n’importe quel thème via Thèmes > Personnaliser > CSS supplémentaire. Une fois que vous avez ajouté le CSS pour vos icônes de menu, vous devez l’appliquer.
Cliquez sur thème > Menu et activer Classes CSS dans les options d’écran.
Ensuite, ajoutez votre classe personnalisée (dans notre exemple, .homemenuicon) dans le champ Classes CSS du menu.
Enregistrez le menu et voyez votre élément de menu d’accueil arborant maintenant une icône personnalisée à côté.
Vous trouverez ci-dessous à quoi ressemblera notre exemple dans le thème TwentyTwenty en utilisant une icône d’accueil personnalisée de 25 pixels sur 25 pixels.
