SPIP-Contrib

SPIP-Contrib

عربي | Deutsch | English | Español | français | italiano | Nederlands

286 Plugins, 197 contribs sur SPIP-Zone, 320 visiteurs en ce moment

Accueil > Squelettes > Squelettes spéciaux > Squelettes pour petits écrans > Pages pour mobiles > Pages pour mobiles

Pages pour mobiles

16 septembre 2012 – par Beurt – 74 commentaires

11 votes

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.

Voir en ligne : http://plugins.spip.net/pages_mobiles

P.-S.

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 ».

Dernière modification de cette page le 17 septembre 2012

Retour en haut de la page

Tout afficher

Vos commentaires

  • Le 19 octobre à 19:45, par gérard En réponse à : Pages pour mobiles

    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

    • Le 19 octobre à 19:59, par Beurt En réponse à : Pages pour mobiles

      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

  • Le 18 janvier à 16:57, par Cédrin Mounziégou En réponse à : Pages pour mobiles

    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

  • Le 17 septembre 2015 à 16:54, par Beno En réponse à : Pages pour mobiles

    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

    • Le 18 janvier à 14:45, par Christophe Noisette En réponse à : Pages pour mobiles

      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

  • Le 3 décembre 2015 à 11:40, par ordilibre En réponse à : Pages pour mobiles

    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

  • Le 25 novembre 2015 à 22:11, par Perline En réponse à : Pages pour mobiles

    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.

    • Le 26 novembre 2015 à 11:18, par buvette1 En réponse à : Pages pour mobiles

      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

    • Le 26 novembre 2015 à 21:19, par Perline En réponse à : Pages pour mobiles

      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

  • Le 24 novembre 2015 à 17:25, par buvette1 En réponse à : Pages pour mobiles

    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

    • Le 26 novembre 2015 à 11:17, par buvette1 En réponse à : Pages pour mobiles

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

    • Le 26 novembre 2015 à 11:27, par buvette1 En réponse à : Pages pour mobiles

      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

  • Le 9 octobre 2015 à 19:49, par Beno En réponse à : Pages pour mobiles

    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 :

    1. [(#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 ?

    • Le 10 octobre 2015 à 05:08, par Beno En réponse à : Pages pour mobiles

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

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

    Répondre à ce message

  • Le 18 septembre 2015 à 10:43, par Beno En réponse à : Pages pour mobiles

    Bonjour,

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

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

    Télécharger

    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

  • Le 9 octobre 2013 à 17:30, par Angie En réponse à : Pages pour mobiles

    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

    • Le 9 octobre 2013 à 17:32, par Angie En réponse à : Pages pour mobiles

      EDiT :

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

    • Le 14 novembre 2013 à 20:05, par Loïc HEROGUER En réponse à : Pages pour mobiles

      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 ?

    • Le 15 novembre 2013 à 08:30, par Angie En réponse à : Pages pour mobiles

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

    • Le 14 septembre 2014 à 11:34, par Steph.27 En réponse à : Pages pour mobiles

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

    • Le 20 octobre 2014 à 16:56, par Angie En réponse à : Pages pour mobiles

      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

    • Le 2 mai 2015 à 10:15, par Théo En réponse à : Pages pour mobiles

      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

  • Le 10 avril 2015 à 16:32, par PierreG En réponse à : Pages pour mobiles

    Je veux faire un lien vers une rubrique (url arborescentes ou non), cela me renvoie vers la version classique du site. Le plugin n’est pas censé détecté le user-agent à chaque navigation ?
    PS : j’ai bien créé mon « rubrique.html » et j’ai bien le cookie « pages_mobiles » détecté par le navigateur

    Merci d’avance

    Répondre à ce message

Répondre à cet article

Qui êtes-vous ?

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 Les choses à faire avant de poser une question (Prolégomènes aux rapports de bugs. )
Ajouter un document

Retour en haut de la page

Ça discute par ici

  • Métas +

    3 décembre – 12 commentaires

    Améliorez l’indexation de vos articles dans les moteurs et leur affichage sur les réseaux sociaux grâce aux métadonnées Dublin Core, Open Graph et Twitter Card. Installation Activer le plugin dans le menu dédié. Dans le panel de configuration, (...)

  • Acces Restreint 3.0

    11 décembre 2008 – 785 commentaires

    Le plugin accès restreint permet de définir et de gérer des zones de l’espace public en accès restreint. Cette version du plugin a été redévelopée et optimisée tout spécialement pour SPIP 2.0. Il en découle une amélioration des performances sur les gros (...)

  • Compositions 2 et 3

    25 mars 2011 – 176 commentaires

    Ce plugin vous permet de définir plusieurs variantes de squelettes (nommées compositions) pour un même type d’objet SPIP. Dans l’espace privé, il est alors possible de choisir, dans un menu déroulant, la composition qu’on veut attribuer à chaque (...)

  • Configurer Sparkpost

    25 avril – 18 commentaires

    N’hésitez pas à relire le préambule de cette rubrique avant de créer un compte sur une plateforme tierce . Présentation Sparkpost est une société d’envoi de mailing https://www.sparkpost.com/ Sur les petits volumes ( <100.000 emails / mois), (...)

  • Mode portail Communiquant pour SoyezCréateurs

    29 septembre 2010 – 21 commentaires

    5e mode d’affichage de la page d’accueil, ce mode se distingue des autres par une animation proposant un fondu/enchaîné des logos des articles à la une. Zonage Configuration Zone d’entête Nom du site Slogan si plugin bandeau présent (...)

Ça spipe par là