spip

Squelette de davduf.net

Par David Dufresne, 17 mars 2003 | 33929 Lectures

Davduf.net tourne sous le moteur Spip (un CMS francophone, gratuit et open source) et son squelette graphique est directement inspiré de Adoc, lui même inspiré de www.bluerobot.com.

Volontairement minimaliste, ce squelette est léger et rapide.
Volontairement minimaliste, ce squelette est léger et rapide.

Le squelette en tant que tel était disponible sur http://www.glums.com

Comme l’écrit Karim B. (l’homme qui a adapté/écrit le squelette), sur son site :

« Squelette de test css s’inspirant du weblog de www.bluerobot.com. J’ai gardé les visuels mais tout à été remonté entièrement html et css ajouter un agenda d’article mois par mois d’après le script de Stephane http://www.metacites.net/ pour recevoir les données de la base ce n’est pas simple copie de site. (of course) je vous invite à aller sur le site de bluerobot qui met à disposition d’autres gabarits css http://www.bluerobot.com/web/layouts/ ».

Pour ma part, j’ai fait quelques modifs de css, de styles et de pages.

Merci à Arno*, Antoine, Phil, Karim et BlueRobot. Sans eux, rien de tout ça.

ABONNEZ VOUS AU BULLETIN ALÉATOIRE SOUS PLI DISCRET

