24/02/09

Déco: personnaliser son blog avec des icônes ou boutons originaux

Décoration d'un blog: où trouver des boutons et des icônes? (Tous blogs)

Envie de personnaliser votre blog? Voilà quelques adresses de boutons, d'icônes:
icone-bouton-blog-animaux(Un exemple de collections de boutons pour flux RSS)
Attention à respecter les conditions d'utilisation relatives à chaque collection.

Un bouton ou une icône dans un blog, pour quoi faire?

  • La collection de boutons "animaux" présentée ci-dessus est aux couleurs des icônes de Flux RSS (ou Atom). Ils peuvent donc remplacer un bouton classique. Les visiteurs qui souhaitent s'abonner au flux du blog cliquent dessus.
  • Dans la même lignée que les boutons Flux, on trouve des collections originales et personnalisées pour renvoyer à des agrégateurs de flux, à google...
  • Enfin, n'importe quelle image à laquelle on associe un lien devient un "bouton", qui renvoie où l'on veut: sur un autre site, sur une page contact, page biographie de l'auteur, etc...

Comment utiliser ces icônes et boutons?

  • Première étape: téléchargez (ou copiez) les icônes dans votre disque dur
  • Ouvrez, dézippez si nécessaire les dossiers de boutons et faites votre choix
  • Quelle taille doit faire un bouton? Pour le savoir, faites un clic droit sur n'importe quelle icône d'une taille similaire à celle que vous voulez, vue dans un autre blog. Allez voir dans "propriétés" les dimensions de cette image. (à titre indicatif, mes animaux font 64 sur 64, les miniatures des abonnés au blog font 28 sur 28.)
  • Retouchez éventuellement votre image : j'ai changé les teintes de mon panda: il était initialement aux couleurs oranges d'un flux RSS, j'ai converti le orange en vert pour un bouton technorati.
  • Votre image est prête, il ne reste plus qu'à la mettre en ligne.

(Débutants en HTML) Insérer le nouveau bouton ou l'icône dans un blog ou dans un site:

(A travers deux exemples:)
  • Blogger: Le plus simple est d'ajouter dans "mise en page" un gadget image. Vous importez votre image depuis votre disque dur jusque dans votre blog. Vous y associez le lien de votre flux, par exemple.
  • Over-blog: vous pouvez utiliser un bloc texte: il accepte l'insertion d'images et vous pouvez accéder au code HTML si nécessaire. Importez l'icône, sélectionnez-la et insérez votre lien.
  • N'oubliez pas de modifier l'adresse du lien si vous voulez que ce lien s'ouvre dans une nouvelle fenêtre (pas nécessaire pour un bouton flux RSS, mais préférable si le lien mène vers un agrégateur de flux ou un autre site).
  • Dans ce blog (blogger): je me suis servie d'un "bloc texte" que j'ai programmé en HTML (... eh oui! ça commence à rentrer, les histoires de balises!). Donc, si vous avez quelques notions de programmation HTML, des images peuvent parfaitement figurer dans les gadgets prévus pour le texte, à condition de les importer directement en HTML. (J'ai testé: pas de bug avec firefox)
  • Remarque blogger: Intervenir dans les modules en HTML revient à intervenir au niveau du code CSS et HTML de son modèle blog. En poussant un peu trop loin les expériences hasardeuses dans les modules blogger, on peut très bien "planter" son modèle! Donc si vous intervenez en HTML sans être sûr de vous, n'hésitez pas à faire une sauvegarde du code de votre modèle avant!...
___________________________________________________________________
Articles liés: Ces articles peuvent vous intéresser:

3 commentaires:

  1. Très bien, Cathy, tous ces petits icônes, pour attirer le regard, c est parfait et les animaux sont originaux. Merci encore pour les adresses de sites.

    RépondreSupprimer
  2. Voilà un tutoriel bien complet ;-) Autre remarque, les icônes sont généralement gratuites et libres de droits. Toutefois, leur licence Creative Commons exige souvent un lien vers l'auteur en contrepartie de leur utilisation. C'est peu d'effort, et toujours apprécié des créatifs qui travaillent pour nous ;-)

    RépondreSupprimer
  3. Merci Flav, pour ce commentaire, et merci avant tout pour "le blog du modérateur", qui m'a appris des tas de choses! c'est effectivement important de rappeler les conditions d'utilisation de toutes ces ressources libres de droit! Un vaste problème subi de plein fouet par les créateurs d'images, photographes y compris!

    RépondreSupprimer

ENVIE DE LAISSER UNE TRACE DE VOTRE VISITE OU DE DONNER VOTRE AVIS? N'HÉSITEZ PAS A ÉCRIRE UN COMMENTAIRE.
Merci de votre passage et à bientôt
Cathy Bernot


En savoir plus? Comment laisser un commentaire? Gestion et modération du blog?.