« Migrer de Haut et Fort V1 vers Haut et Fort V2 | Page d'accueil | Les statistiques : glossaire. »
28/12/2004
Insérer une image sur son blog
Saviez-vous qu'il est possible d'afficher une image présente sur un autre site directement sur votre blog ?
Il s'agit d'une petite manip' très facile à réaliser que "Bouge ton blog" va vous détailler tout de suite :
1. Récupérer l'adresse de l'image
Vous voulez par exemple afficher le logo de blogspirit sur votre note.
Editez donc une nouvelle note puis copiez le code suivant :
<img src="" alt="" title="" />
Allez d'abord récupérer l'URL du logo sur la page d'accueil de blogspirit. Faites un clic droit sur l'image puis propriétés (avec Internet Explorer 6). Copiez l'URL marquée à côté de "location:".
Insérez la au niveau du paramètre "src" (source) :
<img src="http://www.blogspirit.com/graphics/portal/logo.png" alt="" title="" />
2. Quelques paramètres d'affichage
Vous pouvez renseigner le paramètre "alt" (alternative) qui sert à afficher du texte si l'image n'est plus disponible. Même chose pour le paramètre "title" qui sert à afficher du texte au passage de la souris :
<img src="http://www.blogspirit.com/graphics/portal/logo.png" alt="blogspirit" title="blogspirit.com" />
L'image n'est pas centrée ?
Pas de problème il suffit d'imbriquer l'image dans une boîte <div>:
<div style="text-align: center;"><img src="http://www.blogspirit.com/graphics/portal/logo.png" alt="blogspirit" title="blogspirit.com" /></div>
3. Appliquer un lien sur l'image
Il est également possible de mettre un lien sur cette image, par exemple www.blogspirit.com. Pour cela utilisez le bouton "Lien" de l'éditeur de notes ou bien adaptez le code suivant :
<div style="text-align: center;"><a href="http://www.blogspirit.com" target="_blank"><img src="http://www.blogspirit.com/graphics/portal/logo.png" alt="blogspirit" title="blogspirit.com" /></a></div>
N'oubliez pas d'insérer le code "border: 0;", il permet d'enlever la bordure due à la couleur du lien !
Voilà vous avez votre image !
Non seulement elle n'est pas comptabilisée dans le décompte de votre bande passante mais en plus vous pouvez afficher n'importe quelle image présente sur le web.
Notez bien qu'avant d'afficher une image qui n'est pas hébergée sur votre blog ou sur votre serveur, il vous faut l'autorisation du webmaster pour pouvoir afficher un élément de son site internet ou de son blog...
22:30 Ecrit par blogSpirit Team dans Astuces, Blogspirit, Haut et Fort | Lien permanent | Commentaires (23) | Envoyer cette note | Tags : Blog
Commentaires
Bonjour,
Comment peut-on insérer un moteur de recherche ?
Merci d'avance
Eric
Ecrit par : Eric | 28/12/2004
Très intéressant ! Bravo et merci du tuyau :o)
Ecrit par : Legweak | 29/12/2004
Je rapelle que c'est interdit de faire ça sans l'autorisation de Google ;)
Ecrit par : krang | 30/12/2004
Je profite de cette note sur l'insertion d'image pour poser une question. Je n'arrive pas à insérer les couvertures de livre : faut il un format particulier jpg, gif ? existe-t'il une autre solution pour ajouter ces couvertures ?
Ecrit par : Srilumpa | 03/01/2005
Bonjour,
Les images doivent être au format JPG, PNG ou GIF et elle ne doivent pas dépasser 1Mo en taille. Si l'image est trop lourde, je vous conseille de l'"alléger" en utilisant soit des fonctions d'optimisation avec des logiciels comme Photoshop ou de rapetissir la taille (en pixels) de l'image.
Le plus simple est encore d'insérer ses livres et CDs avec l'ASIN de Amazon.com : une de mes prochaines notes traitera de ce sujet.
Ecrit par : thomas | 04/01/2005
I had employed the syntax of bond-note of class of
division and do not have any problem with it. I just wanted to
ensure me that I do not violate your limits of service; I don' T
believe that I am because I read your TOS and there was no mention of
it. At all events, thank you for a great service maintain good
work!
Ecrit par : Sinann | 06/01/2005
Euh... Attention tout de même, c'est pas très correct de copier une image hébergée ailleurs. Il vaut mieux la copier en local sur son espace et lier cette image. Si l'hébergeur de l'image plante ou devient indisponible, votre image va l'être aussi.
Ecrit par : Hubert | 28/01/2005
a hubert meme si ça fait longtemps :) > il ne s'agit pas forcément de lier l'image d'un autre ! les blogs a image ne peuvent se contenter de 10 Mo , c'est quand meme plus pratique de passer les images depuis son propre ftp ou la bande passante n'est pas limitée :)
a ce propos thomas , si je puis me permettre une autre demande de coup de main :
les albums de base proposés par hautetfort sont plutot sympas , j'aimerais beaucoup en profiter mais ça semble impossible de leur faire accepter les liens externes pour les images, via l'interface du panneau d'admin . pourtant , ça me serait bien utile , parce que sinon un seul album et j'atomise les deux plafonds en deux jours : bande passante et hébergement :)
as tu un tuyau sur comment je pourrais faire ?
Ecrit par : krysalia | 16/05/2005
Désolé krysalia, pas de tuyau à ce sujet ;(
Enfin si ! Le module "Espace Disque" pour 3 Euros/mois, (moins cher qu'un paquet de cigarettes ou que 3 heures de parking parisien...)
Ecrit par : thomas | 16/05/2005
flute de zut de ...
merci d'avoir répondu en tout cas. pour le module espace disque , soyons francs , j'ai un ftp de bientot 1 giga chez free , gratuit, non limité en bande passante ... tu vois ce que je veux dire :/ . l'offre a 3 euros est drolement bien pour ceux qui n'ont pas plusieurs sites , mais pour moi ça ne va pas coller :/ .
et en bricolant le code de l'album une fois l'album créé ( en remplaçant le code de la photo sur hautetfort par le mien ) , y'a pas moyen non plus ?
Ecrit par : krysalia | 16/05/2005
Bonjour Thomas.
Finalement, j'ai pu ecrire la traduction à l'espagnol de ce post-ci. J'espère qu'il ne t'importe pas que j'aïe (c'est comme ça?) utilisé mon estyle pour le code, mais si tu as quelque chose pour me dire, fais-moi savoir. Merci beaucoup!
La traduction est ici: http://buceandoenlared.blogspirit.com/archive/2005/05/25/insertar_una_imagen_en_el_blog_por_thomas_de_blogspirit.html
M@k
Ecrit par : Mak | 25/05/2005
Il faudrait arréter de faire croire que les blogs sont quelque chose de simple. Si l'on est obligé de faire du html rien que pour ajouter une image ça frise le ridicule ! Pourquoi les fournisseurs d'espace blog ne nous donnent ils pas des "outils" sans prise de tête du genre "clic droit, ajouter image" ? Et pourquoi et-il si dur de trouver une base de donée répertoriant (de façon classée et non en vrac) les ajouts possibles ?
Je suis très déçu par la fausse "prise en main intuitive" des blogs.
Ecrit par : vincent | 22/10/2005
salut voila g un souci pour mettre ma video ki est hébergé sur voila. jai trouvé les code html mais ca ne marche pas et je voudrai savoir comme faire et si tavais dautre code.
Ecrit par : francois | 26/10/2005
Salut, est-ce que quelqu'un peut me donner le code pour aligner une image (à gauche par ex) et un bloc de texte (à droite) sant que les autres lignes du texte ne passent à la ligne, en dessous de l'image. En gros si il y a 5 lignes de texte, qu'ils soient tous à la hauteur de l'image.
Ecrit par : Teejee | 05/11/2005
Salut, j'aimerais savoir comment enlever les titres ''notes récentes'', ''commentaires récents''... et tout le reste, sans enlever le contenu parce que j'veux mettre une image à la place...? J'sais pas si c'est clair..
Ecrit par : Uneviesimple | 20/03/2006
Bonjour, j'ai voulu récemment mettre une image dans un commentaire, j'ai bien suivi vos conseils mais tout ce qui est entre >< disparait, j'ai essayé sur 20six un blog où j'étais avant et cela fonctionne.....
Ecrit par : sylvinmagnigoth | 05/04/2006
francois => img src="/admin/graphics/insert-multimedia.jpg" alt="http://www.voila.com/musique.mp3" /
Teejee => img src="ton_image.jpg" align="left" entre balise (on peut aussi mettre à la place de left : center ou right)
Uneviesimple => Désolé ce n'est pas possible, mais peut être un jour...
sylvinmagnigoth => Si vous utilisé la barre d'outil HTML, il est nécessaire de ne pas commencer votre note par des balises. Un simple espace suffit pour résoudre ce problème.
Ecrit par : Clotaire | 06/04/2006
ah et bien très bien, ca marche ! alors que je me suis cassé le cul :) là dessus pendant une heure... ;)
Merci beaucoup !
Salutations distinguées !
Ecrit par : sylvinmagnigoth | 06/04/2006
et si je veux insérer dans un commentaire, je fais la même manipulation???
merci
Ecrit par : sylvinmagnigoth | 06/04/2006
bj, je voudrais savoir si il est possible d inserer des pps sur son blog, merci
Ecrit par : aladin | 15/04/2006
Bonjour, je viens de me lancer avec un blog chez hautetfort... et j'aurais voulu savoir si vous aviez une astuce pour afficher des images de plus grande taille dans les notes que ce qui se fait automatiquement?
d'avance, Merci!
Ecrit par : carolaboulette | 10/06/2006
C'est une image que tu as chargée ou non ? Si tu charge l'image, tu peut choisir de ne pas cocher "créer une vignette". Ce qui donnera la taille normale de l'image, que tu pourra redimensionner par la suite en cliquant sur l'image et en faisant glisser les carrés qui se trouvent dans les coins de l'image une fois cliquée.
Ecrit par : Vlad | 11/06/2006
Vlad! MERCI BEAUCOUP!! finalement ça n'etait pas très compliqué!! j'vais juste oublié de brancher mon cerbeau huhu^^ blonde!
Ecrit par : carolaboulette | 22/06/2006
Les commentaires sont fermés.