September 23, 2009

Widgets

Direct Linking To Picasa Images. Who Says You Can’t Store-Save-Upload Animated Images in Blogger


Animated GIF Image saved in blogger blogspot blog The reason why you can’t show animated images in your blogger posts once you upload them to your account is really simple to answer. By default blogger displays all images uploaded directly from blogger editor as static images and show only one instance of the in-motion image. But there is a way round by which we can really embed animated GIF images in our blogger posts by using the same Picasa Web Album account used by Blogger to store our images. Want to know how? Kindly Follow the steps below,

 

  1. Log Into Your Picasa Web Album Account By Visiting picasa.google.com
  2. Create A New Public Album
  3. Upload Your Animated Image
  4. Obtain The Direct Link To your Uploaded Image
  5. Finally Upload The Image in Your Blogger Editor and Edit it!

 

1.   Log Into Your Picasa Web Album Account By Visiting picasa.google.com

Click the upload button at the top right corner, as shown below,

Upload-button-in-Picasa

 

2.   Create A New Public Album

Once you click the upload button a small window will pop-up.

Click create a new album link 

 Create-a-new-album

 

Set your title and choose the Public Share Option as shown in the image below,

Give-your-Picasa-Album-a-ti  Then click the Continue button to get to step# 3 as discussed below,

3.   Upload Your Animated Image

 

Now browse to locate your image saved in your hard driveBowse-the-file-from-your-ha

And then click Start Upload, which will take you to step # 4

4.   Obtain The Direct Link To your Uploaded Image

After the image is uploaded , a small thumbnail of the image will appear. Click this thumbnail image to get to the original size

 click-the-uploaded-image

 

You will now have to click the link at the right-hand-side entitled “Link to this Photo” as shown below,

Copy-the-direct-link-of-you

Now the important part,

  • Check the image only (no link) box
  • Set image size to original
  • Copy the code under Embed image and that’s the Direct link to your Image!

5.   Finally Upload The Image in Your Blogger Editor and Edit it!

Now go to your blogger Editor and click the image icon to upload an image as you  usually do.

Here you will have two options, either to upload an image from your hard drive Or add an image from the web. If you choose the first option your image will appear static and no animation will occur but since we want the image to appear animated therefore choose the second option and paste the Direct link to your Image just next to URL

Look at the image below for better understanding,

Add-Image-URL-that-you-copi

Alas! you successfully added an animated image to your blogger editor without using Image services like Photobucket etc.

Now you can play with your image by resizing it and aligning it as you normally do.

Edit-Your-Uploaded-Image

 

That’s All!

The Best Shortcut:

If you are using Windows Live Writer than you will simply need to upload the image to your Live Writer from your Hard Drive and that’s it! Once the post is published the image will appear animated by default. I do the same to upload MBT Animated Icons.




If you enjoyed this post and wish to be informed whenever a new post is published, then make sure you Subscribe to our regular Email Updates!

If you don't want to get yourself into Serious Technical Trouble while editing your Blog Template then just sit back and relax and let us do the Job for you at a fairly reasonable cost. Submit your order details by Clicking Here »

9 comments:

Marg on Sep 24, 2009, 5:36:00 PM said... #

Wow, that sounds like fun. Going to do that today. It would be great to have animated pictures on my blog.

Mohammad Mustafa Ahmedzai on Sep 25, 2009, 1:31:00 AM said... #

Yeh sure Marg. Animation will surely give a livelier look to your pets and your blog :>

jer said... #

that was just awesome trick! Love you thks a lot.

jer from italy

Beben on Jan 22, 2010, 7:20:00 PM said... #

huaaaaaaaaaaaaaaa...this is trick for get pic with extention GIF...BAH!!!
thanks thanks

Anonymous said... #

Very well set out help section. Thanks a lot. I assume this would work with tumblr too. Keep writing, you've got some talent!!

Ann on Sep 10, 2010, 9:25:00 AM said... #

This is absolutely the best description of this that I have found on the web. THANK YOU so much. Visit my blog to see my progress :)
www.kindermusikmtcarmel.blogspot.com

Omoniyi on Jun 26, 2011, 5:21:00 PM said... #

Things have since changed on google.I think there is need for an updated version of this write up as I could not move forward when I got to picasa.Please assist

Nitin Ule on Feb 14, 2012, 8:08:00 PM said... #

Original size option is not ther now.. google has "fixed" now

john on May 20, 2012, 9:41:00 AM said... #

Dear mohammad, when i try to upload my animated image as favicon it shows the following error.

Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
XML error message: The value of attribute "href" associated with an element type "null" must not contain the '<' character.

I have followed your below post to upload favicon directly with out scrolling text . I have uploaded pic to picasa.

http://www.mybloggertricks.com/2011/03/how-to-add-animated-favicon-in-blogger.html

Plz help.

Click Here To add Comment

Confused? Feel free to ask

Your feedback is always appreciated. We will try to reply to your queries as soon as time allows.

Note:
1. To add HTML CODE in comments then please use our HTML Encoder
2. You can always Test the tutorial on our HTML Editor
3. No cheesy/spam Comments tolerated Spam comments will be deleted immediately upon our review.

Regards,
Mohammad

Support Us

If our Tutorials have helped you a little, then kindly spread our voice using the badge below:-

or try a Beautiful Banner


Widgets

 
  • MBT Icons and buttons

    Icons and Buttons

    Our resources have been successfully downloaded over 10K times and found almost every where. Get yours!

  • choosing webhost for a blog

    Why HostGator?

    Learn Why we chose HostGator as our Web Host and find discount coupons to kick start your blog today!

  • SEO Settings for blogger

    ALL IN ONE SEO PACK 2012

    Learn every single SEO tip that will boost your blog's ranking and organic traffic. We got them all!

  • Blogger widgets and plugins

    Visit MBT's Blogger LAB

    Why not take a tour of all great Blogger widgets published so far? You Name it we have it!

  • become a six figure blogger!

    Become a SIX FIGURE BLOGGER

    Learn what it takes to become a successful entrepreneur and build a living online!

About The Author

Hi! I am Mohammad, a certified SEO Consultant, Pro Blogger, Computer Engineer and an addicted Web Developer. Read More..

Recipes

SEO Affiliate Marketing Social Media

Make Money Online Web hosting

Blogging Tips Web Designing

Plugins and Widgets Blogging Ethics

Recent Comments

Popular Series

Powered by:

My Blogger Tricks © 2013. All Rights Reserved | Contact |