Tutoriel insertion d'images avec Imageshack

[B.O.]

Bonjour,

 

Voici une description des étapes pour insérer des images sur le forum avec Imageshack, qui est un site de stockage d'images en ligne.

Ce tutoriel s'adresse :

- à celles et ceux qui n'ont pas forcément utilisé Imageshack avant, afin de publier leur première image ou photographie sur le forum dans un format recommandé pour un bon compromis lisibilité / poids,

- mais permettra également à ceux qu souhaitent partager des photos en haute résolution, très lourdes.

 

 

A) INSERER UNE IMAGE EN RESOLUTION MOYENNE :

 

1. Ouvrir http://imageshack.us/ dans un navigateur.

 

2. Choisir le redimensionnement : Imageshack pouvant le faire pour vous, autant le lui demander. Un bon compromis pour le forum est le format 800x600.

 

 

En profiter pour cocher NON sur "Label Thumb", puis uploader l'image sur le site de stockage.

 

3. Une fenêtre s'ouvre :

 

 

Sélectionner TOUT le texte dans la case à côté de Code de forum dans la partie gauche, là où on lit Copier ce lien, et le coller tel quel dans votre message du forum [/b](sous Windows, petits raccourcis : CTRL + C pour copier, CTRL + V pour coller)

 

4bis : éventuellement, enlevez la dernière partie du code quand vous collez, celle qui concerne le "Uploaded with Imageshack". Ne le faites pas si vous ne le sentez pas, mais une bonne manière d'expérimenter est de regarder l'impact de chaque modification sur votre texte en utilisant le bouton "Prévisualiser" au lieu du bouton pour envoyer votre message.

 

____________________________________________________________________________________________________________________________________________________

 

B) INSERER UNE IMAGE EN HAUTE RESOLUTION SANS ALOURDIR LE FORUM : LES VIGNETTES :

 

ATTENTION : il y a une manière fastidieuse de le faire, en créant un compte et en cliquant à pas mal d'endroits (donc avec pas mal d'opérations), et une manière plus rapide mais qui implique de "bidouiller" le lien de l'image et les balises forum.

Je vais détailler les deux méthodes, et volontairement utiliser des images de formats différents.

 

B.1] Méthode longue :

 

1. Ouvrir http://imageshack.us/ dans un navigateur.

 

Créer un compte sur Imageshack : je n'ai pas trouvé d'autres moyens encore pour avoir les miniatures (thumbnails en anglais). Avant la refonte d'Imageshack, le site donnait un lien avec miniature directement pour les forums, mais ça n'a plus l'air d'être le cas aujourd'hui (malheureusement).

 

2. Enlever le redimensionnement, vu que le but est de stocker une image haute définition

 

 

En profiter pour cocher NON sur "Label Thumb", puis uploader l'image sur le site de stockage.

 

 

3. Aller dans "Mes images" en haut à droite - ceci n'est possible qu'après être identifié sur Imageshack (d'où la création d'un compte ...)

 

 

 

4. Repérez la vignette de votre image et cliquez sur le peti "i" à côté (Share It)

 

 

 

5. Une fenêtre s'ouvre. Copiez le lien de la partie Thumbnails, en bleu sur l'image ci-dessous

 

 

6. Coller tout le lien dans le forum.

 

 

Cette petite image est cliquable, et conduit vers l'image de grande taille stockée sur Imageshack.

 

Fastidieux, non ?

Voyons la méthode courte ...

 

B.2) Méthode courte

 

Regardons la structure du code forum du lien vignette+image ci-dessus, que j'ai copié-collé :

 

[>URL=http://imageshack.us/photo/my-images/688/img8081p.jpg/][>IMG]http://img688.imageshack.us/img688/2198/img8081p.th.jpg[/img]

 

Ce lien est assez barbare, mais nous allons le décortiquer ensemble.

 

- en rouge, il y a le signe >. Ce signe N'EST PAS dans le lien que j'ai collé. Je l'ai ajouté à deux endroits pour que le forum n'interpète pas le code (sinon ? Il affiche la vignette ;) ). Quand vous ferez vos modifications de code, il ne faudra donc bien entendu pas mettre ces >

 

- la première partie du code, entre les balises URL, indique un lien. C'estl'endroit où cliquer sur la vignette vous envoie, et ce lien doit donc correspondre au lien de stockage de la grande image sur Imageshack (en bleu)

 

- la seconde, entre les balises image (IMG) est ce que le forum affichera, et doit donc correspondre à la vignette. Et c'est là où cela devient intéressant : la différence entre le lien que donne Imageshack pour la grande image et pour la vignette est le rajout d'un ".th" - c'est la partie en vert

 

 

 

CONCLUSION :

Sans même vous inscrire à Imageshack :

- uploadez votre image de grande taille SANS LA REDIMENSIONNER,

- copiez et collez le lien pour forum comme montré dans le point 3. ci-dessus,

- puis modifiez la seconde partie de ce code en ajoutant ".th" devant ".jpg",

- enfin, enlevez le "Uploaded with Imageshack" et toute la partie URL associée pour que ça fasse plus propre.

 

Exemple :

 

 

PS : si vraiment vous avez le temps et/ou envie de faire mieux, vous pouvez faire pointer réellement vers l'image (sans les pubs Imageshack autour). Pour cela, uitilisez le lien direct que vous fournit le site de stockage. Mais c'est déjà bien d'avoir lu jusque là ! :D