Refonte de l’espace privé de SPIP en Bootstrap
En octobre 2012, Cédric (qu’on ne présente plus dans la communauté SPIP) a publié sur la zone SPIP un plugin permettant de faire du Bootstrap (anciennement connu sous le nom de "Twitter Bootstrap") avec notre outil favori. Il a incorporé dans ce plugin le travail colossale de Tetue sur le respect de la typographie propre à SPIP.
Le temps que je me familiarise avec ce Framework CSS (et javascript) avec différents projets, l’envie m’est venue de refaire l’espace privé de SPIP grâce à Bootstrap…
Préambule
Cette phase n’est pas une refonte ergonomique de l’espace privé mais un portage de l’espace privé sur Bootstrap. Le but étant de retrouver les fonctionnalités de l’ancienne interface et si possible, d’apporter les réflexions et avantages de Bootstrap.
Un groupe de travail pourra être monté à la suite de cette phase de portage pour se pencher sur l’ergonomie de l’espace privé.
Le choix de Bootstrap a été fait pour ma part grâce à l’existence du plugin de Cédric. Des personnes pourraient dire que ce choix n’est pas judicieux. Certes, mais nous avons un plugin existant alors autant en profiter. De plus, les phases de portage vers un framework pourront aider si on décide de partir vers un autre framework CSS (exemple : Foundation, 52Framework, YUI Grids, etc.).
La rédaction du présent article sur mon blog a été fait pour ne pas polluer SPIP Contrib comme l’a très justement noté Cédric ici. Quand tout sera sur une version stable, j’écrirai un article sur SPIP Contrib.
Plus que des mots…
… des images.
Pour que vous vous rendiez compte du rendu, je vous invite à regarder les images ci-dessous d’avant/après.
Page d’accueil
Page d’accueil - Menu de navigation
Page d’accueil - Menu de navigation au survol
Page d’article
Appel à tester
Comme vous pouvez le voir, l’interface a pas mal changé mais il reste beaucoup de travail à réaliser. De ce fait, j’aurais besoin de beta testeur.
Un appel a déjà été fait sur la liste spip-dev. On peut continuer la conversation sur la liste mais vous pouvez aussi poster vos commentaires (appréciations, remontées de bugs, pertes de fonctionnalités, améliorations, etc.) sur l’article ici présent.
Je m’efforcerai à noter chaque bug sur cet article et au moins sur le fichier TODO du répertoire dudit plugin.
Pour tester
Et bien, pour tester, il vous faudra récupérer les fichiers par svn :
svn checkout svn://zone.spip.org/spip-zone/_plugins_/bootstrap_prive
Ce plugin est dépendant de 2 autres plugins :
– Bootstrap : http://zone.spip.org/trac/spip-zone... ;
– LESSCSS : http://zone.spip.org/trac/spip-zone....
Réalisations
10/04/2013 :
Avec le commit http://zone.spip.org/trac/spip-zone..., le bandeau de navigation devient blanc (la classe navbar-inverse a été retirée) et laisse place aux icônes de couleur propre à SPIP. L’interface en est plus légère, plus douce.
01/01/2014
Avec le commit http://zone.spip.org/trac/spip-zone..., le bug sur la page article est réglé.
La pagination est conventionnelle à Bootstrap avec ceci http://zone.spip.org/trac/spip-zone...
Derniers commentaires
# Le 25 septembre à 12:01, par Teddy Payet
En réponse à : Un Nouveau Chapitre : Mon Admission dans un MBA en Intelligence Artificielle et Data Innovation
# Le 25 septembre à 11:20, par vY
En réponse à : Un Nouveau Chapitre : Mon Admission dans un MBA en Intelligence Artificielle et Data Innovation
# Le 21 juin à 13:49, par Teddy Payet
En réponse à : Home Assistant : Routine le matin avant l’école
# Le 21 juin à 10:47, par Teddy Payet
En réponse à : Ma domotique open source
# Le 16 juin à 17:15, par Eric
En réponse à : Ma domotique open source
# Le 7 mars à 09:43, par Jacques Pyrat
En réponse à : Un Nouveau Chapitre : Mon Admission dans un MBA en Intelligence Artificielle et Data Innovation