Pages pour mobiles

Le plugin « Pages pour mobiles » est très proche de « cimobile » : comme lui, il détecte les téléphones mobiles. Par contre, il les aiguille vers des pages de squelettes correspondantes quand elles existent (et non pas vers un jeu de squelettes correspondant comme « cimobile »).

Le but de ce plugin est de détecter le type de périphérique utilisé pour naviguer, puis de le rediriger (aiguiller) vers la page la plus adaptée si elle existe.

À l’instar de son modèle, ce plugin ne fournit aucun squelette ! Il ne sert qu’à détecter un mobile et à l’aiguiller vers la meilleure page possible.

Ce sera donc à vous de concevoir les pages adaptées en fonction de vos besoins.

Compatibilité et installation

Pages pour mobiles est compatible avec SPIP 3 et plus récent. Donc pour l’installer, le plus simple est de passer par l’interface de récupération et d’installation automatisée de SPIP 3.

Il est bien sûr toujours possible d’installer le plugin à la main en suivant cette procédure : Installer un plugin et en utilisant la dernière version du paquet référencée sur http://plugins.spip.net/pages_mobil....

Comme Pages pour mobiles inclus une partie de ce qui a été programmé pour cimobile, il est publié sous la même licence : Creative Commons BY-NC-SA.

Détection du type de périphérique de navigation

Pages pour mobiles reprend quasiment à l’identique la procédure de détection du mobile (type de périphérique de navigation) du plugin cimobile.

Cette détection se fait à chaque hit sur une page et en plusieurs étapes afin de limiter la charge du serveur :

  1. vérification de l’URL (le paramètre &pages_mobiles=nom_type_ou_groupe_mobile peut être passé dans l’URL)
  2. vérification du cookie (nommé pages_mobiles aussi)
  3. vérification rapide du user agent pour Firefox et Internet Explorer
  4. vérification étendue du user agent.

La vérification étant faite à chaque hit, Pages pour mobiles dépose un cookie dès la première détection, pour ne pas avoir à refaire une vérification exhaustive à chaque fois. Voir aussi la doc technique de cimobile : pdf/description_du_plugin_cimobile_110726.pdf

Redirection vers la meilleure page du squelette

Le plugin se différencie de cimobile sur la philosophie de la redirection : cimobile permet de rediriger vers un jeu de squelettes complet.

Alors que Pages pour mobiles ne redirige que vers la meilleure page et uniquement si elle existe. Cela évite d’avoir à développer un jeu de squelettes complet pour mobile et de ne pouvoir se concentrer que sur certaines pages.

Prenons un exemple concret : pour votre site vous avez développé un squelette de la page des articles spécifiquement pour les téléphones mobiles. Pour que Pages pour mobiles puisse en tenir compte et aiguille correctement le visiteur en fonction du type d’appareil qu’il utilise, il faut nommer ce squelette spécifique article.html (comme la page article normale), et le placer dans un sous-répertoire du dossier squelettes nommé mobile.

Ainsi, quand le visiteur de votre site cherche à voir un article, Pages pour mobiles détermine avec quel type d’appareil il navigue.

  • Si c’est un navigateur normal (d’ordinateur) il l’aiguille vers la page article.html normale qui est à la racine du répertoire de vos squelettes.
  • Si il navigue avec un mobile, Pages pour mobiles l’aiguille vers la page article.html placée dans le sous-répertoire mobile si elle existe (sinon il renvoie la page article.html normale placée à la racine du répertoire des squelettes).

Là où ça devient plus subtil, c’est que vous pouvez aussi vouloir une page article spécifique pour un appareil mobile particulier. Par exemple un ipad. Il vous suffit alors de placer ce squelette spécifique des ipad dans le sous-répertoire de votre squelette nommé ipad.

Votre dossier squelettes va alors contenir au moins :

  • ipad/
    • article.html
  • mobile/
    • article.html
  • article.html
  • autres fichiers à la racine

