Traduit d'un article de insraq posté le 27/11/2010 sur xoops.org
J'ai été tellement occupé récemment que j'avais disparu de la communauté XOOPS depuis un certain temps. Je n'ai pas publié de nouveau thème depuis quelques mois et le XOOPS de mon ordinateur portable était encore 2.4.x. Jusqu'à la semaine dernière, je me suis occupé à tester XOOPS 2.5 et je suis très impressionné. La nouvelle interface admin est super. J'aime particulièrement le nouveau gestionnaire de blocs.
X3 Alpha a été publié. Le code est encore a l'état embryonnaire, mais l'architecture est très prometteuse. Je vais certainement regarder les thèmes si j'ai le temps.
Pendant ce temps, je publie 960 pour XOOPS 2.0. Le changement le plus significatif dans cette version est le support mobile. J'ai un téléphone Android et je surfe très souvent avec lui depuis que j'ai accès au WiFi. De nombreux sites ont une version mobile qui rend la navigation beaucoup plus agréable. Il est très désagréable de voir une page web complexe en utilisant un navigateur pour mobile.
Cependant, il semble que les thèmes XOOPS n'ont toujours pas de support mobile (ou il y a quelques solutions mais je ne suis pas au courant de leurs sorties depuis mon absence). J'ai donc réécrit 960 pour XOOPS pour ajouter le support mobile.
Le support mobile est "automatique". Permettez-moi tout d'abord de vous expliquer comment il fonctionne.
Il est basé sur la gestion des médias par CSS3. Dans le cas habituel, la page Web ressemble à la disposition normale: 
Toutefois, si la largeur maximum de l'écran est inférieure à 960px (approximativement car cela dépend du navigateur), la mise en page sera automatiquement remplacé par "version mobile".
Les captures d'écran ci-dessus sont faites dans Firefox, vous remarquerez qu'il n'y a pas de barre de défilement horizontale et il n'y a qu'une seule colonne: toutes les autres colonnes sont «identiques» à la première colonne, qui convient à la taille de l'écran des appareils mobiles. Les images seront également redimensionnées au maximum de la largeur de l'écran pour éviter que certaines grandes photos déforment la mise en page.
Il y a une démo ici. Afin d'obtenir le meilleur résultat, vous devrez peut-être réorganiser les blocs pour faire en sorte que lorsqu'elle est réduite à une version mobile, les blocs les plus importants sont indiqués en haut et que la page Web ne soit pas trop longue.
Je suis inspiré de Less Framework 3 et 1140px GSS Grid . Au départ je voulais les adapter pour XOOPS, mais j'ai remarqué que ces deux cadres sont sous licence CC. Pour ne pas causer de problèmes de licence, je réécris ma propre version sur la base 960 pour XOOPS ainsi la licence est GPL, ce qui je crois ne posera pas de problème.
De plus, dans cette version, j'ai amélioré un style bien que le style par défaut ne semble pas trop mauvais. J'ai supprimer 16-colonne, préfixe, suffixe, poussez les codes connexes (Ils ne sont jamais pris en charge, mais je retiens le code dans la version précédente pour garder la compatibilité avec la version officielle 960).
La version stable peut être trouvée ici et bien sûr, vous pouvez vérifier le SVN pour la dernière version stable.
Je n'aurais pas le temps de vérifier les commentaires, si vous trouvez des bugs, s'il vous plaît, contactez-moi en remplissant ce formulaire ou par courriel à insraq.org AT gmail DOT com
Je n'ai pas le temps de préparer un tutoriel complet mais le code est très bien commenté et il n'y a pas de différence de l'utilisation de 960 d'origine. Ainsi, vous pouvez trouver un tutoriel pour le gabarit 960 de référence et si vous utilisé un thème basé sur ce gabarit, je serais très heureux de le savoir. N'hésitez pas à m'envoyer un e-mail.
J'espère que vous vous amuserez bien! |
5040
Re: Adaptation du support mobile pour le gabarit 960 pour...
