Pourquoi afficher une bas de page à 4 colonnes me demanderez-vous ? Je crois que ce serait pour y stocker tous les widgets et autres éléments que vous aimeriez avoir sur votre blog mais qui à votre avis risqueraient de faire un peu trop de remplissage sur la sidebar.
Cliquez sur ce lien si vous préférez plutôt avoir un bas de page à 3 colonnes. Pour ce qui veulent un bas de page à 4 colonnes, voici la procédure à suivre :
1. Se connecter à votre compte Blogger, aller sur "Mise en page" puis sur "Modifier le code html"
2. Trouver la partie de code ayant l'un des identifiants suivant : footer-wrap, footer, footer-end etc.
Dans les modèles classics le code du pied de page se présente comme suit :
<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>
3. Remplacez le code en rouge ci-haut par le code suivant
<div id='footer-column-container'>
<div id='footer1' style='width: 225px; float: left; margin:0; '>
<b:section class='footer-column' id='footer-column-1' preferred='yes' style='float:left;'>
<b:widget id='HTML32' locked='false' title='' type='HTML'/>
</b:section>
</div>
<div id='footer2' style='width: 225px; float: left; margin:0; '>
<b:section class='footer-column' id='footer-column-2' preferred='yes' style='float:left;'>
<b:widget id='LinkList32' locked='false' title='Blogroll' type='LinkList'/>
</b:section>
</div>
<div id='footer3' style='width: 225px; float: right; margin:0; '>
<b:section class='footer-column' id='footer-column-3' preferred='yes' style='float:right;'>
<b:widget id='Text32' locked='false' title='' type='Text'/>
</b:section>
</div>
<div id='footer4' style='width: 225px; float: right; margin:0; '>
<b:section class='footer-column' id='footer-column-4' preferred='yes' style='float:right;'>
<b:widget id='Feed32' locked='false' title='Articles récents' type='Feed'/>
</b:section>
</div>
<div style='clear:both;'/>
</div>
4. Ajouter le code css suivant avant la balise ]]></b:skin>
Pour changer les couleurs (en gras), voir les codes des couleurs ici.
#footer-column-container { border: .3px dotted #cccccc;}
.footer-column { margin: 0 10px 0 10px; padding:5px;
color: #666666; line-height: 1.5em; font-size:12px;}
.footer-column h2 {
padding-bottom:.15em; text-align:center;
font:"normal normal 80% 'Comic Sans MS','Lucida Sans Unicode','Trebuchet MS',Sans-serif";
color:#333333;
line-height:1em; letter-spacing:.1em;
border-bottom: 1px solid #cccccc;}
.footer-column ul { list-style:none; margin:0 0 0; padding:0 0 0;}
.footer-column ul li {
background: url(http://i421.photobucket.com/albums/pp296/rnbutpur/bullet-1.gif) no-repeat;
margin:0 0 0; padding-left: 16px;
padding-bottom: 0.5em; line-height:1.2em;}
.footer-column .widget {margin:0 0 .5em; padding:0 0 1em;}
Enregistrer votre modèle.
5. Se rendre sur "Mise en page" et modifier les widgets de votre bas de page qui a maintenant 4 colonnes.
Une astuce de Blogosys.
@+
8 Commentaires
slt il faut faire quoi a l'étape 4?
RépondreSupprimermerci
Et si je veux 4 colonnes dans un gadget qui n’est ni Header ni footer??? Je peux créer une section?
RépondreSupprimerslt
RépondreSupprimeril est super ton blog :)
- comment créer des messages dans les pages interne d'un blog?
j arrive pas à publier des messages dans mes pages interne de mon blog :(
Help please !
pas de balise footer pour moi :(
RépondreSupprimerCe commentaire a été supprimé par l'auteur.
RépondreSupprimerbonjour j'ai fai tout ce que tu as mis sur ton tutoriel mais sa marcher mais le rectangle est trop petit pur afficher les éléments je voudrai savoir comment faire pour augmenter la taille du rectangle voici mon blog http://donharyultime.blogspot.com/
RépondreSupprimerGénial, est-ce-qu'il est possible de créer "ajouter un gadget" en deux parties, côte à côte, en dessous de l'en-tête de la mise en page dans blogger ?
RépondreSupprimerBonjour,
RépondreSupprimerJe veux mettre mon blog en 3 colonnes, donc j'ai été dans mise en page et ai cliqué sur le 3 colonnes et après je fais appliquer mais quand je fais un aperçu il apparait toujours en 2 colonnes et mes gadgets de gauche n'apparaissent pas.
Merci de bien vouloir m'aider
Salut Cher Lecteur.
Bien que les commentaires ne sont pas modérés en amont, ne perdez pas votre temps à mettre des commentaires sans aucun lien avec l'article. Ils seront effacés.
Ne venez surtout pas mettre des commentaires bidons pour promouvoir les sciences occultes ici (voyance, magie, etc.), vérifiez le blog, aucun commentaire de ce genre n'a résisté à la gomme de l'administrateur.
Bon, ceci étant dit, puissiez-vous respecter les lois de votre pays, les lois universelles ainsi que le bon sens en postant votre commentaire sur ce blog.