Live Writer and Lightbox, A Perfect Match
Ever gone to a blog and clicked on one of the thumbnail images, only to have it take you away from the blog post? Annoying, isn’t it. Wouldn’t it be nice if clicking the image just opened that image there in front of you, on top of the thumbnail? Well, you may have noticed that this is in fact something that a lot of blogs now have, for this very reason. Well, that and it looks really cool.
So what are these bloggers using? There are a number of different ways of doing it, but the “standard” seems to be using lightbox. From the lightbox site:
Lightbox is a simple, unobtrusive script used to overlay images on the current page. It's a snap to setup and works on all modern browsers.
Want to see a quick example of lightbox in action? Of course you do. This blog uses it (which you may have noticed from previous posts).
Now, a lot of the popular blog engines (like WordPress, both .com and .org, blogengine.net, etc) have their own plug-ins/extensions for lightbox which implement the script it uses on all images, without you having to do anything. Which is nice. But what if you can’t find the extension, or your blog doesn’t have one at all, what then?
Well first off, you need to go and download lightbox and follow the instructions on how to install the scripts. This is all very well and good, but look at the instructions for when it comes to writing your blog post:
Add a
rel="lightbox"attribute to any link tag to activate the lightbox. For example:<a href="images/image-1.jpg" rel="lightbox" title="my caption">image #1</a>Optional: Use the
titleattribute if you want to show a caption.
You see that? Add rel=”lightbox” to every image you want lightbox to be used on! Well that could become a pain. Well, not if you’re using Live Writer, as for a couple of versions now (from Wave 2), Live Writer has had lightbox support. And even better, Live Writer is set to turn on lightbox by default.
So how do you enable this support? If you’ve installed and set everything else up correctly as detailed on the lightbox website, then all you need to do is go to your blog account options and click Update Account Configuration. On Wave 4, go to the Blog Account tab in the Ribbon and click Blog options. For pre-Wave 4, go to Tools > Accounts > select the blog in question > Edit > Update Account Configuration. That’s it! How simple! Live Writer actually looks for the js/lightbox.js file on your blog and if it finds it, it turns on the lightbox support.
But how can I tell it’s turned on? Again, this is a simple check. Once you’ve inserted an image into your blog post, go to the Format tab under Picture Tools and in the Properties section click on the Link options, this will show you the lightbox options:
Here you can enable the group support for if you have multiple images (point 2.2 in the instructions page).
And that’s it. Now your blog can have that cool look that you’ve seen on other sites and blogs. All with the help of Live Writer.
SL
August 20th, 2010 - 23:54
Great information! I’ve been looking for something like this for a while now. Thanks!
August 21st, 2010 - 07:22
Good post Scott! I wasn’t aware that Lightbox was ‘built in’ to Live Writer. I am now! The Writer team seem to work very closely with the WordPress bods.
August 29th, 2010 - 19:36
Thanks for making such a cool project. I’ve been checking this website for the Windows version, than I never left a comment about it. I discover you are working hard and so doing it targeted free so you shouldn’t feel rushed or anything.
September 5th, 2010 - 21:50
Really nice site! Your writing is so refreshing compared to most other writers. Thanks for posting when you do, I will be sure to return!
December 18th, 2010 - 06:27
I cherished what you’ve got performed here. The format is stylish, your written material elegant. Nonetheless, you’ve got obtained an edginess to what you will be offering the subsequent. Ill absolutely arrive back once again yet once again for an excellent deal a lot much more in case you shield this up. Dont do away with hope if not at the identical time a number of males and women see your imaginative and prescient vision, know you might have attained a fan appropriate the subsequent who beliefs what you could have received to say along with the way you’ve got presented by yourself. Extremely beneficial on you!
January 19th, 2011 - 15:21
I am really thankful to this topic because it really gives up to date information ,;.
April 8th, 2011 - 08:41
Hi,
Is it possible to force the Lightbox option enable even if WLW did not detect the Lightbox?
I used Lifetype blog service, and cannot use relative path to Lightbox js folder.
Hence, I think WLW did not detect my Lightbox script.
February 19th, 2012 - 07:43
hi! I’ve just recently passed to wlw 2011. I’m using blogger as a platform, and when I publish with wlw, pictures won’t open in light box, they open in picassa link. i updaded the theme, be cause I thought that wlw didn’t find the light box js, but still no result. do you have any idea about why is this happening? i’ve searched all over the internet, there is just one thread in google blogger help coming close to my problem, but your post seem to be quite there, except the wlw version.
so, do you have any advise?
thank you in advance.