samedi 19 décembre 2009

Supprimer ou modifier un lien sur une image

Quand vous insérez une image dans un article, Blogger la redimensionne selon votre choix pour l'affichage (petit / moyen / grand) et crée un lien qui permet d'afficher l'image à sa taille réelle.

Ce lien n'est pas toujours pertinent, en particulier quand l'image est petite et ne nécessite pas d'être agrandie, et on peut vouloir le supprimer. On peut également préférer faire un lien vers un autre site, ou un autre article du blog.

Pour cela il suffit d'aller dans l'onglet "Modifier le code HTML".

Le code HTML généré est de la forme :
<a href="url-de-l'image-en-taille-réelle"> <img src="url-de-l'image-redimensionnée"> </a>

Pour supprimer le lien sur l'image, il suffit de supprimer tout le code entre <a href= et > sans oublier le </a> placé après la balise <img src= ... >.

Pour modifier le lien, il suffit de remplacer l'adresse de l'image en taille réelle par celle du site auquel on souhaite accéder en cliquant sur l'image.

Remarque : il faut un peu d'habitude pour retrouver ce code, Blogger rajoutant des chemins d'accès aux images avec des noms à rallonge et rajoutant quelques options à l'intérieur des balises <a> et <img>, mais on peut s'aider avec la fonction recherche (CTL F) sur le nom de l'image.

Pour les utilisateurs de l'ancienne version de l'éditeur Blogger :
L'ancien éditeur Blogger rajoute également à l'intérieur de la balise balise <img src= ... > une option cursor:pointer; qu'il faut supprimer. Sinon, même si le lien a été supprimé, le curseur continuera à changer de forme au passage de la souris sur l'image faisant croire qu'elle est "active".
<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9zXPosi7nRVvCtn_n-biJdXJNVPnqzAOKW8RfElBMn7A7sv3OvpW6Nh5DxvXEtdbb-1n8RjI1zOc8MGLzzfSjX8EsqkipliXYSRTTVdtbICxXJAVnhYjsOxIjYWTyPtprUnJB3Ho44DQ/s1600-h/recette_quichecourgettes1.jpg"><img style="cursor: pointer; width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9zXPosi7nRVvCtn_n-biJdXJNVPnqzAOKW8RfElBMn7A7sv3OvpW6Nh5DxvXEtdbb-1n8RjI1zOc8MGLzzfSjX8EsqkipliXYSRTTVdtbICxXJAVnhYjsOxIjYWTyPtprUnJB3Ho44DQ/s400/recette_quichecourgettes1.jpg" alt="" id="BLOGGER_PHOTO_ID_5381262350249712898" border="0" /></a>

(Tous mes tutoriels sont dans l'index "informatique")
Rendez-vous sur Hellocoton !

2 commentaires:

  1. C'est vrai que j'ai remarqué que ce nouvel éditeur a tendance à nous rajouter des codes de partout ! Et effectivement, c'est un peu gênant quand on se met dans la fenêtre html et qu'on veut essayer d'y comprendre quelque-chose.

    Je ne m'étais jamais posé la question de l'utilité ou non d'un lien vers une fenêtre affichant l'image à sa taille réelle. D'ailleurs, moi j'aime bien voir les images en plus grand.
    Sinon, si je veux faire un lien vers un site sur une image, je ne passe pas par le code html : je fais un clic droit sur l'image pour la sélectionner et je fait "Associer" pour coller l'adresse correspondante.
    Après, j'imagine que ça doit être un joyeux fouilli du côté html, mais bon, ça marche comme ça !

    PS : j'ai remis la vidéo chez moi !!!

    RépondreSupprimer
  2. @Céline : J'avais oublié effectivement le clic droit qui permet d'utiliser le bouton associer ;-)

    Moi aussi j'aime voir les images en grand mais de temps en temps on n'en a que des petites (un logo, un détail, ...) et alors là, ça m'énerve de cliquer pour m'apercevoir que l'agrandissement est de la même taille!

    RépondreSupprimer