| Home| Personal BLog| Compositions| Health Avenue|Places| UnEditedMe| Philippines|Monk|

Saturday, November 22, 2008

How To Resize and Make Photos and Images Look Bigger in the Blog Posts?

html tricks making bigger images, photos, pictures in blogsBlah..blah..blah... First of all, I have news and some babbling for all of you my dear (re)dears I would like to tell everyone to ignore my previous post. I am back to circulation of bloggers. When I got back with a good connection, I was surprised to have attained one of my goals: the Technorati Authority of at least 100. I do hope it just go on rising rather than going down or fluctuationg down and up and down and up again.

One of the fellow bloggers just made me think of posting how to make bigger photos in your blog posts or any posts you do online using html codes. I have seen so many small photos around considering I visit too many blogs in a day. I know that NOT all of us want bigger photos but I also know that others want it but they just do not have any idea how to. Just like me when I was starting out in blogging, the biggest image that I could put in a post is 400px by 400px which is the "large" photo as defined by Blogger photo uploader. I have always wanted to have bigger and more defined photos for most of my posts, where the details are shown.
canals, the hague, netherlands, tallest building the hague, tower in the hague, the hague canal
Sample resized image to perfectly fit this post area. If you click the image, it will take you to its original location, which is part of linking images that will be noted in my next post. Stay tuned.

I want to share a knowledge that was previously shared to me as well: how to make the photos bigger. How I learned this was easy: i asked someone who posted so big and so clear photos how he did it and he replied to my PM to him in EC and I got it! That was one way and later on, I learned the tricks and discovered other ways to make it bigger.

How To Make Photos Bigger Yet Lighter?
Naturally, bigger photos have bigger space/bytes in it and so it, more often than not, slows down the page load. To make the photos lighter in the blog, and at the same time make these photos possible to be enlaged, I use free photo hosts (photobucket for me). There are many around there like flickr, photobucket, snapfish, etc, In case of photobucket, that is where I start.

1. Upload the photos to a free image hosting service (i.e., photobucket, flickr, snapfish, etc)

2. Copy the url or html code generated and provided for that image and include it in the post.

3. Resize the photo or image to your desired size

Learn From These Images and Captions
As an example, see that image above. That is an image i put in my other blog, and as you can see, if you click it, it goes where it was originally posted for a purpose. Here, it is posted as an example.

See the following images and I do wish you learn better as you see how with the images and the captions.

enlarging images, how to make photos look bigger in blogs, making photos and images look bigger, resizing image in blog posts, resizing photos, bigger blog photos, bigger blog images, bigger blog pics, bigger photos in blogs, resized blog photos, blogging tips, photo tips, photo techniques in blogs
This is the image and the possible links for various usage. Just copy the link you want at the "Image Link Code" and paste it in your post. You may copy it as well from the album summary but I clicked that photo from my album to put emphasis on it and where the codes can be found. I use the html code rather than the other three because of practicality and ease of editing because html code is more complete than any of the others.

enlarging images, how to make photos look bigger in blogs, making photos and images look bigger, resizing image in blog posts, resizing photos, bigger blog photos, bigger blog images, bigger blog pics, bigger photos in blogs, resized blog photos, blogging tips, photo tips, photo techniques in blogsYou can see here the difference between the raw code that was pasted and what I exactly used in my blog. The blue text means they are original from the copied code while the RED texts indicate the possibility of resizing (adding that code)to the original html code. Take note that the "height" and "width" were not in the original code, just add it and put your own size. Regular blogger size give a maximum of 400px while this one, you can see that I even extended the height to up to 1000px. Just see the difference in the sample image above.

The other new/colored texts in the new code, you will learn what are their purpose in my next post about linking photos and giving them keywords for them to be searchable in search engines.

enlarging images, how to make photos look bigger in blogs, making photos and images look bigger, resizing image in blog posts, resizing photos, bigger blog photos, bigger blog images, bigger blog pics, bigger photos in blogs, resized blog photos, blogging tips, photo tips, photo techniques in blogsIn case of uploading and resizing with Blogger photo uploader, that is even easier. However, I don't directly upload through blogger as I have said earlier, they might overload the site and make my pages load very slow. For blogger uploads, just see the image how easy it is to resize the images.

enlarging images, how to make photos look bigger in blogs, making photos and images look bigger, resizing image in blog posts, resizing photos, bigger blog photos, bigger blog images, bigger blog pics, bigger photos in blogs, resized blog photos, blogging tips, photo tips, photo techniques in blogsThis is the biggest image if one would not resize using blogger.. Can you see the difference between the resized image that I have posted for clarity up??? There is a whole ocean of difference, right???

Take note however that you cannot resize bigger that your blog space, especially the width limit. As for my pages (from this blog), the maximum width that I can allow is 530px. If you have any questions, of if this post is too vague, I always accept constructive criticism. Hope you learned.

