En 2012, WordPress 3.4 a introduit une fonction permettant aux développeurs de vérifier si un visiteur utilisait un appareil mobile. Cette fonction, appelée wp_is_mobile(), a été conçue à une époque où la plupart des téléphones mobiles étaient peu performants et où la taille des écrans était encore réduite par rapport aux standards actuels.
Mais maintenant que l'utilisation mobile a dépassé la navigation sur ordinateur et que les smartphones rivalisent avec les ordinateurs portables en termes de puissance, une question légitime se pose : la fonction wp_is_mobile() est-elle toujours utile ou est-elle devenue obsolète ?
Explorons ensemble le fonctionnement de cette fonction, quand l'utiliser, ses limites et si elle doit encore faire partie de votre de développement WordPress .
Qu'est-ce que wp_is_mobile() et à quoi sert-il ?
La fonction wp_is_mobile() est une fonction intégrée de WordPress qui renvoie la valeur « vrai » si le visiteur utilise un appareil mobile. Elle vérifie la chaîne d'agent utilisateur envoyée par le navigateur du visiteur pour déterminer si la requête provient d'un smartphone ou d'une tablette.
Cette fonction ne fait pas de distinction entre téléphones et tablettes, et n'analyse ni la taille ni l'orientation de l'écran. Elle se base plutôt sur la présence de mots clés dans l'agent utilisateur pour prendre sa décision. Si la chaîne du navigateur contient des indicateurs d'un appareil mobile, la fonction renvoie « vrai » ; sinon, elle renvoie « faux ».
Besoin d'aide d'experts pour optimiser votre site WordPress pour les appareils mobiles ?
Notre équipe conçoit des solutions WordPress sur mesure qui s'adaptent parfaitement aux appareils des utilisateurs, améliorent les performances et évoluent en fonction de vos objectifs commerciaux.
Pourquoi a-t-il été introduit ?
Lorsque WordPress a introduit cette fonctionnalité, le responsive web design commençait tout juste à se développer. Les développeurs créaient souvent des versions mobiles distinctes des sites web et s'efforçaient de réduire la consommation de données pour les utilisateurs mobiles. Les limitations de bande passante et les performances moindres des appareils faisaient de l'optimisation une priorité absolue.
L'idée était simple : permettre aux développeurs d'afficher ou de masquer du contenu de manière conditionnelle selon que le visiteur utilisait un appareil mobile ou non.
Comment fonctionne wp_is_mobile() ?
Voici un exemple simple d'utilisation de cette fonction dans un fichier de modèle PHP :
<?php if ( wp_is_mobile() ) { ?><p>Ce contenu est destiné aux appareils mobiles.</p><?php } else { ?><p> Ce contenu est destiné aux utilisateurs d'ordinateurs de bureau.</p><?php } ?>
Ce fragment de code génère un contenu HTML différent selon l'appareil du visiteur. Il est utile pour afficher une mise en page allégée sur mobile ou des instructions alternatives.
wp_is_mobile() vs Responsive Design
La principale limitation de wp_is_mobile() est qu'elle fonctionne côté serveur, bien avant de CSS ou de JavaScript. Elle ne peut pas détecter la largeur ni la résolution de l'écran. Elle repose entièrement sur la détection de chaînes de caractères dans l'agent utilisateur.
En revanche, les requêtes média CSS et les techniques modernes de conception responsive permettent de s'adapter aux dimensions et à l'orientation réelles de l'écran. Elles ajustent la mise en page du contenu en fonction de l'espace disponible, quel que soit l'appareil utilisé.
Si votre objectif est la flexibilité de la mise en page, wp_is_mobile() n'est pas l'outil idéal. En revanche, si vous devez afficher un contenu alternatif avant le chargement de la page, notamment en fonction du type d'appareil, cette fonction reste utile.
Quand utiliser wp_is_mobile()
Malgré son ancienneté, la fonction wp_is_mobile() reste utile dans plusieurs cas d'utilisation :
- Chargement de fichiers image plus petits pour les appareils mobiles
- Affichage d'instructions ou de contenu d'aide spécifiques aux appareils mobiles
- Rediriger les utilisateurs mobiles vers les pages de téléchargement de l'application
- Afficher des en-têtes ou des menus alternatifs pour les visiteurs mobiles
- Création de codes courts qui activent ou désactivent la visibilité du contenu en fonction du type d'appareil
Il est particulièrement utile lorsqu'il est associé à des fonctions personnalisées ou à des codes courts qui offrent aux rédacteurs de contenu un meilleur contrôle au sein de l'éditeur de blocs WordPress.
Création de codes courts avec wp_is_mobile()
Pour permettre aux rédacteurs d'afficher facilement du contenu réservé aux mobiles ou aux ordinateurs de bureau dans les articles ou les pages, vous pouvez utiliser ce code dans votre fichier functions.php :
add_shortcode('desktop', 'show_desktop_content'); function show_desktop_content($atts, $content = null){ if ( !wp_is_mobile() ) return do_shortcode( $content ); } add_shortcode('mobile', 'show_mobile_content'); function show_mobile_content($atts, $content = null){ if ( wp_is_mobile() ) return do_shortcode( $content ); }
Vous pouvez désormais utiliser [mobile]tap[/mobile] et [desktop]click[/desktop] pour adapter la langue en fonction de l'interaction avec l'appareil.
wp_is_mobile() et la mise en cache de WordPress
L'un des principaux défis liés à l'utilisation de wp_is_mobile() est la mise en cache. Étant donné que cette fonction s'exécute sur le serveur, des problèmes peuvent survenir si la mise en cache n'est pas correctement configurée.
Si une version en cache d'une page est créée pour un utilisateur mobile, tous les futurs visiteurs — y compris les utilisateurs d'ordinateurs de bureau — pourront voir la version mobile, à moins que votre solution de mise en cache ne sépare le contenu par type d'appareil.
C’est pourquoi certains hébergeurs WordPress gérés proposent des options de mise en cache mobile distinctes, afin que le contenu soit correctement diffusé à chaque type de visiteur.
Limitations de wp_is_mobile()
Bien qu'utile dans certains contextes, la fonction wp_is_mobile() présente certaines limitations :
- Impossible de détecter la taille ou l'orientation de l'écran
- Traite les tablettes et les téléphones de la même manière
- Peut entraîner une identification erronée des appareils si les chaînes d'agent utilisateur sont falsifiées
- Ne tient pas compte des appareils modernes dotés de résolutions de type ordinateur de bureau
Les développeurs travaillant sur des mises en page réactives avancées peuvent préférer s'appuyer sur les requêtes média CSS ou la détection des appareils basée sur JavaScript pour plus de précision.
Alternatives à wp_is_mobile()
Voici quelques alternatives et améliorations modernes :
- média CSS pour les ajustements de mise en page
- Des bibliothèques JavaScript comme Modernizr pour la détection de fonctionnalités
- Balisage d'image réactif utilisant l'élément picture
- Blocs conditionnels ou plugins qui gèrent la visibilité des blocs en fonction de la taille de l'écran
Pour une plus grande flexibilité du contenu dans l'éditeur de blocs, beaucoup utilisent des plugins de visibilité des blocs qui offrent des règles d'affichage basées sur l'appareil sans toucher au code PHP.
Réflexions finales
La fonction wp_is_mobile() est loin d'être inutile. Elle offre un moyen simple de détecter les visiteurs mobiles et de leur proposer un contenu ou une expérience adaptés côté serveur. Bien qu'elle n'offre pas la finesse des de conception adaptative , elle reste utile dans les situations où la détection précoce de l'appareil est précieuse.
Toutefois, il est préférable de l'utiliser en complément d'autres méthodes. Se fier uniquement à cette fonction peut ne pas offrir l'expérience la plus précise ni la plus conviviale, notamment avec la diversité des appareils actuels.