Le résultat sera le suivant :

  • si l’utilisateur utilise un ordinateur, il sera aiguillé vers le squelette article.html normal (à la racine du répertoire des squelettes)
  • si l’utilisateur utilise un ipad, il sera aiguillé vers le squelette article.html spécifique des ipad (placé dans le sous-répertoire ipad)
  • si l’utilisateur utilise un autre périphérique mobile, il sera aiguillé vers le squelette article.html pour les mobiles en général (placé dans le sous-répertoire mobile).

Ainsi on peut avoir quelque chose comme ça :

  • blackberry/
    • article.html
    • recherche.html
  • mobile/
    • article.html
  • tablettes/
    • sommaire.html
  • windowsphone7/
    • trucmuche.html

C’est à dire avec une page article spécifique pour Blackberry et une autre pour les mobiles en général, une page recherche spécifique pour Blackberry, une page trucmuche pour Windows Mobile 7, et une page sommaire que pour les tablettes.

Liste des sous-répertoires possibles

Pages pour mobiles va chercher les squelettes affichables dans des sous-répertoires du dossier squelettes qui dépendent du type de périphérique de navigation utilisé. Ces sous-répertoires sont nommés à partir des types de mobiles et des groupes de mobiles institués par le plugin cimobile.

  • types de mobiles :
    • ipod
    • ipad
    • androidtablette
    • android
    • blackberry
    • windowsphone7
    • windowsmobile
    • opera
    • S60
    • symbianos
    • palmwebos
    • nuvifone
    • sonymylo
    • nokiatablette
    • blackberrytablette
    • archos
    • mobile
  • groupe de mobiles :
    • ios_phones
    • smartphones
    • tablettes
    • autres_mobiles

Vous devez donc utiliser ces noms pour ranger vos pages spécifiques pour mobiles. À noter que la sous-répertoire mobile sera générique pour l’ensemble des mobiles en l’absence de répertoire plus spécifique.

Vous pouvez tester vos squelettes en utilisant dans l’URL le paramètre pages_mobiles avec les mêmes dénominations que les sous-répertoires possibles. Par exemple, pour tester l’affichage de l’article 42 sur un mobile Android, vous utiliserez http://votre_url/spip.php?page=article&id_article=42&pages_mobiles=android.

Pour revenir à l’affichage normal, utilisez la valeur « web » (sans guillemets) pour le paramètre pages_mobiles passé dans l’URL. Vous pouvez aussi vider le cookie pages_mobiles de votre navigateur.

Le logo du plugin est issu de nounproject : http://thenounproject.com/noun/appl... il est CC-BY Kyle Klitch.

Grand merci à Equipement pour son plugin cimobile : plugin « détection et aiguillage des téléphones mobiles ».

Discussion

