Blogger Hack: Creating Thumbnail Pictures

Please click on the title to go to the archived page.

19 comments:

Vivek Sanghi said...

Hey that sounds like a nice hack. Though I have not checked it out (constrained by time as I got an exam coming up) it sound like a good alternative to image host like flickr etc. If some one is using google page creator, they can try to upload images on to the google server and call it to their blog using this hack. It will work very fast. However, they can use the source image links as well. For a blog like mine with many scripts in template, I'd prefer uploading images to google server.

Hoctro said...

Hi Vivek,

The post is served also as a suggestion for further enhancements, such as having 20 links/pics, and have a Javascript that randomly shows a pic of the day, for example.

Any way, good look on your upcoming exam!

Cheers,

Raquel said...

This is cool, thanks. I tried and it works good. Thank you very much

Hoctro said...

Thank you Raquel for stopping by! I'm glad it works on your site. Have a nice day!

Ramani said...

Hoctro, if you edit all the old posts , they will all appear in your feed again. For ex. this post and few others have reappeared. This might confuse subscribers to your feed. I hope you know about this.

Hoctro said...

Hi Ramani,

Yes, I kinda khow about it, and I'm re-editing the posts and their labels, starting from the first post, so hopefully nobody (but you) will notice :) cuz by the end it's the same all ocer again.

Cheers,

Mike said...

This is a really useful hack but I wanted to link large images so the page load was slow and the scaling made the pictures look rough.

I amended the link code for a slightly different approach, replacing the data:link.target in the href with data:link.name, so that by replacing the non-displayed title in the Link List (pic1,pic2 etc.) with the URL that I wanted to link to, I could use a specifically saved thumbnail in the Link List's URL field, while the actual link target is stored in the Link List's name field:

<a expr:href='data:link.name' onblur='try {parent.deselectBloggerImageGracefully();} catch(e) {}'><img alt='' border='0' expr:src='data:link.target' height='100' style='display:inline; margin:0px auto 10px; ;cursor:pointer;' width='100'/></a>

This also means that you don't have to link to a bigger image at all, but could use full web page link instead. Of course, the Link List will have to be sorted manually in this case if a specific order is required.

I've implemented this in the sidebar of my blog at http://busanmike.blogspot.com/ - I've used this to link to actual web-pages rather than just the images.

Hope this helps anyone wanting to implement the same type of thing.

Hoctro said...

Thank you Mike,

Your modified hack looks great and neat on your blog.

This was one of my earlier, explorating hacks. I'm glad you take and tweak it to become a more practical widget.

cheers,

Kalyan said...

Hi there, can you give the code for thumbnail view for the non-beta blogger template.

Hoctro said...

I'm sorry but I don't think Classic Blogger has widgets to implement.

cons said...

thanx for posting your hacks, hoctro

:)

but...

i have a problem, thumbnails don´t look good with explorer

do you know how to fix it?

thanks

Hoctro said...

Cons, What can I say, it's hard to please both worlds. I'm especially fond of Firefox, so my developments are geared toward that platform. Bit I'll look into it and let you know.

cons said...

hi, it´s me again...

i added to my blog your "creating thumbnail pictures" and "turning labels into tabs" hacks

The thing is:
my blog looks great from a pc, no matter if i´m using explorer or firefox, but...

If I see my blog from a mac, whether in safari or in explorer, everything goes wrong... everything

:(

i'm sure you're busy but, would you mind to take a look?


thanks!

Hoctro said...

Cons, even blogger claims their blogs and users' blogs only work in certain platforms.

I would suggest you to try one of my 3-column minima templates, since Yahoo! claims their system works great for their so-called A-grade browsers.

If you could post a picture of your blog in Mac it'll be great too. Sorry but I'm one of those people that never use Mac. I only study on Mac with Adobe's Photoshop & Illustrator CS2 once.

cons said...

thanx hoctro

i only want people could read my posts in any platform...
those using macs can´t read anything at all :S

it doesn´t really matter to me if they can´t see the template as it should be


so... i´m planning to change letters to gray :P

i have just posted 2 pics in my blog, you will see there is a mess :p

Sarah Trefny said...

Thanks for this hack Hoctro, it's exactly what I wanted for my painting blog!

natnit said...

Thanks, this is exactly what I wanted for my blog. Nice, simple tutorial.

Tommie Carter said...

Nice hack -- now that you have gone this far I naturally want more... How tough would it be to simulate the way that MSWord handles text and pictures. Namely the picture is within a frame and can float around text (or rather the text can float around the image. An example of this an be seen in any newspaper or magazine article having pictures...

Why not in a blog?

Boffill said...

can we make it a Picture of the day gallery?? and i'd like to put it on the side bar.. if its fine... waiting for your reply


http://ficospeaks.blogspot.com