Imgur different image sizes and Thumbnails
Imgur.com is a popular free image hosting service used by many people. I use it to host images I post on public forums because it's really easy to use. If you're uploading the image as a guest, it generates a one time delete link for you to save somewhere so you can visit that link to delete the image anytime. If you aren't worrying about deleting the image later, you can simply copy the direct link to the image and close the Imgur window. But once you close the window, you are not going to find those details again.
So recently, I uploaded a large image to Imgur and embedded it to a forum and noticed that the image is too large to be displayed in an average screen. My image was covering the whole screen and soon I understood that other users are not going to be happy with what I have done. So I changed my idea to show a thumbnail of the image and give a link to the original image. But I've already closed the Imgur window. So I had no more information about the image.
The only option I had is to create two images, one thumbnail and one original. Then upload the both images to Imgur and embed them separately. But it was a lot of additional work, and I wanted something easy and simple. Luckily, I found their API documentation and there, they have mentioned about different image sizes. It was really simple.
If you want to get different image sizes, you only have to append a single character to the end of the image name as below. Imgur will then generate the thumbnails for you saving a lot of time.
Imgur provides 6 image sizes so you can select whatever the size suits your requirement. The following table shows you the different image sizes available.
For example, if your image is located at http://i.imgur.com/12345.jpg, you can get different image sizes as below;
Small Square - http://i.imgur.com/12345s.jpg
Big Square - http://i.imgur.com/12345b.jpg
Small Thumbnail - http://i.imgur.com/12345t.jpg
Medium Thumbnail - http://i.imgur.com/12345m.jpg
Large Thumbnail - http://i.imgur.com/12345l.jpg
Huge Thumbnail - http://i.imgur.com/12345h.jpg
Source: http://api.imgur.com/models/image
Notice the last character at the end of the image name (before the extension).
If you think I've missed anything, please feel to let me know that by leaving a comment here. Also, if you think this blog post is useful, please consider sharing it with your friends in Google+, Facebook and Twitter.
So recently, I uploaded a large image to Imgur and embedded it to a forum and noticed that the image is too large to be displayed in an average screen. My image was covering the whole screen and soon I understood that other users are not going to be happy with what I have done. So I changed my idea to show a thumbnail of the image and give a link to the original image. But I've already closed the Imgur window. So I had no more information about the image.
The only option I had is to create two images, one thumbnail and one original. Then upload the both images to Imgur and embed them separately. But it was a lot of additional work, and I wanted something easy and simple. Luckily, I found their API documentation and there, they have mentioned about different image sizes. It was really simple.
If you want to get different image sizes, you only have to append a single character to the end of the image name as below. Imgur will then generate the thumbnails for you saving a lot of time.
Imgur provides 6 image sizes so you can select whatever the size suits your requirement. The following table shows you the different image sizes available.
Thumbnail Suffix | Thumbnail Name | Thumbnail Size | Keeps Image Proportions |
s | Small Square | 90x90 | No |
b | Big Square | 160x160 | No |
t | Small Thumbnail | 160x160 | Yes |
m | Medium Thumbnail | 320x320 | Yes |
l | Large Thumbnail | 640x640 | Yes |
h | Huge Thumbnail | 1024x1024 | Yes |
For example, if your image is located at http://i.imgur.com/12345.jpg, you can get different image sizes as below;
Small Square - http://i.imgur.com/12345s.jpg
Big Square - http://i.imgur.com/12345b.jpg
Small Thumbnail - http://i.imgur.com/12345t.jpg
Medium Thumbnail - http://i.imgur.com/12345m.jpg
Large Thumbnail - http://i.imgur.com/12345l.jpg
Huge Thumbnail - http://i.imgur.com/12345h.jpg
Source: http://api.imgur.com/models/image
Notice the last character at the end of the image name (before the extension).
If you think I've missed anything, please feel to let me know that by leaving a comment here. Also, if you think this blog post is useful, please consider sharing it with your friends in Google+, Facebook and Twitter.