SPIP-Contrib

SPIP-Contrib

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

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

Accueil > Squelettes > Squelettes spéciaux > Webetab-Light

Webetab-Light

5 octobre 2008 – par Frank Endres – 32 commentaires

2 votes

Webetab-Light est un squelette simple pour établissements scolaires ou associations.

Introduction

Webetab-Light est un squelette pour SPIP développé par le lycée Savary de Mauléon des Sables d’Olonne.

Il a été conçu pour être simple d’utilisation et facile à relooker et est destiné aux établissements scolaires, associations, ...

Fonctionnalités :

  • une page d’accueil avec éditorial, brèves et liste des derniers articles publiés.
  • un menu latéral déroulant présentant l’arborescence du site en rubriques, sous-rubriques (...) et articles.
  • une page pour afficher les résultats des recherches.

Vous pouvez le voir en démonstration sur le site du BTS informatique des Sables d’Olonne (remarque : ce site est privé : le contenu des articles n’est pas accessible).

Remarque : par défaut avec ce squelette, l’accès au contenu n’est possible qu’aux utilisateurs authentifiés. Pour que le site devienne public, il suffit de supprimer (ou de commenter) la première ligne du fichier article.html du squelette.

Installation

Extraire l’archive et placer les fichiers dans le dossier squelettes de spip (à créer). La documentation présente dans l’archive (fichier documentation_webetab-light.odt) explique ensuite la procédure à suivre pour configurer le squelette (en 5 minutes) et créer les pages d’accueil et de mentions légales.

Relookage

Pour relooker, il suffit d’éditer le fichier couleurs.css (cf documentation) et de changer l’image de la bannière (images/bandeau.jpg) et du pied de page (images/pied.jpg). Les logos peuvent êtres changés ou supprimés (en éditant pied.html).

Licence

Webetab-Light est distribué sous licence CECILL-2 (logiciel libre).
frank (point) endres (chez) ac (tiret) nantes (point) fr

Téléchargement

La version 1.8.0 (du 30/10/2009) ajoute la possibilité de s’authentifier sans passer par l’espace privé.

  • Zip - 79.3 ko
    webetab-light-1.8.0-md.zip
  • Binary Data - 4.9 ko
    wl-1.7.2-to-1.8.0.patch

La version 1.7.2 (du 08/05/2009) corrige un problème d’affichage des titres d’articles avec IE (cf messages du forum) et rétablit la validation XHTML 1.1.

  • Zip - 240.3 ko
    webetab-light-1.7.2-md.zip
  • Binary Data - 2.9 ko
    wl-1.7.1-to-1.7.2.patch

La version 1.7.1 (du 26/03/2009) corrige le problème d’impression (seule la première page était imprimée) et un défaut d’affichage pour les tableaux (ces deux problèmes sont liés à la propriété « overflow : hidden » nouvellement appliquée à la zone « contenu »).

La version 1.7.0 (du 23/03/2009) corrige le problème d’affichage avec IE7 et ajoute la possibilité de commenter les articles (si les forums sont actifs).

Un petit plugin facultatif ajoutant quelques raccourcis typographiques est également disponible :

  • permet plusieurs niveaux d’inter-titres : '{2{...}2}', '{3{...}3}' et '{4{...}4}',
  • et les acronymes : BTS.
    Zip - 6.5 ko
    wl-typo-1.2.zip

Dernière modification de cette page le 10 octobre 2011

Retour en haut de la page

Tout afficher

