Picasa for BlogEngine

15. January 2009 22:40 by rtur.net in Extensions  //  Tags: , ,   //   Comments (35)

There is new extension in town. It is built on Picasa SlideShow, but it adds web album functionality to it, this is why I decided to package it as separate extension. After all, it is not a slide-show any more, not just SlideShow at least, so I did not want name to cause a confusion. I also bundled it with LightBox – it uses it to transform thumbnails into larger pictures. It is optional, and if you opt to, you can ignore LightBox files when coping extension to your blog. Installation process is basically the same, you just copy files to corresponding locations and then go to Extensions/Edit section.

pics-3

Once you on the settings page, enter your Gmail account info and set sizes for SlideShow and album thumbnails. If Auto Play is selected, SlideShow will start playing on the page load. To use either one, just copy generated by extension tag and paste it in your post. As you can see, ugly IDs gone – I figured a way to use album names instead, which look nicer and easier to use. Protected albums won’t generate any tags – but you can manually add them to the post using same template ([album/show:name]) if you know what you are doing. These albums will only be accessible if user logged into Gmail with credentials you specified in the settings, so it is not really useful and may be confusing and I let tags from protected albums out by default but still listed albums themselves, again because I think it would be confusing if you won’t see them in the list.

pics-2

In the “ReadMe” file there is sample CSS styles that used to style album shown below. You’ll need to add it to Style.css in the theme of your choice. Customize styles if album does not look right for your blog.

Sample Album

The word of caution: in your album names, try to use Latin letters and avoid funny characters. I noticed that Google uses album titles in the URLs generated by APIs, replacing HTML unfriendly letters, which might lead to unexpected results.

Picasa.zip (80.37 kb)

Comments

Michel Tol
Michel Tol
1/27/2009 2:28:03 AM #

Hi,

I just gave your extension a test drive and I found out that the zip package is not complete. I was missing the following dll's:
Google.GData.Photos.dll
Google.GData.Extensions.DLL
Google.GData.Extensions.DLL

I donwloaded from your slideshow extension, that did the trick...

rtur.net
rtur.net
1/27/2009 9:45:07 AM #

I was missing the following dll's:
Good catch, I'll update package. Thanks!

cj
cj
1/29/2009 10:03:33 PM #

hey man, another great post.

i actually created a similar extension for flickr: you simply enter [autoflickr:] in your post and it picks up your default private flickr image for the default date range.

demo here:
http://webguide.hopto.org/autoflickr_DEMO/

rtur.net
rtur.net
2/3/2009 10:15:27 PM #

Very cool! I'll actually going give it a try as one thing that was holding me with flickr was not been able to show private images. I haven't spent any time looking into it and did not find readily available solution as yours, and I kinda like Picasa anyway, but flickr can always come in handy, thanks for sharing.

Jim
Jim
2/4/2009 8:34:17 AM #

Hey, thanks for creating and sharing this, looks great.  I just downloaded and uploaded this and your other Picasa extension and gave it a try.  But I am getting this error:

Object reference not set to an instance of an object.

Any suggestion?

Jim
Jim
2/4/2009 9:04:59 AM #

I think I found the problem, but do not know how to resolve the problem.  Prior to me trying your Picasa Extension, I was using LightBox (a different version).  Read about it in my post here: http://jim.blacksweb.com/post/BlogEngine-Lightbox-Extention-and-Live-Writer.aspx

Not only does Picasa not work, but my existing LightBox extension doesn't work does not work either.

Any sugesstions beside uninstalling one or the other?

rtur.net
rtur.net
2/4/2009 9:43:43 AM #

Jim, I think you have this problem because both "boxes" use jQuery and having 2 jQueries results in the javascript errors. I'd suggest removing lightbox from picasa extension - it should use one you already have. If you have both slideshow and picasa, you can remove slideshow too - it duplicates functionality you have in picasa already.

Jim
Jim
2/4/2009 10:13:57 AM #

I removed all files regarding LightBox, All files regarding Picasa (both extension).  Reloaded the site.  Then I uploaded just your Picasa (2009_1_Picasa.zip) with included LightBox.  My images using LightBox now work.  But I still get the error: "Object reference not set to an instance of an object" in the blog post for both a Show and Album.

I am using BlogEngine 1.4.5.  You can of course view the post by clicking on my name at the end of this post.

Any other ideas?

Jim
Jim
2/4/2009 5:00:16 PM #

I have removed, and re-added the Picasa extension several times, including changes to the theme .css file, but it still does not work.

Other Extensions I have installed includeFrownin case this info helps)
AkismetExtension
BBCode
BreakPost
CodeFormatterExtension
PostSecurity
ResolveLinks
SendCommentMail
SendPings
Smilies

rtur.net
rtur.net
2/4/2009 11:37:49 PM #

Jim, do you have google DLLs in the bin folder? They were missing in the early download...

Jim
Jim
2/4/2009 11:46:14 PM #

Yes, 3 of them.  
Google.GData.Client.dll
Google.GData.Extensions.dll
Google.GData.Photos.dll

would you rather email me direct, instead of all these comments?

Jim
Jim
2/5/2009 7:54:56 AM #

I thought some how this may have something to do with my host (WebHost4Life), so I installed this Picasa extension on my local box and I get the same error.  I really like this concept and using Picasa functionality and storage.

Maybe I will have to look into getting the BlogEngin.net source, add the extension and debug to see what is going wrong.  Any pointers where to start?

John Lafitte
John Lafitte
2/5/2009 3:48:14 PM #

Eh, you have almost completely duplicated what I built.  I used highslide instead, and public albums instead of logging in to picasa.  Other than that they seem pretty similar.  Smile