21 comments:

  1. oh.... another ways to help bloggers on how to make things even more beautiful in their blogs... it all be simple and easy with the help of the PS software, good thing got some new software here, that would help me enhance images to be displayed in the blog....

    happy weekend dear...

    ReplyDelete
  2. I have always trouble in Blogger uploading of photos. I think your post may help me to clear it.

    ReplyDelete
  3. congrats sistah on your technorati, layo pa lalakarin ko to reach your level hahaha... lapit na rin mag 5 digit ang alexa mo hehehe..

    Thanks for this post, yeah sometimes i want the picture big but dont have idea how...

    ReplyDelete
  4. great tip for bloggers who like to post a lot of photos.

    have fun!

    ReplyDelete
  5. @Nova,
    This is the basic part Novs... ^^ and I still prefer the manual way for keywording and linking to the very specific post for that photo or image. This part is not yet covered in this post yet though.. but I think that will be the next.

    @Cosmos,
    I'd be more than happy and a satisfied blogger if it would solve your problem. ^^

    Let's cross our fingers then.

    @ Rose,
    Yes, in fact i am aiming 5 digits with Alexa but I think that would be in around 2 weeks from now... My traffic building got broken with my last week's internet connection problem. So bad!

    @ Liza,

    Indeed my dear.. just like me, i like bigger photos if it is a place or attraction.

    ReplyDelete
  6. im back to deliver this..

    http://liz.mommyslittlecorner.com/2008/11/power-blog-award.html

    see yah

    ReplyDelete
  7. Wow. Great article. Makes for great reading and also something to work on/with on my own blog. Thanks!

    ReplyDelete
  8. Wow this is an extremely useful post. Often I add images in my posts and sometimes the pics are too small or too big or they are too heavy. I will implement these tips on my blog.

    ReplyDelete
  9. I hope it is new news
    so I can inform the other friend
    I interest with your blog
    I will come here again and contact my while you have news articles....
    thanks...
    http://tiyoavianto.blogspot.com

    ReplyDelete
  10. Hi!
    I like to experiment with new things, so I think it would be fun to try something new. By the way, I still could get to place this Post Comment garget to my blog. Could you please assist & let me know where to get it and how to post it to my blog.

    Thanks very much in advance,

    ReplyDelete
  11. @ Liza,
    Thanks for that Liz. It has been posted already in my main page. DO you see that little square in my side bar? ALl the awards are there and one of them is yours. Thanks once again.

    @Moserw,
    Thank you for apprciating. I am happy when I see comments like yours, and i do hope they are sincere. ^^

    @Ivs,
    Indeed that is a very good idea.

    @Madel,
    Hope it can help you.

    @elec mechanical,
    I know there have been similar instructions like this but this one, i famed it myself and even the samples are real acts i took from what I am/was actually doing.

    @Lily Arbee,
    I will make another comment just for your query.. It takes a little time eh. ^^

    ReplyDelete
  12. @ Lily Arbee,

    All right, as promised, here is the answer to your question.

    1. Log in to your blog account.

    2. Instead of the regular blogger homepage, go to http://draft.blogger.com

    3. Click "SETTINGS"

    4. After landing at the settings page, click "COMMENTS"

    5. After arriving at a new page, go to the third row, down, named "COMMENT FORM PLACEMENT" and you will see that there are three (3) options there.

    6. Check the radius (little circle that you can check) corresponding to "EMBEDDED BELOW POST"

    7. Save your changes.

    Take note that this works on the main blog as I remember.. Thus, you have to try first if it is working by making your own comment first. You dont want to lose comments if the form is not working, right?

    Or you can comment back here if you have done so, and I will see and try to comment if it is working. Okies?

    Another trick is to have patience.. I needed to try mine many times because I have 2 blogs here.. What did was, make the current blog the main blog (in this particular blogger account), then make the form. After, I shifted the main blog to my another blog here and make the form. Now both of them have that comment form just below their individual posts..

    IF YOU HAVE ONLY ONE BLOG IN YOUR ACCOUNT, THAT WOULD BE EASIER!

    ReplyDelete
  13. Finally I found the tutor here...thanks for the nice info..nice to see this blog

    ReplyDelete
  14. Great post, thanks for this tip, I´m using it in some of my blogs.

    ReplyDelete
  15. To be honest, just use blogger in draft. Its so easy and you can re size it very easy using it. You can adjust it to any size you want without having to mess with the html code. Nice work though but I think this article will become out dated soon.

    ReplyDelete
  16. Hello Webbielady:
    That's an amazing blog post about how to resize photos. I am not a programmer, but I am beginning to understand some simple coding, and your explanation makes it a lot clearer for me. Thanks for the tip. It is very useful info for me.

    ReplyDelete
  17. I used to use the medium size photo's uploading directly to blogger, when I read about optimizing photo's, which was two fold...the size (so I switched to small), and the use of alt test. Which still isn't 2nd nature to me.

    The small pictures are sometimes too small for my liking.

    Is there any other photo space that gives you html code for pictures? Flicker doesn't, and last time I used snapfish they didn't either. I find photobucket a bit awkward to use; but perhaps it's because I'm not used to it.

    Sandy

    ReplyDelete
  18. Hi, I have a small problem with images on my blog (http://nutsandboltsandflyingsparks.blogspot.com). I use Windows LiveWriter to make my posts. I normally upload images as 1024x768 to my blog, with a thumbnail on the post page. When I click on the image, it opens out as a 1024x768. I would like it to auto-resize to smaller browser screens, and thus allow the user to use the magnifying-glass-thingy if he wishes to enlarge the image.

    I hope I've been clear enough in stating my problem.

    Thanks!

    ReplyDelete
  19. Thanks a lot for the tips...i just applied it in my blog. greattt !

    ReplyDelete

Leave your comment and I will get back to you. I suggest if you want me to comment back on a specific post of yours, use the "name/URL" option and put your exact link so that I will be on that post and I can share my views through your comment form immediately.

Don't forget that unrelated or irrelevant comment to any post will not be publish.

Check the following out as well:
My original writings as both an author and a poet
Some of my travel logs
Just trying to be healthy
Be a Webbie individual: check this out
Personal Site
Photo n Personal WebSite

There was an error in this gadget