Je me demande souvent ce qui rend un visiteur comme un site? Est-ce juste le contenu? Est-ce le design? Ou est-ce les deux? J’y réfléchis depuis un bon bout de temps maintenant, et je suis en quelque sorte arrivé à une conclusion. L’un des éléments clés de tout bien le site Web est la clarté. Un site Web propre et bien catégorisé avec un bon contenu (y compris du texte, des images, de l’audio et / ou de la vidéo) n’est rien de moins que brillant.

Les gens consacrent beaucoup de temps et d’efforts à améliorer leurs plans de site XML, leur référencement et leur marketing sur les réseaux sociaux. C’est formidable de permettre à votre utilisateur de trouver votre site sur Google / Twitter. Que se passe-t-il lorsqu’une personne atterrit réellement sur votre site? Aimera-t-il ce qu’il voit? Va-t-il ajouter ce site à ses favoris? Qu’est-ce qui déclencherait ses nerfs heureux et appuyez sur le bouton J’aime / Suivre?

Entrez l’expérience utilisateur. Un bon nombre de personnes n’y prêtent guère attention. Heureusement, Tom a récemment expliqué comment améliorer l’expérience utilisateur de votre site Web. Il décompose UX (abréviation de l’expérience utilisateur) en trois composants: conception, convivialité et contenu. En bref, j’aime l’appeler clarté.

Dans l’article d’aujourd’hui, je vais passer en revue un plugin d’amélioration de menu WordPress très populaire appelé UberMenu. Ne coûtant que 16 USD, ce plugin a franchi plus de 17000 ventes sur CodeCanyon. Votre cerveau a déjà fait le calcul – plus de 272 000 USD – à partir d’un seul plugin. Maintenant que j’ai votre attention, commençons. 😉

Installation

L’installation d’UberMenu est un jeu d’enfant. Il y a deux façons de l’installer, l’une est où vous extrayez l’archive et téléchargez les 261 fichiers et 39 dossiers dans votre dossier de plugins sous wp_content via FTP ou vous l’installez simplement à partir du tableau de bord WordPress sous Plugins> Ajouter nouveau> Télécharger en téléchargeant directement le fichier zip.

Une fois que vous avez activé le plugin, un joli tutoriel apparaît qui vous guide à travers la configuration de base du plugin. Je vous recommande de suivre ce guide car il vous donnera une vue d’ensemble de ce qui vous attend – et vous ne serez pas déçu.

Premiers pas avec les bases

Le développeur du plugin, Chris Mavricos, n’a pas négligé la documentation de son plugin. La documentation comprend également des didacticiels vidéo. Je me suis honoré de lire la documentation pendant 2 minutes, ce qui m’a donné une compréhension de base du plugin. La fonction MegaMenu est extrêmement utile lorsqu’il s’agit de classer votre contenu jusqu’au dernier bit. Si vous êtes un type frénétique de fabricant d’étiquettes (comme le Dr Sheldon Cooper), vous allez adorer ça.

MegaMenu

MegaMenu est une version avancée du menu WordPress par défaut avec des options hautement personnalisables. La mise en page CSS par défaut de MegaMenu prend en charge 3 niveaux de hiérarchie de base. Heureusement, vous avez la possibilité d’exécuter votre CSS personnalisé qui vous permet pratiquement de changer tous les aspects de la mise en page MegaMenu.

Pour ceux qui ne comprennent pas le système de menus WordPress, j’ai préparé le guide suivant pour vous:

Menus WordPress: un guide rapide

Supposons que vous ayez un blog où vous parlez de vos émissions de télévision, de votre musique, de vos livres et de vos films préférés. Apprenons à créer un menu dans lequel vous pouvez indexer correctement le contenu de votre site. Pour commencer, vous devez créer un menu (Apparence> Menus) et l’assigner à l’emplacement pris en charge par le thème. Pour ce didacticiel, nous utilisons le thème WordPress Twenty Eleven qui prend en charge 1 menu principal. Maintenant que vous avez créé le menu, il est temps de le créer. Nous créons une entrée principale appelée «TV». Cela en fait le niveau 1, en haut de la liste hiérarchique. Ensuite, nous divisons les émissions de télévision en fonction de leur genre – disons Reality, Drama et Sitcoms. Ces trois genres sont au niveau 2, c’est-à-dire au deuxième niveau de la liste hiérarchique. Enfin sous chaque genre, nous entrons dans la série télévisée en conséquence. Maintenant, chaque émission de télévision est celle du 3ème niveau. Nous obtenons quelque chose comme ceci:

Comprendre les menus WordPress Voici à quoi cela ressemblerait dans la disposition du menu WordPress par défaut:

Sans menu Uber

Et voici à quoi ça ressemble avec MegaMenu:

MegaMenu-1

Catégorisation propre, simple et sans encombrement.

MegaMenu avec images et description