Messages

  • A mon tour de présenter l’adaption des squelettes ADOC : http://www.sauterelle.net Il s’agit d’un soft familial et j’ai très peu retouché les squelettes. Je ne déséspère pas m’y mettre plus sérieusement, mais mon plus grand problème reste l’intégration des brèves. Si qqn a une suggestion...

    Voir en ligne : Site familial SAUTERELLE

    • Bravo pour le site, Pierre.

      En ce qui concerne les brèves, en fait, il faut créer le fichier breve.html car celui fourni d’origine reprend le squelette breve par défaut.

      j’ai créé le mien, en tachant de respecter la charte graphique de karim : http://www.davduf.net/breve.html

      Un simple copier-coller devrait ensuite faire l’affaire ,-)

      Voir en ligne : http://www.davduf.net/breve.html

    • Merci déja.

      Ben OK pour les brèves... D’ailleurs j’ai déja fait... Me reste plus qu’à refaire les squelettes des articles, rubriques et sommaire pour que les brèves apparaissent.

      Voir en ligne : SAUTERELLE.NET

    • Ben, une nuit d’insomnies fructueuse : j’ai ajouté brèves mais aussi liens vers les sites web dans les rubriques sur le squelette ADOC. Je me suis inspiré de DAVDUF en me concentrant sur des contenus génériques (très peu de liens internes au site)... Bref si qqn veut le squelette complet, qu’il n’hésite pas :)

      Voir en ligne : http://www.sauterelle.net

  • je suis en train de readapter visuellement (texte specifique à davduf)le fichier breve que tu mets a dispo sur ton site..

    Un truc que j’arrive pas à percuter : comment se fait-il que ouverte dans son contexte, la page s’affiche avec un environnement visuel, et que la meme page sortie de la racine du site n’affiche que les boucles ??

    Sinon, quel éditeur utilises-tu pour modifier tes pages, et quels problemes tu as pu rencontrer ?

    merci,

    Voir en ligne : http://ardeche-nord.paspareil.net

    • > Un truc que j’arrive pas à percuter : comment se fait-il que ouverte dans son contexte, la page s’affiche avec un environnement visuel, et que la meme page sortie de la racine du site n’affiche que les boucles ? ?

      C’est la particularité de Spip. L’appel direct aux pages html (ex breve.html) donne le squelette lui même. l’appel de cette page via sa page php (ex : breve.php3) permet d’afficher la page en résultat concret. Cf le manuel de Spip pour plus d’infos.

      Sinon, question logiciel de mise en page : Dreamwevaver.

      A bientot, bon courage !

    • Salut Davduf,

      Ben voila, je te tiens au courant du site que je réalise avec spip, et avec le squelette de Karim ;

      c’est ici : http://ardeche-nord.paspareil.net

      c’est un site d’info sur l’ardeche du nord et des alentours.. J’ai galéré à bidouiller le css au début mais on se repere pas trop mal au bour d’un moment.. J’ai encore quelques détails à peaufiner, dans le genre pieds de pages (mentionner spip etc..), le bandeau en haut, quelques boucles à faire apparaitre... Mais on va y aller petit a petit..

      N’hésites pas à formuler des critiques et observations, ya pas de problemes..

      Sinon je cherche des infos pour insérer un agenda sous spip, ou tout du moins créer un rubrique dans laquelle les articles pourraient etre classées par ordre de date d’evenement (les titres des articles seraient les dates elles memes) ;

      Sinon, j’arives pas du tout à faire apparaitre mes fils d’info syndiquées sur le site public.. ca apparait dans l’espace de redac, mais pas sur le site...

      Mise en page ; Dreamweaver vire les balises qu’il comprends pas.. pour de simples modifs, je trouve golive pas mal..

      Voili voilou..

      ben encore merci et a ++

      Voir en ligne : Ardeche-nord.paspareil.net

  • Bonjour,

    J’utilise également ce squelette que j’ai déjà bien modifié. Je rencontre un souci esthetique et mes compétences en la matière sont très limités... Je n’arrive pas à trouver l’origine du problème de « déformation » du calendrier.

    Vous l’aurez remarquer lorsqu’on fait un « mouse over » d’une case du calendrier associer à un évènement, il y a une sorte de déformation de la colonne.

    Strange.

    Boris

    Voir en ligne : KMY

    • Bon en fait en creusant un peu (je l’avoue) j’ai trouvé mon bonheur.
      Il faut modifier la feuille de style Calendrier.css :
      #calendrier a:hover
      color : #000066 ;
      text-decoration : none ;
      /* font-weight : bold ; /*

      et mettre en commentaire le font-weight.

      Hope this help

      Voir en ligne : KMY

  • Bonjour,

    je viens moi aussi de tester ce beau squelette, mais j’ai manifestement un souci : je ne vois pas apparaitre les fichiers que j’avais attaché à mes articles (gifs, pdf...) !!! Y-a-t’il une manip à réaliser que j’aurai oubliée ? Merci de vos réponses.

    Maxime

    Voir en ligne : http://www.startx.info

    • Il faut ajouter les boucles pour les documents joints là où tu veux qu’ils apparaissent...

      Exemple :

      < BOUCLE_documents( DOCUMENTS ){ id_article }{ par titre }{ mode=document }{ doublons } >
                      [(#LOGO_DOCUMENT|#URL_DOCUMENT)]  
                      < a href="#URL_DOCUMENT" >[(#TITRE|majuscules)]< /a> 
                        [: (#DESCRIPTIF)]<br>
                        [(#TYPE_DOCUMENT) -] [(#TAILLE|taille_en_octets)][, (#LARGEUR) 
                        x #HAUTEUR pixels] 
                      < /BOUCLE_documents>
           
    • Hello

      merci pour ta réponse ! Mais dans quel fichier faut-il que je mette ce code ? Je l’ai trouvé dans les fichiers rubrique-dist.html et article-dist.html. Sont-ils lus ? ou bien faut-il insérer cette boucle ailleurs ?

      Maxime

    • Hello

      bon, RTFM et tout va mieux. J’ai inséré ta boucle dans article.html et ca roulez ! Nickel, j’ai mes fichiers attachés c’est parfait. Merci

      Maxime

      Voir en ligne : http://www.startx.info

  • Slt a tous,

    Bien moi je ne comprends rien a rien a la mise en place du squelette. D’un point de vue design pas de problemes mais pour le Developpement houla.... C pas faute d’avoir lu le manuel de SPIP et les divers forums. DOnc je viens a vous pour savoir si une personne aurait un peu de temps a me consacrer pour mettre en ligne ce magnifique squelette que je personaliserai par la suite. En échange je peux proposer mes connaissances sous photoshop et Photoimpact ou en photo. Pitié, ayez pitié d’un pauvre bougre qui a tout lu et essayé avant de vous déranger.

    Merci Mike

    • Les squelettes Spip sont du HTML pur AVEC un code propre à Spip, fait de balise. Pour commencer, prends le squelette de départ, déplace les balises et les boucles où tu veux, ajoute du html comme bon te semble et ca devrait aller. Si tu ne comprends pas les boucles le mieux est, dans un premier temps, de copier coller celles qui t’intéresse sur les différents sites Spipés...

      bon courage

      Voir en ligne : d’autres pistes de squelettes

    • bonjour, css ...tssssss je n’arrive pas à changer les couleurs du kit autrement c’es vrai que c’est bô hélène

  • Salut

    Le site d’Alerte aux déchets (nous combattons un projet de contsruction d’incinérateur) ressemble enfin à quelquechose grâce à ces merveilleux squelettes.

    Je les ai découverts grace à ce présent site que j’adore.

    Je n’oublie pas les autres.

    Donc DavDuf, merci et continue le bon boulot (je pense à DavDuf et Boomtachak et les portraits chez la belle Pascale).

    Paix & Amour

    Voir en ligne : Alerte aux dechets

  • Salut,

    je trouves ces squelettes trés beau et j’ai décidé de les utiliser sur un site (en test).

    Mais j’ai trois petits (j’espère) problèmes :

    J’adore l’idée d’état des stocks que je veux réutiliser sur le site. Je vois qu’il faut un fichier pied.html (là OK), et un fichier pied.php3. Et là je ne sais pas quoi inscrire dans ce dernier (ce qu’il doit contenir), ni si il faut faire des modifs à d’autres fichiers.

    Je veux sur ce site pouvoir utiliser la fonction pétition. Or avec cela, c’est l’ancien squelette (celui livré avec SPIP) qui apparait ; or je ne veux pas.Que faut -il donc faire pour régler cela ?

    Quand je sélectionne une date sur le calendrier, au lieu de voir apparaitre la nouvelle page (comme sur ce site), je me retrouve avec une page blanche et un Parse error. Qu’est-ce que j’ai fait de mal ?

    • pied.php3. = il faut juste qu’il renvoie vers pied.html (regardez n’importe quelle page .php3 qui renvoie vers une page, ex : login.php3, article.php3, breve.php3 et vous comprendrez. Ces fichiers .php3 servent juste à « router » vers les pages html

      pétition : je n’ai encore jamais utilisé les pétitions. Regardez dans les squelettes fournis par défaut, reprennez le la boucle te modifiez son affichage via du html...

      bonne chance !

    • Merci beaucoup pour ton aide. Pour la pétition, je tournais en rond, mais Karim B. m’a donné la solution. Un conseil, pensez toujours aux CSS ! ;-P Par contre sur mon site de test, le calendrier ne marche toujours pas (peut-être un problème avec la base, qui « peut-être »corrompue).

      J’espère en tous cas que cela ne sera pas le cas pour le site définitif consacré [MODE PUB ON]aux grévistes charentais de l’E.N. [MODE PUB OFF].

      Reste maintenant à implémenter un Agenda et un Forum : c’est qu’ils sont exigeants ces enseignants ! ^_^

      Voir en ligne : L’adresse du site des grévistes

  • Salut à tous !!

    D’abord merci d’utiliser les squelettes Adoc, j’espère vraiment qu’ils vous apportent une utilité certaine et une meilleure conpréhension de SPIP et de sa gestion des elements dans les pages qu’il génere. Je soumet ici juste une petite rectification concernant l’agenda.html, j’y ai apporter quelques petites modifs, notament en php, mais apparament certains d’entre vous rencontre des problème avec, bon mon meilleur conseil serait de revenir à la version initaile, disponible de nouveau sur glums.com http://www.glums.com/serveur/spip/squelette/article.php3?id_article=82&recalcul=oui

    @ plus

    Karim Belkacem

  • Salut Davduf et les autres...

    voila, je rencontre un probleme avec le squelette lorsque je suis en local, sous easyphp, probleme que je rencontrais pas qques temps auparavents, mais je ne vois plus depuis quand et quelle manip’ ca bugg...

    En page sommaire, en local donc, en lieu et place du petit calendrier apparait la mention : « Erreur : filtre « calendrier » non défini »

    il s’agit des memes fichiers sommaire.html/.php et des memes css en local et en ligne.

    Voilou, si qqun-e a une piste, je la/le remercie...

    merci à tous-tes, à bientot..

    Voir en ligne : Ardeche-nord.paspareil.net

  • Tout d’abord un grand bravo à ce superbe Squelette très esthétique ! Il semble que le squelette d’origine a un décalage dans les Titres de Rubriques dans la colonne de droite : on peut voir la 1ère lettre des titres de Rubriques « mangées » par une colonne non visible...

    Pour que ça soit plus clair, voici le problème que je rencontre en image :

    http://perso.wanadoo.fr/sebastien.hommais/problemes/SPIP_F_nonvisible.png

    J’ai regardé dans les « .css » (car il semble que cela puisse se modifier là, mais dans laquelle feuille de style ? et quelle ligne ? et le remplacer par quoi ?

    Merci pour votre aide.

    Bien sympathiquement,

    Voir en ligne : Capture d’écran du problème de colonne.

    • J’avais le même probleme... mais je ne sais plus trop comment je l’ai résolu...

      regarde dans les .css, et cherche les menu_item ou quelquechose_navigation, ajoute alors un poil de marge et ca devrait aller...

      Dis nous

    • Merci pour ton aide : j’ai un peu avancé, mais je suis encore face à un petit problème :

      J’ai trouver entre les ligne 59 à 68 dans le dossier « /spip/css/habillage.css » ceci :

      .menu-item margin : 0px ; padding-left : 4px ; padding-right : 4px ; padding-top : 1px ; padding-bottom : 1px ; font-size : 10px ; text-align : left ;

      J’ai modifier ceci en cela :

      .menu-item margin : 5px ; padding-left : 4px ; padding-right : 10px ; padding-top : 1px ; padding-bottom : 1px ; font-size : 10px ; text-align : left ;

      mais cela ne fait rien du tout :-(

      J’ai fait la même modification dans le fichier « /spip/habillage.css » (dans les même lignes) :

      et ça n’a fait aucune modification...

      J’ai pourtant enregistrer le fichier et je l’ai mis à jour sur le serveur...j’ai fait « Recalculer la page »...mais ça ne fait rien du tout...

      Un détail doit m’échapper...Si quelqu’un avait une idée...

    • Les .css ont cette aprticularité que le simple recalcul de page ne suffit apas. Pour bien prendre en compte les changemenst dans els .css, tu dois également vider ton cache...

      Bonne chance !

    • Bon...même vider le cache ne fait aucune modif dans les fichier habillage.css du dossier /css ou de la racine... J’ai essayé d’autres fichiers, mais je n’ai pas trouvé le fameux fichier « menu »...

      Je désespère...pourrais tu me donner le nom exact du fichier *.css dans lequel il faut apporter une modification ?

  • Bonjour.

    Comment augmenter le nombre d’articles récents à faire figurer sur le sommaire.... J’en ai que deux.... dans sommaire.html ou .php dois-je chercher ?

    Meeeeeerci à vous et bravo...

    Voir en ligne : SAUTERELLE.NET

    • Il te faut retrouver cette boucle ou, du moins, la boucle des articles récents. Ce doit être quelque chose comme :

      <BOUCLE_article_un(ARTICLES) {par date} {inverse} {0,3}>
      
      {par date} 

      signifie qu’on classe par date

       {inverse} 

      signifie qu’on classe en sens inverse (du plus récent au plus vieux)

      Ce qui t’importe, ce sont les chiffres à la fin. {0,3}

      0 signifie démarre à partir de 0 3 signifie « prend les trois articles »

      En clair, si tu veux dix derneirs articles, tu mets : {0,10}

      bonne chance

  • Bonjour, comment généré du pdf diurectement ?

    Cordialement Robin

    Voir en ligne : revue des ressources

  • J’ai utilisé le squelette de Karm B. pour un site famillial.

    J’ai gardé l’agencement général mais modifié les couleurs au travers des fichiers .css dans un éditeur web. Après un peu de travail et beaucoup de patience. J’ai très peu modifié les fichiers .htlm, à part quelques commandes SPIP par ci par là...

    J’ai déjà fait une petite mise à jour modifiant quelques bugs et ajouté un filtre antispam pour les visiteurs qui laissent leur adresse e-mail (permis par la version 1.6 de SPIP).

    J’ai également ajouté une page « Brèves » en reprenant le squelette des « Articles »... Cependant un bug demeurre pour avoir la version imprimable des « Brèves » : J’ai repris le squelette « imprimer » que j’ai renommer en « imprimer-brève » (et son fichier php qui l’accompagne). J’ai modifié le lien dans le fichier « Brève », mais SPIP m’affiche qu’aucun article n’existe à l’adresse quand je clique sur le logo de l’imprimante, malgrè mes modifications.

    Voir en ligne : Le bulletin de Serdinya

  • glums.com ne répond plus. Ou puis-je trouver le squelette Adoc ? Merci !

spip-o-mania

Squelettes Spip : l’annuaire des outils disponibles

En route !