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 30 décembre 2022 à 09:55, par Teddy Payet
En réponse à : Home Assistant : Routine le matin avant l’école
# Le 14 septembre 2022à 23:51, par spipfactory
En réponse à : Nettoyer la médiathèque
# Le 16 août 2022à 11:21, par idem2lyon
En réponse à : Home Assistant : Routine le matin avant l’école
# Le 12 mars 2022à 05:39, par BijouLePou
En réponse à : Je suis passé à SPIP 4.0
# Le 10 janvier 2022à 17:41, par julien
En réponse à : Je suis passé à SPIP 4.0
# Le 14 septembre 2021 à 13:12, par Teddy Payet
En réponse à : Je suis passé à SPIP 4.0