Squelettes IENSP-X

Mettez un look Mac dans votre SPIP - version 2.0

Présentation

-  Nom du Squelette : « IENSP-X »
-  Version du squelette : 2.0
-  Auteur : Stéphane Kus et Doc Mac
-  Licence : GPL
-  Compatibilite SPIP : compatible SPIP > 1.9.2
-  Sites exemples :

-  Principales fonctionalités et spécificités :

Un squelette éditorial avec une barre de navigation et un menu déroulant à 3 niveaux tout en CSS, ainsi qu’un portfolio qui ouvre les images dans une fenêtre pop-up avec des boutons de navigation d’une photo à l’autre.

Le but a été d’obtenir une variante du squelette IENSP avec un habillage graphique sympa très facile à modifier puisqu’il suffit de modifier 3 images.

Il est à noter que IENSP-X utilise le filtre « supprimer_numero » qui vous permet d’ordonner vos rubriques en leur ajoutant un numéro qui sera invisible dans l’espace public. Pour faire apparaître les rubrique dans l’ordre que vous souhaitez il suffit de les nommer de la manière suivante :

  • 01. marubrique
  • 02. marubrique

Attention : vous devez obligatoire mettre un espace après le point pour que ça fonctionne.

La version 2.0 améliore le menu déroulant et intègre un calendrier en page d’accueil :
-  Pour fonctionner le portfolio nécessite l’installation du plugin Thickbox2 et son activation dans l’espace privé
-  Pour faire fonctionner le calendrier dans la page d’accueil installez les plugins Widget calendar et Agenda dans le répertoire plugins/ à la racine de votre site et activez-les dans l’espace privé).

Testé sur ces navigateurs

Testé ?PlateformeNavigateurVersion
oui windows Internet explorer 7
oui windows Firefox .
oui Mac Safari .
oui Mac Firefox .
oui Mac Opera .
oui Unix/Linux Firefox .

Personnaliser le squelette

Vous pouvez aisément personnaliser ces squelettes : il suffit de modifier 3 images :
-  /squelettes/images/fond.gif pour modifier l’arrière plan des pages
-  /squelettes/images/fondbarre.png pour modifier la barre de navigation et du pied de page
-  /squelettes/images/ArtWindTop.png pour modifier la barre du haut des différents blocs de la page.

N’hésitez pas à donner votre avis (par mail ou via le forum de cet article).

Une petite image de la page d’accueil :

téléchargez IENSP-X version 2

Téléchargement

Dernière modification de cette page le 9 février 2019

Discussion

4 discussions

  • Bonjour à tous, je vous informe que pour le moment ce squelette est incompatible avec SPIP 2.0

    J’ai contacté Stéphane à ce sujet, nous aurons certainement une réponse bientôt.

    Doc Mac

    Répondre à ce message

  • orcieres

    Bonjour,

    je voudrai augmenter la profondeur du menu de 3 à 5 niveaux
    pouvez-vous me donner une piste pour le faire ?

    je « rendrai » la copie à la communauté...

    merci

    jean

    Répondre à ce message

  • 7

    bonjour,

    j’utilise ce squelette et j’en suis très satisfait, cependant, malgré l’activation des plugins widgetcalendar et agenda, je n’arrive pas à afficher l’agenda en page d’accueil... ai-je oublié quelquechose ?
    merci d’avance pour votre aide

    • Bonjour
      Si tu me donnes l’adresse de ton site, je pourrais regarder de plus près...
      Stéphane

    • le site du lycée est visible à cette adresse :
      http://www.ac-nice.fr/coudon/cdi/

      j’avais déjà utilisé ces deux plugins avec le squelette « beespip » et l’agenda apparaissait automatiquement en page d’accueil

      c’est sympa de jeter un coup d’oeil
      merci

    • Bonjour,

      Il faudrait rajouter à la ligne 95 du fichier squelettes/sommaire.html l’appel au calendrier :

      <div class="breves">
      [(#CALENDRIER_MINI{#ENV{date},'date',#URL_ARTICLE})]
      </div>

      Ensuite il faudrait rajouter dans le répertoire squelettes/formulaires/ le fichier calendrier_mini.html que tu peux trouver ici

      Si tu as un soucis, n’hésite pas à renvoyer un message.

      @+ Stéphane

    • je viens de faire les modifications sur une version locale et hop l’encart calendrier apparaît entre l’encart brèves et celui des sites... mais la couleur de police est blanc sur fond blanc, les éléments y sont, mais restent « invisibles » ; quel fichier dois-je modifier ? habillage.css ? le fichier calendrier_mini.html ? je ne m’y retrouve plus
      mais déjà c’est super, grâce à toi je suis tout proche de la solution...

    • J’ai ta solution :
      rajoute dans habillage.css ces deux lignes :

      #calendar h2 {display: none;}
      #calendar a {font-weight: bold;color: black;}

      Sinon, d’ici quelques jours, je vais publier la version 2 du squelette qui intégre le plugin agenda et corrige deux-trois bugs...

      @ + Stéphane

    • bonjour

      vraiment merci de prendre du temps pour m’aider,
      j’ai rajouté tes lignes dans habillage.css
      mais en modifiant « a » par « table »
      et ça marche
      par contre en cliquant pour changer de mois il y a un bug
      est-ce que je dois attendre la version 2 dont tu parles ? ou est-ce que
      ça vaut le coup de continuer à modifier celle-ci ?
      de toute façon c’est pour la rentrée :-)
      merci encore

    • Tu n’auras pas longtemps à attendre pour la version 2, elle est en téléchargement sur cette page depuis 3 jours...
      Tu peux voir ce que ça donne sur le site de développement http://skus1.free.fr

    Répondre à ce message

  • 2

    bonjour

    bravo pour cette variante, le résultat est bluffant ! j’ai juste un petit problème d’affichage : en page sommaire, le « bloc » brèves est décalé à droite, bien au delà du champs rechercher ; en tout cas sous I.E
    il y a-t-il une solution ?
    par avance merci

    • Bonjour, Le problème vient de la manière dont IE gère les CSS.

      Tout autre navigateur ne vous posera aucun problème.

      Cependant, merci de nous donner la version d’IE que vous utilisez.

      J’ai testé sous IE 7 sans noter de problème particulier.

      La version 6 de IE ne gère pas correctement les CSS.

    • c’est bien la version 6 d’I.E
      merci pour votre réponse

    Répondre à ce message

Ajouter un commentaire

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

Ce champ accepte les raccourcis SPIP {{gras}} {italique} -*liste [texte->url] <quote> <code> et le code HTML <q> <del> <ins>. Pour créer des paragraphes, laissez simplement des lignes vides.

Ajouter un document

Suivre les commentaires : RSS 2.0 | Atom