Des extensions WordPress pour un menu mobile

adapter la taille de votre site aux écranDe plus en plus, le thème de votre site devra s’adapter au mobile.

Parfois, le menu au format mobile n’est pas convenable. Il existe alors quelques extensions WordPress qui vous permettront de rendre le menu plus ergonomique.

Même si notre manière de penser en termes de design s’oriente davantage vers les écrans de grande taille, l’avenir se tourne vers la mobilité.
Il est donc nécessaire de penser à la mise en forme de notre site sur un écran de petite taille.
Pour cela, les thèmes gratuits ou premium sont de plus en plus « Responsive« .
Le terme anglais « Responsive » signifie que votre design s’adapte à la taille de l’écran.

Pour avoir un exemple concret, sur ce site, lorsque vous réduisez la taille de la fenêtre de votre navigateur, vous verrez le design du site (fenêtres, images, menus…) s’adapter à votre écran. L’intérêt derrière cela est de faciliter la lecture.

Dans cet article, je vous explique comment sur ce site, malgré un thème gratuit limité, j’ai rendu le menu plus facile à utiliser depuis un mobile.

 

Pourquoi s’attarder sur ces détails d’ergonomie ?

Tous ces arrangements d’ergonomie sont là pour faciliter la lecture du contenu sur un petit écran sans altérer le confort sur grand écran.
De telles prouesses techniques existent essentiellement grâce au fichier CSS de votre design.

La plupart des gens comme moi ne s’y connaissent pas suffisamment en technique, pour modifier leur thème afin qu’il réponde complètement à leurs attentes.
Si vous achetez un thème premium, vous aurez de grandes chances d’avoir quelque chose qui convient (et encore…).
Par contre, si comme moi vous n’avez pas encore investi et que vous souhaitez tout de même proposer un site convenable aux visiteurs, voici une solution.

Si vous réduisez la fenêtre, vous verrez ce menu :

 

menu responsive

 

Comment faire si on y connaît rien en technique ?

Pour obtenir ce résultat sans modifier le fichier CSS, j’ai trouvé une extension qui a parfaitement répondu au besoin. Comme toujours, les extensions viennent à notre secours.
Même si tout le monde vous dira qu’il ne faut pas abuser des extensions (sous peine de ralentir le site ou le rendre vulnérable), il n’y a parfois pas d’autre choix.

Pour ma part, j’utilise l’extension WP Responsive Menu.

Dans cette extension gratuite très facile, vous commencez par indiquer quel menu doit s’afficher en responsive (1), et quel menu il faudra cacher (2).

 

configuration wpr

 

Dans un deuxième onglet, vous pourrez modifier l’apparence du menu notamment les couleurs, la position, le titre… bref une extension simple à utiliser, gratuite, et qui fait le job !

Si cela ne vous convient pas, il existe bien sûr d’autres extensions WordPress.

Voici quelques exemples :

Si vous ne vous êtes pas encore penché sur le problème du « Responsive », je vous invite vivement à le faire.

De plus en plus d’internautes consultent nos contenus via leur téléphone et vous devriez pouvoir observer le phénomène sur votre propre site grâce à Google Analytics.

Améliorer l’ergonomie mobile diminuera forcément le taux de rebond global (temps passé sur votre site, plus il est faible, mieux c’est), car les gens resteront plus longtemps depuis leur téléphone, à lire vos contenus.

Image source CC0

À propos de Mathieu C.

Travaillant dans l'informatique de gestion, je suis passionné par le web depuis des années.
J'ai choisi de partager mes découvertes et expériences à travers ce blog.

Commentaires

  1. Bonjour,

    j’ai acheté Ubermenu récemment, mais manque de chance il est incompatible avec mon thème gratuit…et le support ne m’a pas vraiment aidé…

    Sinon, je vais essayer ce plugin sachant que j’utilise déjà une extension qui est propose un menu spécifique pour les internautes mobiles.

    Bien à vous.

    • Bonjour Christophe,

      merci pour le retour ! C’est bon à savoir qu’une extension n’est pas compatible avec un thème surtout si elle est premium !
      Par contre je trouve ça dommage de démultiplier les plugins.
      Assure toi aussi que l’ensemble du thème est déjà responsive car si seul le menu s’adapte, c’est pas terrible (mais mieux que rien).

      A bientôt,
      Mathieu.

      • Après vérification, ton thème est bien responsive-

        Le format est bien par contre tu peux peut-être voir pour l’alléger un peu (car une fois déplié, c’est difficile à lire).

        A+

  2. Bonjour,

    c’est justement pour cela que j’avais acheté Ubermenu pour rendre plus lisible le menu….je suis d’ailleurs déçu par leur support, il répond vite mais pas vraiment de solution et pour ce qui est du remboursement…j’attends toujours…..

    Je vais essayer de trouver un autre thème pour mon site qui soit compatible avec Unbermenu mais c’est dur car j’ai beaucoup d’exigences.

    J’aurais aimé acheter un thème premium mais vu que l’on ne peut pas les essayer au préalable je ne prendrai pas le risque…

    bien à vous,

    • Bonjour Christophe,

      à priori avec un thème premium, vous devriez pouvoir l’essayer avant de l’utiliser. Par contre c’est sur que vous ne pourrez pas probablement l’essayer avec vos plugins.
      Je pense que l’idéal c’est de vérifier dans le grandes lignes que le thème répond à vos attentes sur grand et petit écran mais aussi qu’il n’est pas trop lourd (contenant beaucoup de fonctions que vous n’utiliserez pas). Enfin vérifiez la qualité du support car c’est normalement le gros avantage d’avoir des outils payants.
      Si vous trouvez un éditeur français, cela sera un avantage de plus.

      En tout cas merci pour le retour, cela ne fait pas de publicité à Ubermenu mais c’est bon à savoir (et la porte est ouverte à une éventuelle défense du concepteur !).

      A bientôt,
      Mathieu.

  3. Merci beaucoup pour ce magnifique blog que je trouve d’ailleurs très intéressant avec une belle interface, facile en navigation. Il est vraiment super ! Bravo et bon courage .

  4. Un grand merci je cherchais cela depuis longtemps et je trouve enfin une réponse !

Exprimez-vous !

*