How to add image in HTML using links? | Sololearn: Learn to code for FREE!
New course! Every coder should learn Generative AI!
Try a free lesson
+ 20

How to add image in HTML using links?

Issue is resolved thanks for the helps.

4th Jun 2018, 8:43 AM
Aanisha Bhattacharyya
Aanisha Bhattacharyya - avatar
48 Answers
+ 25
Actually, you need to use the URL of the image, not the URL of the page containing the image. Here, use this one:
4th Jun 2018, 9:02 AM
Harsh - avatar
+ 18
Right click on the image (hold the image if you're on mobile), copy URL. Done!
4th Jun 2018, 9:05 AM
Harsh - avatar
4th Jun 2018, 9:04 AM
Nikhil - avatar
4th Jun 2018, 8:50 AM
Harsh - avatar
+ 8
I’m seeing a lot of correct answers utilizing an image link address, but I just wanted to toss in that you can utilize a saved image as well as long as its path is accessible. For example, if i had a folder called “images” and an image called “apple.jpg” within that folder, i could insert the image by using: <img src=“images/apple.jpg”>
27th Jul 2018, 8:08 PM
Blake - avatar
+ 7
🤔 Can you post the link here?
4th Jun 2018, 8:53 AM
Harsh - avatar
+ 6
Thank you very much.
4th Jun 2018, 9:06 AM
Aanisha Bhattacharyya
Aanisha Bhattacharyya - avatar
+ 6
Blake Very true. I am so used to using DropBox (from the phone) that I forgot you can have pics on pc. This opens up a whole other world for me! 😂🤣😂🤣
27th Jul 2018, 8:11 PM
🐺Michael🐺 - avatar
+ 4
Make attention that though image link end with .jpg, its not true that link is an image (if you go to url you can see that it link to a web page containing the image)... This because web servers can send to client any filetype though if image extension in in request url... The original url of your example image is . Try to set it like src of your img element and you will see
4th Jun 2018, 9:07 AM
KrOW - avatar
4th Jun 2018, 8:55 AM
Aanisha Bhattacharyya
Aanisha Bhattacharyya - avatar
+ 3
27th Jul 2018, 6:44 PM
Adulkhaliq Q Hamad
Adulkhaliq Q Hamad - avatar
+ 3
ThThinka I do the sane thing! 😂🤣
28th Jul 2018, 12:33 AM
🐺Michael🐺 - avatar
+ 3
<img src=“link.image_format” alt=“alternate text”> src >> contains the path of the image. alt >> Displays an alternate text incase the image is unavailable You can style the image using CSS
28th Jul 2018, 3:21 AM
Naveen Bharathi
Naveen Bharathi  - avatar
+ 3
use image url
28th Jul 2018, 9:59 AM
anas al haj
anas al haj - avatar
+ 2
very easily done! just find the image copy an paste url in your code and run it! for example:
27th Jul 2018, 4:10 PM
Black Rose
Black Rose - avatar
+ 2
I save the complete project folder to Dropbox, create a link for each image, and use that link as my site images’ urls.
27th Jul 2018, 10:01 PM
ThThinka - avatar
+ 2
You're like: <img src="[URL of image]" alt="[alternative text in case URL doesn't work]"/> Then run it.
28th Jul 2018, 12:51 AM
Athanasios Moulios
Athanasios Moulios - avatar
+ 2
It looks like the question has been already answered in many awesome ways. Here is my input on how to get the correct link of any image from any website. You can obtain the correct link by right-clicking the picture you want and select copy image address from the drop down menu. This link will always take you to a page containing only the image.
28th Jul 2018, 2:21 AM
Midi Emmanuel
Midi Emmanuel - avatar
+ 2
your link must have extension on end the type of image .jpg or .png :))
28th Jul 2018, 1:37 PM
Ismir - avatar
+ 2
The one issue with doing a link from the PC is if you plan on making it a long term website, you need to make sure the photo remains in the same position or remember to change the location if it is moved. Using Google Drive or a photo host of some kind is ideal for this reason.
28th Jul 2018, 1:39 PM
Jonathan Bowler
Jonathan Bowler - avatar