Something that we've discovered is that there is more to the crazy URL string that you get when uploading to Picasa then meets the eye. In fact, you can use that crazy URL to your advantage, having it automatically resize images (uploading a large size than having it generate small, optimized versions to your page needs) and automatically thumbnail images to a specified square dimension.
For example, this is the link to the full size image that I upload through Blogger:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIWzTh5RoI5-IYlobcB67qsWtNvWdRNKRDnjOvWKjswZ-_YHCVCf72TgDOXZ4oc2RI79BWe0G24BOr30_jwut2B_GrjsihZTDcT5i-BK6du36gw-hmP5soN0Eqc5CV8dHa_CshoKnmrtFR/s320/%255BUNSET%255D
Changing the s-value
By adding a value (s150) before the filename, I can get the image returned but resized to a specified dimension with a maximum dimension of 150 pixels:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIWzTh5RoI5-IYlobcB67qsWtNvWdRNKRDnjOvWKjswZ-_YHCVCf72TgDOXZ4oc2RI79BWe0G24BOr30_jwut2B_GrjsihZTDcT5i-BK6du36gw-hmP5soN0Eqc5CV8dHa_CshoKnmrtFR/s150/%255BUNSET%255D
Changing the optional flag
Other variations on this include adding -c, -p and -d to this string, each with different results, and there are others that have specific uses from other Google applications, but the below examples have been the ones that we've found ourselves using for various projects.
Optional -c flag
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIWzTh5RoI5-IYlobcB67qsWtNvWdRNKRDnjOvWKjswZ-_YHCVCf72TgDOXZ4oc2RI79BWe0G24BOr30_jwut2B_GrjsihZTDcT5i-BK6du36gw-hmP5soN0Eqc5CV8dHa_CshoKnmrtFR/s200-c/%255BUNSET%255D
This returns a square crop of the image to the specified dimension. If the image is a rectangle it returns the largest square of that rectangular image, then returns it in the specified dimensions.
Optional -p flag
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIWzTh5RoI5-IYlobcB67qsWtNvWdRNKRDnjOvWKjswZ-_YHCVCf72TgDOXZ4oc2RI79BWe0G24BOr30_jwut2B_GrjsihZTDcT5i-BK6du36gw-hmP5soN0Eqc5CV8dHa_CshoKnmrtFR/s200-p/%255BUNSET%255D
This returns a center-square of the original image with the specified dimension. You'll notice how this is different than the -c flag above.
Optional -d flag
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIWzTh5RoI5-IYlobcB67qsWtNvWdRNKRDnjOvWKjswZ-_YHCVCf72TgDOXZ4oc2RI79BWe0G24BOr30_jwut2B_GrjsihZTDcT5i-BK6du36gw-hmP5soN0Eqc5CV8dHa_CshoKnmrtFR/s200-d/%255BUNSET%255D
This prompts to download the image.
Popular
-
Hangout On Air: Friday Request Line for 10/12/2012Web fonts, social sharing, focusing on your user experience, rel=author and much more more!
-
Tip: Automatically resize your Blogger post's imagesYou've been blogging along for a while now, inserting your images into your blog posts and sizi…
-
Tip: A better automatic thumbnail and summary script for BloggerWhen we first started creating custom websites using Blogger, one of the first real script needs th…
-
Create a custom Picasa slideshow in BloggerIn creating a website within Blogger, one of our first real challenges was developing a way to prov…
-
Hangout on Air: Understanding RSS feeds for BloggerYesterday's Hangout on Air was a doozy! In under 30 minutes we discussed RSS feeds, the feeds p…
-
Tip: Adding interactive captions to your Blogger images on hoverFor a long time I've been disappointed with the way most content management systems provide ima…
-
Opinion: Forget about SEO, develop a user-centric content strategyWe don't like talking about Search Engine Optimization, nor do we like focusing on it in any si…
Post a Comment
Post a Comment