21 discussions

  • 2

    Bonjour,
    Serait-il envisageable d’avoir une version SPIP 3.2, PHP 7.2+ de ce plugin ?
    Je peux m’en charger comment devenir contributeur ?
    Merci

    Répondre à ce message

  • 1

    Bonjour,

    Serait-il possible qu’une mise à jour soit faite pour spip 3.1 ?

    En effet, à part pour les re-directions (articles [mais on peut se débrouiller..], la recherche, erreur 404 [pas très important, car il est difficile sur un portable de taper une adresse longue, ..), ce plugin est très utile pour avoir des belles pages sur mobiles à son image et souvent simplifiées ... Donc de faire des jolis squelettes !..

    Plugin très utile, et simple à mettre en oeuvre, notamment dans la hiérarchie des dossiers à créer.

    Cordialement

    • Bonjour,

      Tu n’es pas le premier à en faire la demande ! Hélas, bien qu’ayant proposé ce plugin, je n’ai plus du tout le temps de m’en occuper ! Je passe volontiers la main ! L’ensemble des données sont disponibles sur SPIP-Zone : http://plugins.spip.net/pages_mobiles et n’importe qui en reprendre le développement.

      Je pense qu’une première étape serait de faire une liste exhaustive des problèmes et décrivant comment les reproduire.

    Répondre à ce message

  • Cédrin Mounziégou

    Bonjour,
    A quand une mise à jour pour 3.1. J’ai essayé de modifier le fichier paquet pour forcer la compatibilité avec Spip 3.1 mais le site s’ouvre avec des erreurs sur mobile avec l’url de type : URL/spip.php ?page=pages_mobiles&squelette_mobile=mobile/sommaire&erreur

    Quelqu’un peut-il m’aider ?

    Répondre à ce message

  • 1

    Bonjour,

    Je viens d’activer Pages-pour-mobiles (qui fontionne très bien, super !), pour autant il semblerait que le plugin Compositions ne soit pas pris en compte (les pages appelées sous mobiles sont les pages par défaut, article.html, rubrique.html).
    Est-ce normal ? Et si oui, pensez-vous qu’il existe un remède ;-) ?
    Merci

    • Christophe Noisette

      oui j’ai rencontré le même souci... Le plugin « composition » n’est pas pris en compte.
      C’est fort dommage.
      Quelqu’un a -t-il une piste ?
      Cordialement
      Christophe Noisette, Inf’OGM

    Répondre à ce message

  • Bonjour,

    Je m’intéresse à ce plugin mais j’utilise Noizetier et donc Aveline et Zpip-vide.
    Est ce compatible ? Et si oui, dans quel répertoire doit on créer /mobile ?
    Merci

    Répondre à ce message

  • 2

    Bonjour,
    Ce plugin semble très intéressant.
    Je voudrais savoir, avant de le tester, si les problèmes évoqués dans le forum ont été résolus et si quelqu’un met à jour les éventuels problèmes.
    Si j’utilise ce plugin, si j’ai bien compris, puis-je, par exemple, mettre un squelette entier responsive (comme la dist ?!) dans le répertoire squelettes/mobile afin d’avoir, de manière simple, l’intégralité en responsive, tout en gardant un ancien squelette non responsive pour le site visionné sur l’ordinateur ?
    Merci de vos réponses.

    • bon mon message est parti en réponse à un autre commentaire :

      tout à fait, tu fais plusieurs jeux de squelettes, ou si tu préfères, un jeu pour mobiles et ton squelette normal pour ordinateur

    • Donc j’imagine que les problèmes évoqués dans ce forum ont été résolus :)
      Merci beaucoup pour la réponse, je vais tester ça. Si ça marche c’est totalement géant ! Je vous donnerai des nouvelles.

    Répondre à ce message

  • 2

    bonjour,

    merci pour ce plugin très pratique.
    J’éprouve cependant quelques difficultés à l’utilisation :

    tout d’abord, le plugin semble ne plus fonctionner dès lors qu’on utilise l’url rewriting : url propres par exemple géré par couteau suisse.

    ensuite, je n’ai pas compris comment faire en sorte que les tablettes soient rédirigées vers une version web classique.

    d’avance, merci et bonne journée à tous

    • tout à fait, tu fais plusieurs jeux de squelettes, ou si tu préfères, un jeu pour mobiles et ton squelette normal pour ordinateur

    • bon, le message ci dessus ne s’adressait pas à ce commentaire.

      je continue l’étude de mes bugs.

      après tests, il s’avère que c’est l’url rewriting propres2 (je n’ai pas testé les autres) géré par le plugin couteau-suisse qui ne fonctionne pas.

      en mettant l’url rewriting propres de spip, cela fonctionne.

      avec toutefois 2 problèmes toutefois, il n’y pas d’url rewriting pour les pages mobiles ?
      elles restent sous la forme
      spip.php ?page=pages_mobiles&squelette_mobile=mobile/rubrique&id_rubrique=XXX

      et le plugin n’est visiblement pas compatible avec le plugin squelette par mot-clé.

    Répondre à ce message

  • 1

    Bonjour,

    Je cherchais à utiliser une page spéciale, en l’occurence carte_globale.html, placée dans squelettes/mobile, dans le cadre d’un site multilingue.
    Il semble que pour se faire, que les liens prennent la forme suivante :

    [(#URL_PAGE{pages_mobiles}|parametre_url{squelette_mobile, mobile/carte_globale}|parametre_url{lang, #LANG})]})] 

    Par contre, je sèche pour faire fonctionner la recherche via la page recherche.html et le formulaire recherche. Une piste ?

    • Je me réponds : pour la page recherche il faut faire l’appel du formulaire de la manière suivante :

      [(#FORMULAIRE_RECHERCHE|spip.php?page=pages_mobiles&squelette_mobile=mobile/recherche)]

    Répondre à ce message

  • Bonjour,

    Une chose étonnante (quoiqu’il doit y avoir une bonne raison) :

    <BOUCLE_si_un_seul_article(ARTICLES){id_rubrique}{lang}>
    [(#TOTAL_BOUCLE|=={1}|?{' ',''})
    #HTTP_HEADER{location:./#URL_ARTICLE}]
    </BOUCLE_si_un_seul_article>

    ne fonctionne pas, on ne peut donc avoir de redirection automatique s’il n’y a qu’un seul article dans la rubrique...

    Répondre à ce message

  • 6

    Bonjour,

    j’ai créé deux dossiers dans /squelettes :
    /mobile
    /tablettes
    Chacun de ces dossiers contient bien un squelette sommaire.html, et pourtant, connectée sur une iPad, je suis redirigée vers /mobile/sommaire.html

    Une idée d’où peut venir le couac ?

    Merci

    PS : SPIP 3.0.11

    • EDiT :

      pour info, « monsite.com ?pages_mobiles=tablettes » me redirige bien vers mon squelette /tablettes/sommaire.html

    • Loïc HEROGUER

      Pareil pour moi j’ai le même soucis, la tablette (samsung galaxy note 2 10.1) est redirigé vers la version mobile quelq’un a pu résoudre ce soucis ?

    • Pour info Loïc, perso j’ai fini par abandonner ce plugin. J’ai utilisé ça : http://mobiledetect.net/ (PHP)
      et ça marche super !

    • Bonjour
      @angie peux tu developer comment tu as utilisé mobiledetect pour reproduire le meme comportement que pages pour mobile ?

    • Bonjour @Steph.27,

      Mes souvenirs sont aujourd’hui complètement évanouis (même pas moyen de me rappeler du projet concerné...) mais à vue de nez, je dirais reconnaissance du device via mobiledetect, et renvoie vers le bon squelette selon desktop / tablet / mobile en PHP

    • Bonjour,

      Dommage que tu n’as pas gardé une trace de ta procédure d’installation…

      Je serais également intéressé par http://mobiledetect.net/. Quelqu’un aurait-il réussit ?

    Répondre à ce message

Ajouter un commentaire

Avant de faire part d’un problème sur un plugin X, merci de lire ce qui suit :

  • Désactiver tous les plugins que vous ne voulez pas tester afin de vous assurer que le bug vient bien du plugin X. Cela vous évitera d’écrire sur le forum d’une contribution qui n’est finalement pas en cause.
  • Cherchez et notez les numéros de version de tout ce qui est en place au moment du test :
    • version de SPIP, en bas de la partie privée
    • version du plugin testé et des éventuels plugins nécessités
    • version de PHP (exec=info en partie privée)
    • version de MySQL / SQLite
  • Si votre problème concerne la partie publique de votre site, donnez une URL où le bug est visible, pour que les gens puissent voir par eux-mêmes.
  • En cas de page blanche, merci d’activer l’affichage des erreurs, et d’indiquer ensuite l’erreur qui apparaît.

Merci d’avance pour les personnes qui vous aideront !

Par ailleurs, n’oubliez pas que les contributeurs et contributrices ont une vie en dehors de SPIP.

Qui êtes-vous ?
[Se connecter]

Pour afficher votre trombine avec votre message, enregistrez-la d’abord sur gravatar.com (gratuit et indolore) et n’oubliez pas d’indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici

Ce champ accepte les raccourcis SPIP {{gras}} {italique} -*liste [texte->url] <quote> <code> et le code HTML <q> <del> <ins>. Pour créer des paragraphes, laissez simplement des lignes vides.

Ajouter un document

Suivre les commentaires : RSS 2.0 | Atom