John Lafitte
John Lafitte
2/5/2009 3:49:54 PM #

Wait, that came out wrong, I didn't mean you copied it, I just meant we built the same thing.  In fact, I notice this post is days before I even posted about mine being closed to finished, so I'm sure you did yours before mine.  I should have waited, saved myself some pain!  Smile

Jim
Jim
2/6/2009 10:23:38 AM #

@rtur,
With the code suggestion you made on the other posting for PicasaSlideShow, I was able to make your Picasa extension work.  Below are the changes, lines in bold are what I added.

private string GetSlideShow(string albumId)
{
    string s = "";
    try
    {
  if (_settings == null) InitSettings();
        PicasaService service = new PicasaService("exampleCo-exampleApp-1");

private string GetAlbum(string album)
{
    string retVal = "";
    try
    {
  if (_settings == null) InitSettings();
        PicasaService service = new PicasaService("exampleCo-exampleApp-1");

Thanks again for sharing this extension.

Jim
Jim
2/6/2009 10:32:25 AM #

@rtur,

"Click Next and Previous on images in LightBox"

I noticed that the Picasa Album pictures launch in LightBox, but you can not advance forward or backward in the album.  For this to work in my other posts [http://jim.blacksweb.com/post/BlogEngine-Lightbox-Extention-and-Live-Writer.aspx]
you need to uniquely identify images in a group by adding "[GroupName]" after lightbox in the rel property in the anchor tag.

Example:
rel="lightbox[blacks]"

So I tried this with our code:
retVal += string.Format(_img.Replace("lightbox", "lightbox["+album+"]"), firstThumbUrl, contentUrl);

But this broke the whole lightbox thing and the images loaded in a blank window instead of lightbox.  Note the rel property was properly set.  I am assuming the error or problem is due to putting the images in a list item tag <li> within an Orderd List <ul>.

What do you think?  Have you tried this?

Jim
Jim
2/6/2009 10:33:56 AM #

Unfortunately I can not edit my own comments... but above I did NOT mean to imply that this is our code.

"So I tried this with our code:"  should have read "So I tried this with your code:"

Sorry.

cj
cj
2/25/2009 3:10:30 PM #

if you need help with autoflickr please let me know

pingback
mefeozer.wordpress.com
3/10/2009 7:56:51 PM #

Pingback from mefeozer.wordpress.com

Create Data File for SlideShow2 From Picasa Web Albums « M.Efe Ozer’s Weblog

Paolo
Paolo
3/31/2009 10:09:31 AM #

Great extension... very good job

Paolo
Paolo
3/31/2009 10:31:31 AM #

uhmmm just a question
how can I have lightbox working on my site? I didn't copy the Lightbox dir into it

where these files has to be copied?
there's anything to set?

thanks

rtur.net
rtur.net
3/31/2009 11:50:36 AM #

You should have lightbox running by just coping folder to your site root.

Paolo
Paolo
4/1/2009 8:19:11 AM #

I did it but the strange thing is that the lightbox test page works fine but your extension doesn't load the lightbox script into the page...

no errors just the js isn't into the html code so lightbox doesn't work

any suggestion?

rtur.net
rtur.net
4/1/2009 8:45:00 AM #

It shouldn't load js, it only add attribute to the image so that lightbox (if present) can use it. There is lightbox.cs file in the ~/app_code/estensions folder in the package you downloaded. That is the one responsible for loading js to the page. You have to copy it to your extensions folder for lightbox to work.

Paolo
Paolo
4/1/2009 9:11:21 AM #

yes I did it but in the page I load your appcode there isn't the tags that load the javascript libraries

without that the attribute doesn't work

don't know why it doesn't load it

Luis
Luis
4/9/2009 7:46:36 PM #

I'm having the same problem
it doesn't work when copying over directories as instruccted in the
readme file.

Let me know if you've found the solution.

Thanks.

Luis
Luis
4/9/2009 8:32:46 PM #

Never mind figured it out. I had to restart IIS
in order to re initialize the extensions.

Luis

ikaran
ikaran
4/12/2009 10:57:49 AM #

any idea why i am getting the following error
Execution of request failed: http://picasaweb.google.com/data/feed/api/user/******/album/My Test Album?kind=photo

I can see the album lists in extension manager.

rtur.net
rtur.net
4/12/2009 11:49:51 AM #

Try to create a test album with no spaces in the name and see if it will fix it.

ikaran
ikaran
4/13/2009 4:02:19 AM #

cheers rtur

did the trick

ikaran
ikaran
4/13/2009 4:40:07 AM #

hi rtur,

is there are any way of retrieving the photos caption, while viewing via lightbox?

ikaran
ikaran
4/13/2009 8:45:35 AM #

I think I've resolved the caption issue, by using the 'title' attribute and 'entry.Summary.Text'

static string _img = "<li><a rel=\"lightbox\" title= '{2}' href='{1}'><img src='{0}'></a></li>";

retVal += string.Format(_img, firstThumbUrl, contentUrl, entry.Summary.Text);

rtur.net
rtur.net
4/13/2009 8:43:50 PM #

Cool, thanks for sharing. If you'll come up with new ideas on using extension drop the line here, may be there will be a need for another version in the future.

trackback
RTur.net
6/14/2009 9:40:01 PM #

Picasa with HighSlide

Picasa with HighSlide

trackback
Black's Web
3/16/2010 10:27:26 PM #

Extension Manager bug in BlogEngine 1.4.5

Extension Manager bug in BlogEngine 1.4.5

Comments are closed

Text Widget

Lorem ipsum dolor sit etconsectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.