SPIP - Contrib

SPIP - Contrib

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

55 visiteurs en ce moment

fontsizeup fontsizedown
[27 commentaires]

Squelette Sandwater

mardi 25 décembre 2007, par klelugi

  • Digg
  • Del.icio.us
  • Facebook
  • Google
  • Technorati
1 vote

Le squelette Sandwater est un squelette de type généraliste qui propose une navigation par onglets ainsi qu’une présentation sur 3 colonnes. La navigation se trouve dans les colonnes centrale et de droite, cette dernière permettant essentiellement la participation des visiteurs.

Ca fait déjà un petit moment que j’utilise SPIP avec plaisir et je voulais apporter ma petite pierre à l’édifice. Je me suis donc fait plaisir à créer ce squelette et j’espère qu’il pourra vous être utile pour certains de vos projets.

- Valide et testé sur : SPIP 1.9.2 c
- Auteur : Gilles TRAN
- Licence : GPL
- Utilisation : Débutant, Intermédiaire
- Surcharge Core : fichier Extra (Il n’est néanmoins pas obligatoire de valider le plugin Champs homonymes et son extension)

Ce squelette est axé sur 3 colonnes et comprend :

- Une navigation par onglets (horizontale)
- Une navigation et des encarts pour une participation des visiteurs en colonne de droite
- Les contenus (textes) en colonne de gauche
- Une navigation croisée en colonne centrale

En voici une capture d’écran :

Pour permettre son utilisation voici les plugins qui y ont été ajouté :

- Champs homonymes + extension, le champ homonymes permet la gestion des titres des onglets
- Notation des articles
- Thickbox2

Notation et Thickbox2 permettent d’ajouter des fonctionnalités agréables à la présentation des articles.

J’espère pouvoir ajouter d’autres plugins bientôt et faire évoluer ce squelette avec le temps.

Ce squelette nécessite l’ajout de mots-clés pour la gestion de l’apparition de certains contenus dans les pages. Voici ce qu’il faut faire :

Configuration :

Après avoir uploadé les fichiers et validé les plugins il vous faudra créer un nouveau groupe de mots-clés. Nommez le : « mise en page » et créez dedans les 3 mots clés suivants : « alaune », « onglet » et « unerubrique ».

Gérez vos onglets :

Pour ajouter un onglet à la navigation, il vous suffit d’ajouter le mot-clé à la rubrique de votre choix. Si votre titre de rubrique est trop long, ce qui risque souvent d’être le cas, éditez votre rubrique et utilisez le champs : « Nom court pour navigation » disponible en bas du formulaire de modification de rubrique (Il va de soit que si votre rubrique est vide, l’onglet n’apparaitra pas).

Affichez votre "une" :

Pour afficher le petit encart bleu dans la colonne centrale sur votre page d’accueil : pour cela ajoutez le mot-clé « alaune » à une brève, un article ou un site.

Affichez aussi une « une » par rubrique

C’est le même fonctionnement que pour la une de la page d’accueil, ajouter ici le mot-clé « unerubrique » à une brève, un article ou un site.

Caractéristiques techniques :

Ce squelette utilise des fonctionnalités javascript fournies par la librairie jQuery, installée en standard sur SPIP, un choix judicieux grâce auquel on peux se permettre de bénéficier de fonctionnalités simples, efficaces et en perpétuelle évolution des plugins proposés sur jquery et dont certaines extensions sont intégrées au squelette dont notamment :

- jQuery Corners dont le plugin initial a été créé par Dave Methvin
- un menu vertical inspiré du plugin Accordion
- une galerie Thickbox pour la gestion des images d’articles (portfolio Spip article)

Pour les graphistes avertis et patient vous pouvez éventuellement changer les codes couleurs pour adapter le squelette à vos besoins.

L’interface graphique tourne autour de 7 couleurs dont 5 beiges et 2 bleus (ainsi que blanc et noir) et quelques gifs/jpeg/png facilement modifiable.

Pour vous donner une idée d’un autre thème possible autour de ce jeu de squelette vous pouvez aussi visualiser le thème : Gazonrose encore en cours de développement.

Voir en ligne : Voir en ligne

Retour en haut de la page

27 Messages de forum

Voir toute la discussion

