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/19/2012Less is more, user-centric design, focusing on your user experience, and lots of template manipulat…
-
Featured Blogger Site: Pinch GalleryPinch Gallery in Northampton, MA is a vibrant, eclectic artisan gallery with a focus on art for th…
-
Question: Why is my Blogger blog not displaying correctly in IE 9?As web developers we learn to live with what we call "cross-browser compatibility" issues…
-
Question: Need help moving from Wordpress to Blogger?There are a number of reasons why we recommend using Blogger instead of Wordpress including: 1) fre…
-
Tip: Easy instructions for adding Pinterest to each postAdding Pinterest correct to your Blogger site can be a bit challenging; most people take the easy w…
-
Tip: How do I remove the Blogger bar at the top of my site?This is, far and away, the #1 question we're asked when people see the work we've done with…
-
Transforming a Blogger RSS feed into a slideshowThis tip was created by us to solve a challenge that one of our readers left for us on our Resizing…
Post a Comment
Post a Comment