mercredi 2 octobre 2002, par WebGenerAction (copID)

Ne confondez pas SPIPSUD (le squelette) et SITESUD (le site complet).

Voir des exemples : Look après installation (sauf menus de tests) Une des options de look : SpipAge

Télécharger SPIPSUD-1 (567 Ko)

NOUVEAU au 24 novembre : Fichier d'installation automatique téléchargez opensud.doc, renommez-le en opensud.php3 et mettez-le à la racine de votre site spip, puis allez à l'adresse http://.../opensud.php3. Tous les fichiers s'installeront automatiquement et vous n'aurez plus qu'à vider le cache. Attention, supprimez ensuite ce fichier de votre site !

INSTALLATION

 Installer un site SPIP standard (version 1.4 ou plus pour bénéficier par défaut de toutes les fonctions).
 Dézipper le fichier spipsud-1.zip
 Transférer tout le CONTENU du dossier SPIPSUD-1 à la racine (spip) FTP du site.
 Vider le cache du site (Lancer une nouvelle fenêtre du navigateur si tout ne change pas).

 Renommer dans le FTP les fichiers css puis html et les images pour observer les options de style et de forme et choisir votre look préféré. Vider le cache et insistez sur l'actualisation de page de votre navigateur après chaque changement.

 Personnalisez en particulier le fichier spipstyle.css. Pour aller plus loin modifiez les fichiers html, les autres fichiers .css et les logos vides à marquer.

CARACTERISTIQUES DU SQUELETTE SUD
Squelette Universel Démarrage.

 Changement immédiat du look du site après téléchargement.
 Changement du style ou de la forme par défaut par simple renommage de fichiers FTP.
 Changements radicaux du look plus faciles grâce aux explications dans les squelettes .html

 Aucun code d'image ou de lien à reconfigurer (pas de HTML à l'installation).
 Logos de navigations inclus (reprise de logos du site interne et ajoûts divers).
 Ajoût d'un forum sous chaque rubrique.
 Ouverture dans une nouvelle fenêtre des liens de messages, de sites référencés et des titres syndiqués.
 Visualisation de tout le site par rubriques (plan), mais aussi par auteurs ou par mots-clés (tous ou chacun).
 Page "Tous les sites" avec forum sous chaque site, et aussi "Un site par page" (même forum).
 Page Derniers messages et réactions (y compris forums de rubriques ou de sites).
 Page Messages et popularités des articles (resume.html)
 Séparation des documents images et son/video et autres sous les rubriques.
 Tableau de bord (nombre de messages, articles, brèves à la date de dernière mise à jour).

 Plusieurs jeux de fichiers à renommer pour changer d'entete-de-page--menu (hierachie.html), de pied-de-page-menu (pied.html), de corps de sommaire, etc.
 Plusieurs jeux de logos activés par simple renommage.

 Signalisation par < !-- xxx --> des blocs d'instructions, ce qui permet de supprimer ou modifier certains affichages : changer le nombre d'éléments d'une liste, changer un logo par renommage du lien (ou du fichier), choisir ses META de référencement moteurs, affecter un autre fichier de style .css à un fichier article ou breve ou rubrique ou autre, ou particulariser leur forme.

 Les codes des fichiers .html ont été mis en ordre selon la géographie de la page (TABLE/TR :rangée suivante/TD : colonne suivante), la fonction de chaque zone est indiquée.
 Toutes les dimensions WIDTH sont en % pour permettre au visiteur d'optimiser lui-même la largeur des colonnes.
 Presque toutes les SIZE sont en % pour permettre au visiteur d'optimiser lui-même la taille des caractères.
 Minimum de FONT dans les .html pour laisser un maximum de liberté au fichier feuille de style spipstyle.css (le _ a été supprimé)
 Il est recommandé de modifier un fichier html en modifiant sa source (clic-droit Afficher la source, modifier et enregistrer le texte, actualiser la page), et d'éviter les éditeurs HTML.

