Une icone pour ton blog

Du 28 10 2008 § 10 Commentaires § Mots-clefs : , ,

icone Tby

Afficher une icône pour personnaliser votre blog

Les petites bulles sur l’image de l’article vous montrent de quoi je désire vous entretenir.

Si vous avez accès au tag «head» (le tag html) de votre blog, il est très simple d’insérer une icône qui personnalisera votre blog et qui s’affichera dans la barre du navigateur lorsque vos visiteurs arriveront sur votre site ou dans ses favoris s’il vous en fait l’honneur.

Avec votre logiciel préféré, dans mon cas photoshop elements, créer un fichier de la taille 16×16 pixels. Le remplir de vos couleurs, logo ou autre et le sauvegarder sous la forme xyz.ico (attention, 16 pixels c’est peu de place.) ou xyz.gif ou encore pour être plus royaliste que le roi, favicon.ico ou favicon.gif.

Vous allez ensuite le télécharger à la place qui vous est attribuée ou que vous avez attribué pour vos graphismes.

Vous avez ensuite à inscrire entre head et /head les deux lignes suivantes, l’endroit importe peu mais il est plus propre de les mettre là où se trouve déjà des «link rel» comme pour du javascript, du CSS et autres:

Code favicon

Pourquoi deux lignes ? Vous savez comme moi que les navigateurs se jouent volontiers des normes et ces deux lignes permettent à votre icône d’apparaître sur tous les navigateurs.

Sauvegardez et le tour est joué. Votre blog donne un aperçu de votre professionnalisme qui peut vous ouvrir la porte de la cour des grands. (Attention, juste ouvrir la porte mais pour le reste, je suis sûr que la qualité de vos articles parlera pour vous.)

Pour Overblog, je vous ai déjà mâché le travail en recherchant dans sa FAQ.

Le même travail au niveau de l’icône mais obligatoirement un fichier gif sinon vous ne pourrez pas le charger sur OB.

Vous chargez ensuite votre icône comme vous chargez habituellement vos images, clic droit et copier l’adresse de l’image et c’est cette adresse que vous donnerez comme indiqué dans cet article de la FAQ OB. J’ai essayé et vous pouvez contrôler sur le blog de Wasicu, ça marche, vous retrouverez sur ce blog le petit carré orange Tby.

Une petite précision, si vous êtes en mode avancé pour la configuration, vous ne trouverez pas de «mise en page» mais vous pouvez obtenir le résultat avec «Accueil» et pour ceux qui ne savent pas ce qu’est un pied de page, c’est la grande case en bas qui se nomme texte. Cliquez sur le symbole du marteau et ensuite sur le bouton html qui se trouve dans l’éditeur qui va apparaitre.

N’oubliez pas chers Overbloguiens de mettre les deux lignes et non une comme indiqué par la FAQ.

J’en profite pour vous indiquer l’adresse du blog de référence pour le Design, les astuces et les widgets d’Overblog : AnnaK

Ne vous inquiétez pas, après cette petite expérience, je repasse au registre qui me convient le mieux, le raconteur d’histoire. Pour ceux qui se doutent quel est le but poursuivi, ils vont penser : “La teigne !”

Bonne continuation et bonne personnalisation de blog.
Thierry

Bouton de la page d'accueil

Bouton de la page des informations pratiques

{lang: 'fr'}

10 Commentaires

  1. Patrick dit :

    Parfait et limpide. ton savoir m’impressionne et je suis jaloux…
    merci Thierry.
    Amitié.
    PAT

  2. milady write dit :

    ohlala. C’est gentil de m’avoir aiguillée vers ton article m’alors euhm je me pencherai dessus plus tard parce qu’alors rien que « tag head » j n’ai aucune idée d’ou que c’est qu’est ce que c’est…
    je poste un peu sur overblog en ce moment car mon blog myspace a du devenir privé à cause d’une folle qui me harcelait et donc ceux qui n’étaient pas inscrit sur myspace ont ralé de ne plus avoir accès aux posts. Merci de tes passages. A bientôt

  3. dédé dit :

    Bonjour Thierry,

    Je constate que ta connaissance technique est infinie dans le puits insondable du net. Je t’envie réellement, car si je possèdais une infime partie de ton savoir, je gagnerais du temps pour réaliser mes désirs.
    Au sujet de l’icone, je trouve bien compliquée la manipulation à faire… pour le résultat.
    Merci tout de même des infos pour réaliser cette petite chose.
    Amitié.
    dédé.

  4. tby dit :

    @dédé: BOnjour Dédé
    C’est pourquoi je le partage ce savoir. Mais restons sérieux, ce savoir technique est une infime partie de ce qui se trouve derrière un blog.
    Merci
    Amitié
    Thierry

  5. Gilles Arnaud dit :

    Salut l’ami,

    Je me retrouve encore sur ce blog pour récolter des trucs de geek.
    C’est à n’y rien comprendre.
    Et dire que je vais bientôt publier un billet sur ton compte dont le titre contiendra « blog littéraire ».

    Décidément, tout ceci n’est pas sérieux.

    Merci pour le code.

    Amitiés
    Gillou

    P.S. : un peu de patience, tout de même, pour le texte que je t’ai promis.

    • tby dit :

      @ Gilles : héhéhé tu ne vas pas me faire croire que tu as tout lu… Honoré par un billet sur mon compte, tu peux laisser « blog littéraire », les conseils de geek que je donne son à destination (non exclusive) des auteurs qui tentent de faire un blog sérieux. Quand au sérieux en ce qui me concerne, j’ai décidé que j’aurais assez de temps dans ma tombe pour me pencher sur cet aspect de la vie qui manque parfois d’humour. Rire. Amitié. Thierry

  6. Gilles Arnaud dit :

    J’ai jamais dit que j’avais tout lu.
    Sinon j’aurais menti.
    ;)

    Gillou

  7. AlterAltitude dit :

    Salut l’ami de Germanie en vacances,

    Cela marche aussi en .png

    Bonne fin de nuit.

    Amitiés
    De qui tu sais

    • tby dit :

      Salut Gillou. les png ont des problèmes d’affichage avec IE le navigateur de Windows (enfin c’est le contraire, c’est IE qui a des problèmes avec les png) mais je pense qu’ils doivent tout de meme passer en icone. A bientot. Amitié. Thierry

Laisser quelques mots