mardi 6 septembre 2011

barre horizontale de liens

Trouvé sur www.leblogger.com
Voici un tutoriel très simple pour vous permettre de créer une barre horizontale de liens dans votre blog Blogger/Blogspot. 

La barre des liens est complètement personnalisable: taille des liens, couleur des liens,couleur de l'arrière plan, liens texte ou image, icône à coté de chaque lien, ouverture dans une nouvelle fenêtre, etc. Tout cela en ajoutant un simple widget à votre blog et sans modifier le code HTML de votre Template. Résultat:

barre des liensbarre des liensbarre des liens
Installation:
Connectez vous à Blogger, Allez dans "Mise en page", cliquez sur "Ajouter un gadget" puis sur "HTML/JavaScript" et copier/coller le code suivant: (Remplacez le texte en rouge avec vos propres liens)
<a href="http://www.leblogger.com/"><b>Accueil</b></a> | 
    <a href="http://www.leblogger.com/2009/06/astuce-blogger-astuces.html"><b>Astuces</b></a> | 
    <a href="http://www.leblogger.com/2009/06/widget-gadget-blogger.html"><b>Widget</b></a> |     
    <a href="Votre Lien ici"><b>Référencement</b></a>    |  
    <a href="Votre Lien ici"><b>Vos Souhaits</b></a>   |       
    <a href="Votre Lien ici"><b>Me Contacter</b></a>
-Ensuite déplacez ce widget en dessous de l'entête de votre blog comme sur l’image suivante:
barre des liens
Personnalisation :
  • Forme générale d’un lien texte :
    <a href="http://www.leblogger.com/">Accueil</a>
  • Forme générale d’un lien Image :
    <a href="http://www.leblogger.com/"><img src="L'adresse/URL de l'image"></a>
  • Pour changer la couleur et la taille d’un lien ajoutez <font color="blue" size="3">comme ceci :
    <a href="http://www.leblogger.com/"><font color="blue" size="3">Accueil</a>
  • Pour agrandir tous les liens en même temps ou appliquer une même couleur à tous les liens, placez <font size="3"> ou <font color="blue" > au tout début du code.
  • Pour aligner les liens à gauche (left), à droite (right) ou au center (center), ajoutez<div style="text-align: left;"> au tout début du code. 
  • Pour changer la couleur de l'arrière plan d'un lien ajoutez <span style="background-color: #00FFFF;"> comme ceci:
    <a href="http://www.leblogger.com/"><span style="background-color:#00FFFF;">Accueil</a>
  • Pour ouvrir les liens dans une nouvelle fenêtre ajouter target="_blank" comme ceci :
    <a target="_blank" href="http://www.leblogger.com/">Accueil</a>

Aucun commentaire:

Enregistrer un commentaire