Créer facilement et améliorer un blog avec Blogger
Page précédente Page suivante
1) Pour raccourcir une colonne latérale, on peut très facilement remplacer des gadgets par de simples liens. En cliquant sur ces liens, on fait apparaître les gadgets cachés.
2) Exemple : dans la colonne de gauche de ce site, se trouve le lien : FORMULAIRE DE CONTACT ▼. En cliquant dessus, le gadget apparait.
En cliquant ensuite sur "fermer ▲", le gadget est à nouveau masqué.
Autre exemple : dans la même colonne de gauche de ce site, cliquer sur le lien : MUSIQUE EN LIGNE ▼.
3) Pour obtenir cela, il faut ajouter deux gadgets HTML/JavaScript dans le blog.
Rappel : comment ajouter un gadget HTML/JavaScript sur un blog
4) Le code du premier gadget à ajouter est le suivant :
<h2>
<a id="ContactForm1-A" onclick="affichercacher('ContactForm1','CONTACTER CE SITE ▼');">CONTACTER CE SITE ▼</a></h2>
<a id="ContactForm1-A" onclick="affichercacher('ContactForm1','CONTACTER CE SITE ▼');">CONTACTER CE SITE ▼</a></h2>
"ContactForm1" est le nom du gadget concerné. Pour cacher un autre gadget, il suffit de remplacer (deux fois) "ContactForm1" par le nom de cet autre gadget. Pour connaître le nom du gadget, aller dans "Mise en page" et cliquer sur "Modifier" dans le rectangle correspondant au gadget : le nom apparait à la fin de l'adresse, en haut de la fenêtre qui s'est ouverte ("HTML1" ...).
Il faut enfin éventuellement modifier (deux fois) le texte du lien : CONTACTER CE SITE ▼ (ci-dessus en rouge).
On peut ajouter autant de gadgets que l'on veut.
Ce gadget se place, dans "Mise en page", JUSTE AVANT le code du gadget concerné.
5) Le code du second gadget à ajouter est le suivant :
<script>
function affichercacher(id,id3)
{id2=id + "-A";
if(document.getElementById(id).style.display=='block')
{document.getElementById(id).style.display='none';
document.getElementById(id2).innerHTML=id3;}
else
{document.getElementById(id).style.display='block';
document.getElementById(id2).innerHTML='fermer ▲';}
return;}
</script>
<style type='text/css'>
#ContactForm1{display:none}
</style>
function affichercacher(id,id3)
{id2=id + "-A";
if(document.getElementById(id).style.display=='block')
{document.getElementById(id).style.display='none';
document.getElementById(id2).innerHTML=id3;}
else
{document.getElementById(id).style.display='block';
document.getElementById(id2).innerHTML='fermer ▲';}
return;}
</script>
<style type='text/css'>
#ContactForm1{display:none}
</style>
Ce code ne doit être ajouté qu'UNE SEULE FOIS dans le blog, même s'il y a plusieurs gadgets à cacher.
Il faut cependant ajouter une ligne avec le code "#ContactForm1{display:none}" par gadget à cacher, en remplaçant "ContactForm1" par le nom du gadget concerné.
Ce gadget se place, dans "Mise en page", JUSTE AVANT le premier code prévu au point 4).
Commentaires
Enregistrer un commentaire