Vos commentaires

  • Le 11 juin 2009 à 12:44, par ? En réponse à : Positionnement

    Pour le problème d’affichage du menu, je pense qu’il peut s’agir des propriétés « list-style-position », « padding » ou « margin ». Vérifier ces propriétés pour les balises « ul », « li » et la zone « menu ».

    • Le 11 juin 2009 à 13:52, par ? En réponse à : Positionnement

      Merci, malheureusement j’ai déjà vérifié ces propriétés... Le fichier Positionnement.css est scrupuleusement identique pour les balises ul li et la zone menu etc... au modèle de base, hors j’ai vérifié, le bug n’est pas présent sur le site-exemple...

    • Le 11 juin 2009 à 14:24, par ? En réponse à : Positionnement

      Bon j’ai trouvé, le bug était orchestré par le fait qu’il y avait un espace de trop à la première ligne du fichier positionnement.css :
      /* ---------- proprietes communes ---------- */
      * margin : 0 px ; padding : 0 px ;

      qu’il faut remplacer par :
      * margin : 0px ; padding : 0px ;

      Cet espace devait être présent dans les anciennes versions, et fait apparement bugger IE...

    Répondre à ce message

  • Le 11 juin 2009 à 11:21, par ? En réponse à : Re : Personnalisation

    Bonjour !

    Effectivement, vous avez beaucoup personnalisé le squelette ! Il est prévu pour être facilement modifiable, et j’espère qu’il vous a satisfait sur ce point. Vous utilisez certaines fonctionnalités qui ne me sont pas utiles pour l’instant,mais je suis intéressé par les changements d’aspects / couleurs que vous avez effectué. Peut être pourriez vous m’envoyer un correctif / patch (« diff -Naur original modification ») ou le lien vers votre site ? Je vous en remercie d’avance.

    Frank Endres

    • Le 11 juin 2009 à 12:08, par ? En réponse à : Re : Personnalisation

      Absolument, je vous enverrais l’url dès que le site sera en ligne (c’est également un site d’établissement scolaire, mais publique pour ma part).
      Je viens de remarquer que vous avez résolu le problème des tableaux également (qui n’était pas totalement affichés sous IE ou FF je ne me souviens plus). J’avais résolu le problème également même si ce n’était pas de la même manière en modifiant directement le apparence.css (en positionnant le width de table sur 99% au lieu de 100).

      J’ai cependant un petit problème, je viens a peine de découvrir qu’un petit problème d’affichage survient sous IE (encore ces problèmes de compatibilité) je travaille sur FF 3.0 et j’ai le mauvais reflex de ne pas aller régulièrement regarder les effets sous IE 7.

      Malheureusement, mauvaise surprise aujourd’hui en testant sous IE, j’ai un décallage de presque tout le texte sur la droite (et qui n’est pas présent sur FF 3.0) : dans le menu, dans la partie ’Focus’, ainsi que les ’derniers articles’.
      Auriez vous idée d’où cela peut-il venir ? Je suppose que ça a un rapport avec un quelconque padding, mais je ne me rappelle pas en avoir modifié, ou très peu...

      Merci pour vos réponses.

      JPEG - 31.7 ko

    Répondre à ce message

  • Le 11 juin 2009 à 10:32, par ? En réponse à : Personnalisation

    Tout d’abord bonjour,

    Je voudrais féliciter votre travail qui m’a largement satisfait dans son ensemble. Personnellement, j’ai effectué quelques changements, que je vous liste ici pour que vous puissiez éventuellement piocher dans ce qui pourrait vous intéresser (en vrac avec certainement un certain nombre d’oublis malheureusement, je n’ai pas listé les modifications au fur et à mesure) :

    -  Ajout : de la date de publication et de l’auteur à la fin d’un article.

    -  Ajout : des derniers articles écris par cet auteur à la fin d’un article

    -  Ajout : d’une page de présentation de l’auteur avec :
    * Sa biographie (si renseignée) ;
    * Son logo (éventuellement une photo, si renseigné) ;
    * La totalité des articles écrits par cet auteur ;

    -  Modification : De la gestion des liens hypertextes inter-site en ajoutant un soulignement ainsi qu’un changement de couleur, afin d’être en phase avec les normes communes.

    -  Modification : Classification des articles par dates de publication (si aucun numéro n’est précisé) et non par numéro d’id.

    -  Modification : de différentes couleurs/aspects avec entre autres :
    * La couleur de mise en évidence (désormais violet clair) ;
    * Suppression du soulignement du titre des brèves (pour ne pas confondre avec un lien hypertexte, puisque non cliquables) ;
    * Suppression des boutons grisés au clic (on se retrouve vite avec un menu gris) ;

    -  Ajout : d’une présentation succinte du tout dernier article en présentant sa description (si renseignée) ou les 200 premiers caractères, pour les utilisateurs réguliers.

    -  Ajout : d’une bannière permettant une aération du site.

    Tout n’est certainement pas bon à prendre, et ces modifications ne présentent aucune prétention quant à votre travail. Je pense simplement qu’il peut être intéressant d’échanger les avis sur l’ergonomie globale et les fonctionnalités du site, si jamais cela peut vous servir.

    Répondre à ce message

  • Le 2 juin 2009 à 21:47, par ? En réponse à : Webetab-Light

    La colonne centrale peut prendre la largeur de toute la page : il « suffit » de modifier le fichier « pied.html » pour que le div menu soit placé à l’intérieur du div contenu (simplement inverser les deux premières lignes) ;
    ensuite, il faut éditer le fichier « positionnement.css » pour définir une largeur de 100% pour le div contenu et retirer pour cet élément la propriété « float:right » : (« #contenu width : 100% ;  »)

    Cordialement,
    Frank Endres

    Répondre à ce message

  • Le 2 juin 2009 à 11:06, par Nina En réponse à : Webetab-Light

    Bonjour,

    Je tiens d’abord a vous féliciter pour ce squelette, qui est assez bien fait. Maintenant j’ai quelques désagrément avec l’affichage, car la colonne de centre est assez grande et celles de gauche et droite sont un peu vides, comment remedier a cela ? y a-t-il une possibilité que la colonne centrale prenne la largeur de toute la page une fois toutes les rubriques affichées ?

    Cordialement, Nina.

    Répondre à ce message

  • Le 29 avril 2009 à 20:30, par ? En réponse à : Webetab-Light - Notes de bas de page

    Effectivement le squelette ne gère pas les notes de bas de page. Il ne prends en compte que le titre, le sous-titre et le contenu de l’article, mais l’édition du fichier « article.html » devrait vous permettre de rajouter la balise nécessaire à l’affichage de ces notes : un « #NOTES » après la balise « <p>#TEXTE</p> » devrait faire l’affaire.

    • Le 7 mai 2009 à 10:55, par ? En réponse à : Webetab-Light - Notes de bas de page

      Oui effectivement j’aurais pu me creuser un peu la tête en cherchant si il existait une balise #NOTES...
      Je n’ai actuellement pas le temps de tester mais cette solution fonctionne certainement, merci et bonne continuation !

    Répondre à ce message

  • Le 29 avril 2009 à 11:40, par ? En réponse à : Note de bas de page

    Bonjour,

    J’ai un problème concernant les notes de bas de page, qui n’ont pas l’air de fonctionner.
    Je ne sais pas vraiment si cela est dû au squelette ou si le plugin qui gère la note bas de page est défaillant, mais je pense que c’est plutôt un problème de squelette, j’explique pourquoi :
    Les notes de bas de pages marchent bien en mode prévisualisation, ainsi qu’après avoir validé l’article, mais elles ne fonctionnent pas lorsque l’on visite l’article sur le site. Le chiffre de la note s’affiche, est cliquable, et change l’url après clic, mais rien ne se passe (d’ailleurs la note n’est pas affichée en bas de la page).

    Un autre petit problème également, lorsque l’on classe les articles avec les numéros (01. 02. 03. ...), les numéros ne s’affichent pas directement dans le menu, mais ils s’affichent par contre dans la bulle d’aide si l’on laisse la souris sur l’article, comment faire pour supprimer également les numéros dans la bulle d’aide (voir supprimer la bulle d’aide si la première solution est impossible) ?

    Merci d’avance pour vos réponses

    Répondre à ce message

  • Le 11 avril 2009 à 11:03, par ? En réponse à : Webetab-Light : Solution pour les arrondis

    Pour le problème d’arrondi avec IE, je pense qu’il suffit dans le fichier positionnement.css de remplacer la ligne :
    h1 { margin-left: 0px; /* pour IE */ padding-top: 0.4em; padding-bottom: 0.4em; }
    par : h1 { margin-left: 0px; /* pour IE */ line-height: 1.8em; }

    Pourriez vous me confirmer le bon fonctionnement (frank point endres chez ac-nantes point fr) pour que j’intègre cette solution dans la prochaine version ?

    Répondre à ce message

  • Le 15 avril 2009 à 11:15, par Frank Endres En réponse à : Webetab-Light - authentification

    Bonjour, tout d’abord, merci cy_altern pour ta proposition d’amélioration. Je l’intègrerait dès que possible dans la nouvelle version (révision / correctif) de Webetab-Light avec d’autres petites corrections.

    Pour ce qui est de l’authentification et de la restriction d’accès à certaines rubriques seulement, j’ai moi aussi utilisé le plugin d’accès restreint avec WL, mais je l’ai abandonné car avec une centaine d’utilisateurs (et beaucoup d’autorisations relativement complexes), le site était considérablement ralenti ; peut être la nouvelle version aura t-elle de meilleures performances, mais - si mes souvenirs sont bons - ce plugin fonctionne très bien avec une trentaine d’utilisateurs (pour l’utiliser, enlever la première ligne du fichier article.html).

    Répondre à ce message

  • Le 13 avril 2009 à 17:36, par Sylvain En réponse à : Page publique...

    Bonjour,

    Pour rester dans le sujet...

    La demande d’authentification de l’utilisateur pour afficher les pages est trés intéressante.

    Par contre est-il possible de ne demander l’authentification que pour certaines rubriques (les autres étant publiques) ?

    Je ne maitrise pas encore les balises spip pour faire ce travail.

    J’utilise donc pour le moment le plugin « Accès restreint » qui fonctionne très bien avec ce squelette.

    A bientot...

    Répondre à ce message

Répondre à cet article

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 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 – 14 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, (...)

  • Adaptive Images

    15 novembre 2013 – 69 commentaires

    Un plugin pour permettre aux sites responsive d’adapter automatiquement les images de la page à l’écran de consultation. Adaptive Images, que l’on pourrait traduire par Images adaptatives, désigne la pratique qui vise à adapter les taille, (...)

  • Social tags

    8 septembre 2008 – 428 commentaires

    Le plugin Social Tags permet d’ajouter des icônes de partage de liens vers les sites tels que Digg, Facebook, Delicious.... Une fois le plugin installé et activé (voir doc.), le choix des sites se fait via un menu de configuration. Insertion (...)

  • Module de Paiement Stripe

    17 octobre – commentaires

    Stripe est un prestataire de paiement externe https://stripe.com/fr qui propose une API moderne et une interface de paiement extrêmement conviviale et efficace. Ce module permet les paiements à l’acte et les paiement récurrents. Configuration (...)

  • Métas

    8 août 2009 – 50 commentaires

    Ce petit plugin permet l’ajout, depuis l’espace privé, de metatags aux articles et rubriques de SPIP, ainsi que la mise en exergue de mots importants.

Ça spipe par là