Pages 1 | 2 | 3

  • Répondre à ce message

    22 septembre 02:27

    Je suis en train d’utiliser cet squelette, mais on peut pas afficher les mots-clé (c’est super important pour notre site). Comment faire ?

  • Répondre à ce message

    22 août 16:16

    bonjour, je vous remercie pour votre squelette que je trouve très beau et que j’utilise avec plaisir. tout se passe bien, je n’ai aucun problème. néanmoins j’aurais 2 questions :
    - lorsque j’écris un article, je remplis le champ "descriptif rapide". or ce descriptif rapide n’apparaît nul part (pas non plus dans la recherche, rien). est-ce normal ? aurais-je loupé une étape ? j’ai pourtant bien tout activé.
    - j’ai changé la bannière (fd_header.gif) par une image d’une autre couleur. or la zone cliquable de chaque onglet est un rectangle de couleur beige, qui apparaît lorsqu’on change la bannière (beige) d’origine et qui ne fait pas très beau. est-il possible de rendre ces rectangles transparents ? plus petits ? arrondis ?

    je vous remercie pour votre squelette et vos réponses.

  • Répondre à ce message

    20 août 17:03 , par herve

    Bonjour,

    Merci pour ce site, ainsi que les squelettes... je débute avec SPIP et je suis en train de réaliser ce site : http://www.duffyducks.com/spip

    j’aimerais savoir comment je peux faire pour : 1- Tout mettre sur une seule colonne (alaune en bleu en tête de colonne, et la suite dessous) 2-Modifier la largeur de colonne pour prendre toute la largeur restante 3-Suppression de "Les derniers sites" ou déplacement en dessous des menus de droite

    dernier point : pour faire référence à l’auteur de ce squelletes, je vais rajouter une rubrique "mentions légales" avec un lien vers squelletes.com afin de remplacer ce que j’ai supprimé dans pied.html

    Merci d’avance pour les réponses

  • Répondre à ce message

    11 août 08:02 , par klelugi

    Salut,

    Le menu est malheureusement codé d’une façon qui ne permet pas d’avoir des angles transparents.

    Néanmoins, je crois qu’il est possible de faire des changements mineurs pour y parvenir, il me semble que suivre le tutoriel sur les portes coulissantes pourrait t’apporter une réponse.

    Bon courage

  • Répondre à ce message

    31 juillet 20:46

    Bonjour, Superbe travail ! Et quelle accessibilté ! Bravo et Merci ! Néanmoins, j’ai besoin d’un peu d’aide car je ne parviens pas à rendre le menu par onglet transparent. Les onglets sont encadrés, par dessus la photo de fond, par un cadre beige rectangulaire ! Est-il possible de rendre ce cadre de fond beige transparent ? Si oui comment :-) ? Merci encore pour la qualité de votre travail !

  • Répondre à ce message

    4 juillet 15:18 , par klelugi

    Salut,

    Le probleme vient du fait que tu ajoutes une div avec la classe "cadre" que tu as d’ailleurs définie dans la page html elle-même, cette class à une largeur de div fixée à 500px d’ou ton problème.

    Il n’est pas nécessaire de faire une div class="cadre" pour obtenir des coins arrondis, il te suffit de rajouter une ligne dans le fichier :

    /squelettes/js/ready.js

    en l’occurence ici :

    $(’.cadre’).corner() ;

    devrait convenir si tu supprimes le style dans le corps de page :

    .cadre {
                    /*border: 1px #000000 solid;*/
                    background-color:#FFFFFF;
                    text-align: justify;
                    width:500px;
                    padding: 10px;
                    margin-left: auto;
                    margin-right: auto;
                    margin-bottom: 10px;
                    -moz-border-radius: 6px;
                    border-radius: 6px;
            }
  • Répondre à ce message

    4 juillet 14:58 , par Laure

    Hello !!!

    Je viens d’installer SPip List sur Sandwater, le probleme, c’est que le bloq est beaucoup plus grand que l’espace qui lui est attribué ! Conclusion, selon les écrans, soit je doit faire défiler ma page à l’horizontale, soit ca renvoit tout en bas, mais dans tout les cas ma mise en page part dans tout les sens ! (cf : http://grains.de.sel.free.fr )

    J’ai testé dans plusieurs page du squelette et du pluggins de modifier la largeur du bloc, mais ça n’y fait rien ! Quelqu’un d’autre a t-il eu ce problème ? Quelqu’un a-t-il une solution ?

    Merci d’avance !

    Laure

  • Répondre à ce message

    4 juillet 14:57 , par Laure

    Hello !!!

    Je viens d’installer SPip List sur Sandwater, le probleme, c’est que le bloq est beaucoup plus grand que l’espace qui lui est attribué ! Conclusion, selon les écrans, soit je doit faire défiler ma page à l’horizontale, soit ca renvoit tout en bas, mais dans tout les cas ma mise en page part dans tout les sens ! (cf : http://grains.de.sel.free.fr )

    J’ai testé dans plusieurs page du squelette et du pluggins de modifier la largeur du bloc, mais ça n’y fait rien ! Quelqu’un d’autre a t-il eu ce problème ? Quelqu’un a-t-il une solution ?

    Merci d’avance !

    Laure

  • Répondre à ce message

    18 juin 10:46 , par gérard

    Bonjour,

    Premièrement BRAVO ! Secundo : une petite question. je suis en train de l’installer dans une école primaire. Les élèves m’ont fait part de leurs remarques après utilisation. Il mentionne que lorsqu’ils insèrent une image dans le châpo de l’article elle apparait bien lorsque l’on clique sur l’article en question. Par contre, elle n’est pas présente lorsqu’on met cet article à la UNE ou même dans la page d’accueil. Seul le chapô apparaît mais sans l’image. Y-a-t-il une solution pour faire apparaître l’image avec le châpo tout le temps, même lorsqu’il est visible dans les parties "liste des derniers articles parus’ ou "autres artiles récents", etc.... merci gérard

  • Répondre à ce message

    13 juin 17:20 , par R59

    Cela fonctionne-t-il avec un autre plugin de liste de diffusion comme CleverMail pour SPIP ?

Pages 1 | 2 | 3

Répondre à cet article

Retour en haut de la page

Ça discute par ici

SPIP | Squelette | | Plan du site | Suivre la vie du site RSS 2.0