SPIP - Contrib

[ar] [en] [es] [fr] [it]



Accueil du site > Squelettes complets > Squelettes « éditoriaux » > IENSP

Squelettes IENSP standard

version 3.1

jeudi 10 janvier 2008, par stephane. Dernier ajout lundi 21 janvier 2008


Version 3.1 intégrant les plugins Agenda, Thickbox2, Accès Restreint, ainsi que la transparence des menus déroulants


Présentation

- Nom du Squelette : "IENSP"
- Version du squelette : 3.1
- Auteur : Stéphane Kus
- Licence : GPL
- Compatibilite SPIP : compatible SPIP > 1.9.2
- Sites exemples : site de développement

Principales fonctionalités et spécificités

Un squelette simple qui rajoute au squelette par défaut une barre de navigation et un menu déroulant tout en CSS, un annuaire des sites web référencés, ainsi qu’un portfolio qui utilise le plugin Thickbox2. A part quelque déplacement de <div>

et le rajout de l’album, seuls les fichiers habillage.css et spip_style.css ont été modifiés.

Le but pour moi a été de mettre en pratique mon travail sur les CSS, et donc de faire une mise en page qui ne modifie quasiment pas les squelettes par défaut de SPIP à part le fichier habillage.css. J’espère que ces squelettes vous donnerons envie de plonger dans le CSS afin de créer un style propre à vos sites.

- La version 2.0 améliore le rendu avec Firefox (utilisation de la propriété CSS3 border-radius pour arrondir les angles des blocs), amélioration de l’esthétique du portfolio, ajout d’un bloc "derniers sites référencés" en page d’accueil, ajout d’un fichier annuaire.html qui donne la liste de tous les sites référencés, ajout d’un dégradé autour de la page.
- La version 2.1 rajoute un 3eme niveau au menu déroulant
- La version 2.2 corrige un bug du menu déroulant avec des titres qui débordaient parfois du cadre et intègre un calendrier dans la page d’accueil (nécessite l’installation des plugins Widget calendar et Agenda dans le répertoire "plugins" à la racine de votre site et leur activation dans l’espace privé).
- La version 3.0 améliore le menu déroulant (transparence), la barre de navigation (survol des liens modifiant l’image de fond) et intègre le plugin Thickbox2 pour le portfolio (fonction diaporama) et le plugin accès restreint pour mettre certaines zones du site public en accès réservé aux abonnés.
- la version 3.1 corrige 2 petits bugs de l’identification

Il est à noter que IENSP utilise maintenant 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.

Testé sur ces navigateurs

Testé ?PlateformeNavigateurVersion
oui windows Internet explorer 6 et 7 (le menu déroulant ne marche pas avec IE6)
oui windows Firefox .
oui Mac Safari .
oui Mac Firefox .
oui Mac Opera .
oui Unix/Linux Firefox .

Un petit aperçu

PNG

Personnaliser le squelette

Vous pouvez aisèment personnaliser ces squelettes en changeant les couleurs dans le fichier habillage.css, il suffit de faire un rechercher/remplacer sur ces couleurs :

- #FFFFFF : couleur de fond de la page
- black : couleur des bordures, du fond de l’entête du menu
- #cfcfcf : couleur de fond des blocs
- #f26522 : couleurs du titre du site, des liens et des textes de formulaires

images à modifier :
- coinrond.gif et coin.gif (arrondis du menu)
- degrade.gif (fond)
- pixtrans.png (fond transparent du menu déroulant)
- fondbarrehaut.png (fond de la barre de navigation)
- fondbarrehautsurvol.png (fond des liens survolés de la barre de navigation)
- fondbarre.png (fond du pied de page)

Téléchargement

Zip - 649.8 ko
Squelettes IENSP Standard 3.1