Ajout d’images et de description à chaque entrée de menu comme la cerise sur le gâteau. UberMenu vous permet d’attribuer une image et une description à presque tous les éléments du menu, ainsi que de supprimer le texte visible (au cas où vous ne voudriez que les images) ou de mettre en évidence des entrées de menu individuelles. Tout cela grâce à cette liste de contrôle impressionnante disponible sous chaque élément de menu.

Options de menu

Cependant, les images du menu ne seront pas automatiquement redimensionnées si vous n’avez pas activé Timthumb, vous devez donc télécharger / attribuer des images de la taille exacte que vous souhaitez afficher. Dans mon exemple, j’ai utilisé des images de 300 × 300 pixels.

Cependant, si vous activez Timthumb, toutes les images que vous téléchargez seront redimensionnées dans les dimensions auxquelles vous attribuez les paramètres.

MegaMenu avec images

Voici à quoi ressemble un élément de menu avec des descriptions:

Descriptions du MegaMenu

Widgets dans les menus

C’est cette fonctionnalité ultime qui fait d’UberMenu le roi de tous les plugins de menu. Le concept est assez simple mais tout à fait brillant. Vous définissez le nombre d’emplacements de widget que vous voulez (qui peut être autant que vous le souhaitez) dans les paramètres UberMenu, puis placez les widgets en conséquence à partir de la page Widgets.

Widgets

Pour placer le widget dans le menu, développez simplement l’élément de menu et sélectionnez le widget que vous souhaitez attribuer. Assurez-vous de cocher les cases Désactiver le texte et Désactiver les liens.

Voici un exemple des merveilles que les widgets (dans les menus) peuvent faire:

Widgets dans le menu

Personnalisation puissante

UberMenu propose de nombreuses options de personnalisation CSS3 puissantes sous le générateur de styles que vous pouvez utiliser pour donner à votre menu un aspect et une sensation uniques. Il prend également en charge un CSS entièrement personnalisé et des ajustements personnalisés partiels.

Options CSS

Il est également livré avec de nombreux modèles de style bien conçus que vous pouvez utiliser dans votre menu.

Préréglages de style

Une autre caractéristique remarquable est l’assistant de personnalisation qui est très utile lorsque vous souhaitez voir les options de personnalisation possibles pour le menu.

Divers

Intégration du thème

La plupart des thèmes fonctionnent avec UberMenu, mais si vous utilisez un thème qui utilise un cadre de base tel que le cadre de thèmes Genesis ou Headway, l’intégration du thème peut être un peu délicate. Heureusement, Chris a merveilleusement documenté cette partie, vous donnant le savoir-faire exact requis pour intégrer UberMenu dans votre thème personnalisé.

Panneau de configuration

Le panneau de contrôle du plugin est assez simple à utiliser. Cela fonctionne sur un système strictement binaire – activer ou désactiver une fonctionnalité. À mon avis, c’est l’un des meilleurs moyens de représenter les options disponibles.

Vitesse du site

L’un des facteurs les plus importants du référencement et du classement des moteurs de recherche, la vitesse du site est d’une importance capitale. UberMenu a un impact négligeable sur le temps de chargement du site. J’ai utilisé Pingdom pour effectuer un test de temps de chargement de la page avant et après l’installation du plugin. UberMenu a augmenté le temps de chargement de seulement 0,25 seconde. Vous remarquerez peut-être que la taille de la page a beaucoup augmenté, mais c’est parce que j’ai utilisé 3 images dans le menu “Top Picks”.

Avant l'installation du plugin

Avant l’installation du plugin

Après l'installation du plugin

Après l’installation du plugin

Conception réactive

UberMenu a des règles logiques individuelles pour iPhone, iPad et le navigateur Android. J’ai essayé de redimensionner mon navigateur pour voir comment le menu répond. Ça a marché comme sur des roulettes. Dès que mon navigateur a franchi une certaine largeur, le menu a changé pour une mise en page différente et réactive.

Compatibilité du navigateur

UberMenu est entièrement compatible avec les navigateurs modernes populaires tels que Chrome, Firefox, Safari, IE 9 et IE 10.

Soutien

Une autre raison pour laquelle ce plugin est si populaire. UberMenu propose un large éventail d’options d’assistance. Il comprend une base de connaissances bien conçue, un forum d’assistance, un Chaîne Youtube plein de tutoriels et un guide de dépannage. Tous ces éléments sont bien entretenus et largement documentés.

Dernières pensées

UberMenu est facilement le meilleur plugin de menu WordPress avec une pléthore d’options de personnalisation. Cependant, il ne doit pas être utilisé par le débutant absolu car il nécessite une solide compréhension des menus et widgets WordPress. C’est plus une situation de rêve devenue réalité pour les développeurs WordPress avancés, grâce à ses puissantes options de personnalisation CSS.

Je conseillerais à tout le monde de lire attentivement la documentation complète afin d’avoir une compréhension claire des fonctionnalités du plugin. Pour seulement 16 USD, c’est une super affaire!
Obtenez UberMenu maintenant
Avez-vous déjà utilisé UberMenu? Faites-nous part de vos opinions!

Share: