Tutoriel - Organisation du "Pied de page"
Dans mon projet de remanier mon BRIC A BRAC, en premier lieu je modifie la largeur de mes pages comme avec le DizPerso puis je réorganise mon bas de page, de manière à y regrouper les objets du bas de la colonne de gauche, évitant ainsi son allongement.
Elargissement de mes pages
Modification du fichier CSS, dans le modèle 5, la partie qui contient tous les éléments de la page, l'équivalent de la partie "Cadre" dans DizPerso, se nomme "Conteneur". J'ai modifié sa largeur et les marges, le menu de gauche est donc déporté vers la gauche et la partie "Rubriques", ou "Contenu" dans DizPerso, bien agrandie prenant toute la droite des pages.
La partie "Footer", ou "Bas" dans DizPerso, également élargie puisque se trouvant dans le Conteneur agrandi.
Tout ceci justifie la réorganisation de la partie "Footer", qui contient seulement divers liens généraux et communs à toutes les pages du blog. En plus cette partie utilise toute la largeur des pages, nous pouvons y loger très facilement des objets de toutes sortes, et bien sûr du "Javascript".
CSS - Régles de style du "Pied de page"
Dans le fichier CSS d'un modèle on peut modifier ou créer des règles pour paramétrer la présentation mais dans DizPerso nous sommes limités, je ne détaillerai pas ici, car dans DizTest j'ai une catégorie à ce sujet : Pied de page
Par contre si vous possédez une version Silver ou Gold, vous pouvez créer une règle de style complémentaire et l'insérer dans la bordure gauche/droite. Le paramétrage en HTML se met dans la bordure basse.
HTML - Disposition du "Pied de page"
Dans cet emplacement vous pouvez insérer divers objets trouvés sur Internet, compteur, calendrier, logos d'annuaires, bannières et autres images avec lien ou sans. Tous ces objets apparaîtront sur toutes les pages et seront à la disponibilités des visiteurs.
Pour ma part je me suis servi de DIVs et d'un tableau.
Les DIVs utilisés pour les objets disposés sur toute la largeur.
Le tableau pour les autres objets, car ce système est mieux interprêté par les navigateurs que des blocs flottants et en plus vous pouvez loger des objets de différentes tailles à l'aide de tableau inséré dans une cellule ou de cellules fusionnées. Il est évident qu'il faut un peu savoir utiliser les tableaux pour en tirer le meilleur profit. Je vous indique un lien parmi tant d'autres, pour vous documenter si vous avez besoin : [lien]
En lisant cette page, vous en s'en saurez assez pour composer votre pied de page sans problème et même certainement ça vous donnera des idées pour d'autres présentations dans vos articles.
Personnellement je gère le plus possible le tableau avec mon CSS, ainsi je peux éventuellement faire les modifications de base plus rapidement, sachant qu'il est toujours possible de mettre des modifications spécifiques dans les balises HTML.
En réalité une seule régle est utile #blocbas, si l'on rentre les paramètres dans les balises.
J'ai profité de l'occasion pour ajouté à la règle #footer, 2 règles pour les liens et une pour le formulaire de parrainage.
Le "Pied de page" changera certainement, c'est pour cette raison que j'ai inséré une vignette de la capture écran, en cliquant dessus vous pourrez la voir en taille réelle.
C'est un exemple très simple, à vous de faire une composition originale, j'ai trouvé ce système de tableau intéressant.
Le HTML du bloc du pied de page... le tableau et son contenu est à
mettre dans la bordure basse, pour être visible dans toutes les pages
********************************************************************************
CODE GEOCOUNTER www.geovisite.com Code fourni |
Fond Ecran du jour www.toutimages.com Code fourni Ephéméride www.france-pittoresque.com Code fourni |
Mon arbre sur le site Carbon Grove fourni |
calendrier www.toutimages.com Code fourni |
PageRank lien fourni |
** vide ** |
XITI Code fourni |
sliceblog www.sliceblog.com en fourni |