PERSONNALISEZ EN RENOMMANT LES FICHIERS HTML

 Pour activer telle ou telle option (fichiers html ou css ou images), il suffit de renommer des fichiers, même sans comprendre le fonctionnement. Quelques exemples suffisent pour comprendre le principe.

 pied1LOGOS10POINTS.html doit être renommé en pied.html pour activer le bas de page avec les 10 logos par defaut et une séparation par des points au lieu d'un trait.

 hierarchieTESTTOUSMENUS.html doit être renommé en hierarchie.html pour activer un haut de page contenant un triangle de menu dépliant à cliquer pour voir tous les menus, puis en choisir un dans les autres fichiers hierarchieXXX.html

 spipstyle3INVNUIT.css doit etre renommé en spipstyle.css pour activer un style de couleurs INVersées sur fond noir NUIT.

 Les fichiers rubriqueXXX.html peuvent être renommés en rubrique.html pour donner le look XXX à toutes les pages "rubrique" du site, ou ils peuvent être renommés en rubrique=yy.html si on veut donner ce look à la rubrique yy, ou également en rubrique-yy.html si on veut donner ce look à toutes les pages sous-rubrique de yy.

 Les fichiers articleXXX.html peuvent être renommés en article-xx.html où xx est le numéro de la rubrique dans laquelle on veut donner le look XXX aux articles, ou ils peuvent être renommés en article.html si on veut appliquer ce look à tous les articles du site.

 Le fichier article-XX.html fait appel au style article-xxsstyle.css

 Les fichiers article-BODYXXX.html contiennent les caracteristiques XXX et font appel au style article-bodystyle.css dans lequel sont neutralisées les commandes correspondant à ce style XXX.

 Les fichiers breveBODYXXX.html changent toutes les brèves du site (pas de tiret - pour particulariser comme dans les rubriques), et font appel au style brevebodystyle.css

 Un numéro 0 indique une copie du fichier actif à l'installation. Par exemple après une installation vous remarquerez que sommaire0CLASSIQUE.html et sommaire.html sont les mêmes fichiers (regardez les tailles).

 Pour gagner un peu de vitesse de navigation sur votre site une fois que votre configuration est définitive, vous pouvez supprimer les commentaires < !-- xxx --> dans les fichiers (gardez une copie).

PERSONNALISEZ EN RENOMMANT LES FICHIERS IMAGE

 Renommez logositeLEJOURNAL.gif en logosite.gif pour afficher un logo "Le Journal" en haut de toutes les pages. Ou prenez n'importe quelle image GIF et nommez-la logosite.gif en remplacement de celle du dossier IMG.

 logoadmin2PLUME.gif doit être renommé en logoadmin.gif pour remplacer le cadenas par une plume dans le menu de pied de page.

 Les noms des images particulières de SUD commencent par logo comme logomessagepop2CALCUL.gif ou par fond comme fondpage4MERBLEU.gif (à renommer en enlevant le chiffre et les grandes lettres pour l'activer).

 Quelques images SPIP comme autonXXNOM.jpg peuvent être renommées par exemple en auton12.gif pour l'image normale (on) de l'AUTeur n°12

 Même principe pour ARTicles BREVes SITEs RUBrique MOTs (on : normal, off : au survol de la souris).

 Certaines images sont "vides" pour être marquées au nom de la rubrique, de l'auteur, du mot etc. Pour le logo de la RUBrique n°12 par exemple, faites une copie de rubonXX.jpg et renommez-la rubon12.jpg, puis ajoutez sur cette image avec Paint ou autre le nom de cette rubrique, enfin mettez-la dans le dossier IMG.

FICHIERS MENU COOL :

 menucool.html (choisir GRAND ou PETIT ou modifier dans ce ficher la position du menu, la taille des cases, le decalage sous-menus etc.)
 menucoolstyle.css (choisir VERT ou NOIR ou modifier le fichier)
 menucool4.js
 menucool.php3
 menucoolpucer.gif
 menucoolvide.gif

 Pour afficher le menu cool uniquement dans le sommaire d'accueil par exemple, copiez dans la page sommaire.html sous <BODY ...> l'instruction suivante : <INCLURE (menucool.php3){id_rubrique}>
 Pour l'afficher sur toutes les pages, renommez hierarchieFIXEASCDESCxCOOL.html en hierarchie.html ou recopiez l'instruction ci-dessus dans hierarchie.html

FICHIERS TABLEAU DE BORD :

 tdb-art-rec.html
 tdb-art-rec.php3
 tdb-brv-rec.html
 tdb-brv-rec.php3
 inc-public-sansbouton.php3

 Les instructions d'affichage sont dans pied.html

FICHIERS MENU DEPLIANT

 layer.js
 inc-layer.php3

 Les instructions d'affichage sont dans les fichiers hierarchieTESTcDEPLIANTXXX.html, et la version VIDE ne fait figurer aucun élément à cacher/déplier.

FICHIER MENU YAHOO

 stylemenuyahooseul.css (utilisé quand on affiche ce menu seulement sur une partie du site).

 Les instructions sont dans les fichiers hierarchieXXXYAHOO.html,

FICHIERS SPIP AJOUTES

 auteurs.html (auteur.html)
 auteurs.php3
 sites.html (site.html)
 sites.php3
 mots.html (mot.html)
 mots.php3
 messages.html
 messages.php3 (0 seconde)
 imprimer.html
 imprimer.php3
 resume.php3 (0 seconde de délai pour rafraichissement du cache)

Télécharger SPIPSUD-1 (567 Ko)

NOTE : AUCUN FICHIER "OPEN SESAME" NE PEUT INSTALLER UN SITE SUR LYCOS-MULTIMANIA (ok sur free et levillage ...)

fil: > Squelette Universel pour Démarrer SPIPSUD-1 : 5mn

4 janvier 2003   [Début forum]

http://apprendremieux.ouvaton.org/

fil: > Squelette Universel pour Démarrer SPIPSUD-1 : 5mn

4 janvier 2003   [Début forum]

http://connaissances.lautre.net/