Répondre à cet article

  • Squelettes IENSP standard

    7 juin 2008 10:14, par Gédid

    Bonjour,

    J’ai rechargé entièrement SPIP et vos squelettes sur le site http://lesentimentalisme.org/ ,

    pourquoi si je veux charger les plugins j’obtiens une page blanche ? ce qui fait que dans la zone privée il n’y a pas de plugins dans la configuration.

    Le calendrier ne s’affiche plus sur la première page du site.

    Par ailleurs l’accès restreint fonctionne, pourquoi mystère.

    Je ne sais pas me servir du portfolio, donc je n’ai pas vérifié si Thickbox2 est en action.

    Répondre à ce message

    Retour au début des forums

  • Squelettes IENSP standard

    22 mai 2008 12:32, par Gédid

    Bonjour Stéphane, toutes mes félicitations pour vos squelettes, j’ai mis en place la version 2.2 sur le site http://lesentimentalisme.org, cela fonctionne très bien, la version 3.1 m’interesse pour l’Accès Restreint, j’ai par 2 fois supprimé les squelettes et plugins de la V2.2 et rechargé ceux de la V3.1 . A chaque fois cela me supprime toute affichage du site, je fais donc l’opération inverse et je retrouve l’affichage,

    quelle erreur je fais ?

    pensez-vous faire une version en multilingue ?

    merci par avance pour votre réponse, très cordialement .

    Répondre à ce message

    • Squelettes IENSP standard 27 mai 2008 19:11, par Gédid

      Bonjour Stéphane,

      j’ai trouvé l’erreur, je n’avais pas vidé le cache, c’est en installant le site en local que je me suis rendu compte du problème. Veuillez m’excuser de vous avoir fait perdre votre temps, encore bravo pour vos squelettes, cordialement, Gédid.

      Répondre à ce message

    Retour au début des forums

  • Squelettes IENSP standard

    18 février 2008 13:42, par Le Corbeau

    Petit détail sur la page 404, le fil d’ariane coupe le menu sinon, squelette sympa car il est simple dans son graphisme sans sacrifier les possibilités offertes.

    Répondre à ce message

    Retour au début des forums

  • Squelettes IENSP standard

    12 mars 2008 10:41, par DLV

    Bonjour,

    Félicitation pour votre squelette.

    Il est simple d’utilisation. Et j’ai réussi à modifier l’habillage à mon gout. Cela reste simple mais je suis novice donc pour l’instant j’y vais par petites touches.

    Toutefois j’ai besoin de vos lumières :
    - Le menu déroulant ne fonctionne pas : est-ce que parce que j’utilise Explorer 6 ? Si c’est le cas, à votre avis dois je mettre à jour Explorer7 ou bien prendre Firefox ?

    - Je souhaiterais lorsque j’ai un seul article dans un rubrique que la rubrique pointe directement sur l’article et l’affiche. J’ai trouvé des exemples de boucles (tester s’il y a plus d’un article, puis tester s’il n’y en a qu’un) mais je suis incapable de les faire fonctionner : j’ai beaucoup de mal avec les boucles à mettre les unes dans les autres.. l’affichage d’1 article unique fonctionne (mais dans la partie contre-encart alors que je veux directement l’article) et les rubriques qui ont plusieurs articles affichent quand meme le premier article. Et en plus cela plante le navigateur 1 fois sur 2. J’ai donc supprimer ces tests. Je galère ....

    Avez vous fait quelquechose à ce sujet ?

    - Pour les articles qui se suivent, j’ai utilisé le lien (->art). Mais j’aimerais y associer une image de flèche : comment faire ?

    Merci de vos réponses.

    Danièle

    Répondre à ce message

    • Squelettes IENSP standard 12 mars 2008 17:34, par Stéphane

      Bonjour,

      Merci pour tes appréciations sur les squelettes.

      Effectivement, le menu déroulant ne fonctionne pas avec IE 6, par contre, il fonctionne avec IE7, Firefox, Opera, Safari,...

      Pour la deuxième question, je pense que c’est possible, mais je n’ai jamais testé, je vais essayé et je te tiens au courant.

      Pour la troisième question, le plus simple me semble de faire une insertion de l’image de flèche en html : <HTML><img src="chemin-de-ton-image" /></HTML>

      @+

      STéphane

      Répondre à ce message

    Retour au début des forums

  • Squelettes IENSP standard

    25 février 2008 11:24, par arnaud Harbonnier

    Bonjour Stéphane,

    mon site touche presque à sa fin http://valarep.free.fr ou http://www.valarep.com et bientôt http://www.valarep.fr

    je me pose aujourd’hui le problème du référencement ... aurais-tu des éléments là-dessus ... j’ai vu beaucoup de choses sur le net mais qu’en est-il quant au référencement de sites réalisés sous spip ?

    J’aimerais aussi que des visiteurs’inscrivent pour avoir le droit de télécharger des documents ... si tu as une idée ...

    Merci d’avance

    @rno

    Répondre à ce message

    • Squelettes IENSP standard 26 février 2008 10:28, par stéphane

      Bonjour, Pour ce qui est du référencement, je n’y connais pas grand chose, mais je sais que mes sites sous SPIP sont parfaitement référencés sans que j’ai eu besoin de quoi que ce soit... d’ailleurs si tu tapes VALAREP dans google, tu es en 1ere page...

      Pour que des visiteurs s’inscrivent pour avoir le droit de télécharger des documents, il faudrait que tu rajoutes un lien "s’inscrire" dans le pied de page (squelettes/inc-pied.html) avec ce code :

      <a href="#URL_PAGE{spip_inscription,focus=nom_inscription}&mode=(#URL_SITE_SPIP|tester_config{mode_inscription})" target="spip_pass" onclick="javascript:window.open(this.href, 'spip_pass', 'scrollbars=yes, resizable=yes, width=480, height=400'); return false;"><:login_sinscrire:></a>

      Ensuite, il faudra mettre la rubrique téléchargement en accès restreint (en activant le plugin acces_restreint dans l’espace privé et en créant une zone restreinte comprenant ta rubrique téléchargement). Par contre, il te faudra autoriser les visiteurs à y accèder au fur et à mesure qu’ils s’inscrivent...

      @ bientôt Stéphane

      Répondre à ce message

    Retour au début des forums

  • Squelettes IENSP standard

    19 février 2008 14:20, par alia

    Suite à la mise en place du squelette sur mon site, j’ai un grand chamboulement de l’interface privée. Et même en revenant à mon squelette précédent, rien à faire, tout est modifié. Je me retrouve un peu prise au dépourvu, ne sachant trop comment intervenir.

    Merci d’un peu d’aide...

    Répondre à ce message

    • Squelettes IENSP standard 19 février 2008 15:40, par stephane

      A priori, rien à voir avec les squelettes qui ne modifient que l’espace public... Le mieux est sans doute de réinstaller SPIP avec le fichier spip_loader.php que tu trouves sur spip.net

      Répondre à ce message

      • Squelettes IENSP standard 19 février 2008 17:45, par alia

        Effectivement, cela fonctionne maintenant ! J’avais dut faire une erreur en manipulant les fichiers. En tout cas, tous mes remerciements pour ce squelette qui est facile à personnaliser et trés fonctionnel. Merci aussi pour votre réactivité aux questions posées !

        Répondre à ce message

    Retour au début des forums

  • Je comprends pas tout :)

    18 février 2008 18:55, par pioz

    bonjour voila je voudrais adapter le menu au couleur de mon site (en developpement grace a zazouminiserver, spip, et iensp) mais j’ai beau changer dans tout les sens la présentation, cela reste hermetique à mon neurone du coup je pousse un cri : HHHHHEEEELLLPPPPP !!!!!

    Donc pourrais-tu fournir une explication sur le menu déroulant ou une piste pour les couleurs (je voudrais que le hover du level 2 soit de la couleur du level1 alors que le level1 redevienne normal)

    merci par avance des pistes

    Répondre à ce message

    • Je comprends pas tout :) 18 février 2008 19:57, par Stéphane

      Ca m’aiderai beaucoup à t’aider si tu me donnais l’adresse de ton site que je puisse regarder ce que ça donne et les modifs que tu as déjà faites dans la feuille de style...

      Répondre à ce message

    Retour au début des forums

  • Squelettes IENSP standard

    1er février 2008 05:40, par Ben’O’Laos

    Bonjour Stephan,

    Une autre petite amélioration à réaliser pourrait être l’apposition des logos des articles et rubriques lors de l’affichage. Qu’en penses-tu ? Bonne continuation

    Répondre à ce message

    • Squelettes IENSP standard 1er février 2008 17:49, par Stéphane

      Salut, Le logo des articles et des rubriques apparaît quand tu es dans une page rubrique ou article, où souhaiterais-tu qu’il apparaisse ? dans la page d’accueil ?

      Répondre à ce message

      • Squelettes IENSP standard 5 février 2008 06:23

        Ecoute moi je n’ai pas d’affichage de logo, sur aucune page. Ni sommaire ni rubrique ni article... Alors que c’est souvent joli un petit logo qui change à chaque page !! Désolé pour la lenteur de cette réponse... long WE !!

        Répondre à ce message

        • Squelettes IENSP standard 5 février 2008 09:11, par Stéphane

          Peux-tu me donner l’adresse de ton site ? Je regarderai ce qui bug...

          @+

          Répondre à ce message

          • Squelettes IENSP standard 5 février 2008 09:23, par Stéphane

            Je crois que j’ai trouvé : remplace les lignes 45 à 50 du fichier squelettes/article.html par ce code :

            #DEBUT_SURLIGNE
                     [(#LOGO_ARTICLE||image_reduire{200,200})]
                     [<p class="#EDIT{surtitre} surtitre">(#SURTITRE)</p>]
                     <h1 class="#EDIT{titre} titre">#TITRE</h1>
                     [<p class="#EDIT{soustitre} soustitre">(#SOUSTITRE)</p>]
                     #FIN_SURLIGNE

            Tu devrais voir apparaître le logo dans les pages articles de ton site.

            @+

            Répondre à ce message

            • Squelettes IENSP standard 6 février 2008 05:40, par @rno

              Bonjour,

              J’ai lu quelque part qu’il existait effectivement des bugs avec firefox sous linux ...

              Après mon problème de calendrier qui m’avait amené à vous appeler au secours ... je me pose une question à propos du fichier habillage.css : j’aimerais comprendre à quoi correspond .page_photoalbum ...

              j’aimerais aussi avoir un tuyau sur un logiciel simple qui me permettrai de changer la couleur de coin.gif et coinrond.gif. Je c qu’on peux le faire avecphotoshop mais c usine à gaz merci d’avance

              Répondre à ce message

              • Squelettes IENSP standard 6 février 2008 15:52, par Stéphane

                Bonjour, pour Firefox sous linux, j’ai testé à l’école avec la version pour Edubuntu 6, ça fonctionne sans problème...

                En ce qui concerne la classe .page_photoalbum, elle ne sert plus à rien depuis que le portfolio fonctionne avec le plugin Thickbox2 - j’aurai dû d’ailleurs l’enlever... Par contre tu peux utiliser le fichier /plugins/thickbox2/thickbox.css pour modifier l’apparence du diaporama d’images...

                En ce qui concerne les fichiers coinrond.gif et coin.gif, j’utilise personnellement the GIMP qui a l’avantage d’être libre et gratuit (dispo pour win, mac et linux). Je le trouve assez commode. Il existe sûrement des logiciels plus simples (mais moins complets...), qui permettraient de changer facilement les couleurs mais je ne les connais pas...

                @+

                Répondre à ce message

                • Squelettes IENSP standard 9 février 2008 10:51

                  Bjr Stéphane,

                  merci pour tes réponses tjrs aussi rapides !!!

                  si ce n’est pas indiscret ... quand tu dis "à l’école" ... tu es prof ?

                  Quant à ton css :

                  peux tu me dire à quoi correspondent : .une et .signature

                  J’aimerais aussi savoir comment faire pour pallier les problèmes d’affichages liés aux résolutions d’écran,

                  Aussi j’aimerais savoir si tu as des astuces pour le référencement d’un site sous spip. J’ai adopté définitivement ton jeu de squelettes qui est nikel et convient parfaitement à mes attentes. J’essaye toutefois de l’adapter encore à mes besoins.

                  J’espère bientôt en réaliser un mieux que le tient !!! LOL ... dans dix ans peut-être...

                  j’aimerais aussi importer la base XML dans SQL serveur ... g regardé sur le net mais rien trouvé de très abordable pour un néophyte comme moi mais je ne v pas lacher l’affaire si tu as des tuyaux là-dessus je suis preneur

                  Merci pour tout ...

                  Et encore félicitations pour ton travail ...

                  @rno

                  PS : voici mon site qui est en travaux ... je suis surtout dans l’architecture et le design ... les couleurs sont appelées à changer

                  http://valarep.free.fr

                  Tous commentaires même négatifs sont bienvenue

                  Je vais essayer de travailler sur un roll-over sur 4 niveaux - j’espère m’en sortir seul comme un grand ... BON WEEK

                  Répondre à ce message

                  • Squelettes IENSP standard 10 février 2008 14:05, par Stéphane

                    Bonjour, Effectivement, je suis instit, même si depuis cette année je n’ai plus d’élèves ayant comme fonction coordonnateur de zone d’éducation prioritaire.

                    Pour ce qui est de la feuille de style css, .une est une classe qui ne sert plus dans cette version du squelette (tu peux virer...) par contre #signature sert à l’habillage des signatures de la pétition que tu peux associer à un article.

                    En ce qui concerne l’affichage, les squelettes sont prévus pour que tous les éléments soient proportionnels à la taille de police. L’affichage par défaut permet de voir toute la largeur du site en 800x600, mais en grandissant la taille de la Police un utilisateur grossit donc tous les éléments du site et peut donc l’adapter à son écran.

                    Pour ce qui est de ton site, je vois que tu as su le personnaliser avec beaucoup de talent en te plongeant dans le fichier habillage.css, j’en suis heureux car j’ai en partie publié ces squelettes pour donner envie aux gens de se plonger dans le CSS.

                    Pour ce qui est de d’XML et SQL, là ça sort carrément de mes compétences...

                    Bon courage pour terminer ton site

                    @ bientôt

                    Stéphane

                    Répondre à ce message

                    • Squelettes IENSP standard 12 février 2008 06:33, par arnaud Harbonnier

                      Bjt Stéphane,

                      Ok pour le fait que tu es instit ... moi je bosse dns un centre de formation de valenciennes en tant que formateur et administrateur réseau. J’interviens aussi dans l’administration (côté serveurs) dans un lycée. Par ailleurs je suis en formation moi-même depuis environ 4 ans (reprise détudes à 34 ans) : j’ai cumulé diplôme de technicien de maintenance info et réseau et MCSA microsoft et là je termine tech sup Info et réseaux)

                      En ce qui concerne le xml je viens de comprendre qu’il sert juste au transport des données et que la base de donnée (mysql) peut être managée depuis le sql.free.fr. dc pas besoin d’un sql serveur ...

                      Merci pour tes compliments sur mon css ... j’y ai effectivement passé beaucoup de temps depuis 2 mois ... je suis tombé dedans ... dur dur de décrocher !!! j’ai aussi refilé le virus au patenel qui a aussi adopté ton jeu de squelettes (http://fe6hhcrene.free.fr) et à un collègue de travail (http://sosemploidutemps.free.f).

                      J’aimerais aujourd’hui pouvoir mettre à disposition des cv de stagiares aux employeurs .... mais je voudrais que ces derniers s’inscrivent au préalable sur ma page sommaire. J’ai vu pas mal de plugins ... dw2, accés restreint, inscription2 etc Pourrais-tu me conseiller ?

                      J’aimerais aussi obtenir des infos ou des astuces pour que mon site soit bien côté dans google (référencement)

                      Merci encore et @ bientôt

                      @rno

                      Répondre à ce message

            • Squelettes IENSP standard 7 février 2008 18:06

              Salut Stephane,

              Ecoute désolé. Le logo que j’avais tout simplement mis sur m’article s’était envolé. D’où... pas d’affichage. Encore désolé pour le déplacement ! Les logos focntionnent très bien !!

              Répondre à ce message

    Retour au début des forums

  • Les META TAGS

    7 février 2008 18:23, par Ben’O’Laos

    Bonjour Stephane,

    au risque peut-être de me tromper, mais le fichier inc-head.html me semble pas assez fourni en détails... Exemple trouvé sur d’autres squelettes :

    ...meta http-equiv="Content-Language" content="fr-fr" /> ou autre... ...meta name="keywords" content="[(#CHAPO|supprimer_tags|texte_script)]...BOUCLE_metadocs(DOCUMENTS)id_article",">[(#TITRE|supprimer_tags|texte_script)]"/> ...meta name="author" content="...BOUCLE_author(AUTEURS)id_article",">#NOM"/> ...meta name="revisit-after" content="15 days" />

    Et peut-être d’autres. Je ne suis pas pro dans ces trucs là, mais ça aide certainement lors de l’indexation de certains moteurs de recherche...

    Pour l’adresse du site que je développe (et en réponse à la question que tu me posais la dernière fois), il est pour l’instant en développement en local. J’attends d’avoir quelque chose qui tient la route avant de le mettre en ligne... Mais pour l’instant, ça se présente bien...

    Bravo encore pour le squelette et pour ta disponibilité. BS

    Répondre à ce message

    Retour au début des forums

  • Une amélioration

    28 janvier 2008 05:16, par Ben’O’Laos

    Bonjour,

    pour le menu de recherche, il faudrait vraiment incorporer le OK de validation que beaucoup attendent à la fin d’un formulaire (c’est le cas de ma maman !). Un petit OK à la fin du formulaire de recherche, qu’en pensez-vous ?

    J’ai essayé personnellement de le rajouter, mais n’étant pas fortiche en code PHP et a fortiori en SPIP, je cale.

    En tout cas chapeau aux GD (gentils développeurs) qui ont réalisé ce bien bel outil IENSP. Bonne continuation à toute l’équipe.

    Ben

    Répondre à ce message

    Retour au début des forums

0 | 25



Suivre la vie du site RSS 2.0 | Plan du site | Espace privé | Charte et vie SPIP-Contrib | SPIP | L'autre.net