Shashin 3.1, with Fancybox

Update 3/9: I’ve uploaded version 3.1.2 of Shashin, which makes two improvements: the code for handling the FancyBox captions is now cleaner (no HTML embedded in the title attribute) and the navigation controls in slideshows now don’t overlay controls for videos (so you can use the video controls now).

Update 3/7: I’ve uploaded new versions of Shashin and Toppa Plugin Libraries that corrects the installation bug in Shashin 3.1 that was affecting new installations. You will need to update both plugins.


Shashin 3.1 is now available for download at wordpress.org. I’ve added support for WordPress multi-site installation, and improved error reporting when there are problems with album synchronization. But the biggest change is that, due to a licensing conflict, I have removed Highslide and replaced it with Fancybox 1.3.4. Highslide uses a Creative Commons license, which is not compatible with the GPL, and all code in the wordpress.org plugin repository must be GPL compatible.

While the visual style of Fancybox is different from Highslide, the functionality is mostly the same. However, there are a few limitations with Fancybox:

  • Loading Twitpic photos may be slow. Twitpic URLs for photos redirect to cloudfront.net, and Fancybox is unable to resolve redirects. I added my own code that resolves the redirect before passing the link to Fancybox, but this means two calls for loading every photo.
  • Fancybox requires this approach to the code when mixing videos in groups with photos, and this approach if you want to dynamically set the dimensions of a video, and the two are not compatible. I decided including videos in groups was more important, so video dimensions are fixed for all videos (you can set your desired video size in the Shashin settings page).
  • A related issue is that the Fancybox overlay for navigating videos in groups overlaps the video controls, which means you can’t pause, adjust volume, etc with videos if they are in groups. This is simply an unfortunate limitation of Fancybox. As of Shashin 3.1.2 this is no longer a problem.

So why Fancybox? Despite these issues it is still one of the more robust viewers available, and it is GPL compliant. Highslide, PrettyPhoto, and even the just released version of Fancybox (2.0) all use GPL incompatible Creative Commons licenses.

Making the transition to Fancybox was a huge effort. I’ll be willing to entertain including another GPL compatible viewer if you can recommend one that doesn’t have these technical limitations, but not right now 😉

48 Comments

  1. Josh Comstock March 6, 2012

    I just upgraded this plugin and now I’m getting this error on my site: Shashin Error: Invalid data property __get for fancyboxCyclic

    Any help would be appreciated.
    Thanks!

  2. Mike March 6, 2012

    Deactivate and re-activate Shashin and that should take care of it – for some reason the automatic upgrade does not seem to actually do this every time (that’s a wordpress function, so I can’t fix that)

  3. Josh Comstock March 6, 2012

    It worked, thanks!

  4. Kim March 6, 2012

    Just upgraded as well and had a small question.

    The controls for a slideshow seem to be gone, do I have to activate them elsewhere ?

    Too bad all my video albums suffer from the overlay problem 🙁
    Don’t know how I’m gonna solve it quickly.

    Thanks for all the work

    • Mike March 6, 2012

      They should work – could you give me a link to your site and tell me what browser you are using?

      • kim March 8, 2012

        Hey Mike,

        My site is still under construction but here you go.
        This is a link to a photo gallery, where I can’t seem to find a slideshow control anymore :
        http://www.nearlynomad.com/trips/the-burren-way-2010/photos-the-burren-way-ireland-2009/

        This is a video gallery, but I guess the control problem can’t be fixed, so I might wait before I add more pages with videos.
        http://www.nearlynomad.com/trips/new-zealand-2010-2011/videos/

        Browser is chrome last version and I use the suffusion 4 theme.
        If I want to use other fancybox2 or another viewer how do find what “rel” I need to use ? I searched a bit but couldn’t find a nice “rel” list or something.

        Thanks in advance

        • Mike March 9, 2012

          Hi Kim – I took a look and the nav controls are there, they just work differently from highslide. You need to mouseover the left side or the right side of the picture, and then they appear.

          I upload a revision to Shashin today that solves the overlay problem with the video controls.

          Also, I am working on a Highslide add-on that I will make available outside of wordpress.org. I hope to have it ready within a week.

          • kim March 10, 2012

            Thanks for all fixing you’re doing Mike.
            I just updated to 3.1.2 and saw that under every thumbnail there is “view at picasa” and a “close x” as you can see here(same with the picture gallery) http://www.nearlynomad.com/trips/new-zealand-2010-2011/videos/

            My videos are coming from picasa and the left and right arrow navigation controls still overlay the video controls.

            Oh and about the nav controls, I was really looking for the start and stop for an automatic slideshow, but couldn’t find it.
            Did not find a place to set the time delay for the pause between pictures either, but I’m pretty sure it’s because you had to get this out very quickly.

            Thanks again for the support but make sure you don’t forget to go out and catch some fresh air 🙂

          • Mike March 10, 2012

            Hi Kim – the nav controls still overlaying the video controls and the “view at picasa” text showing up on the page are both being caused by a problem with you shashin.css file. You can see it here – for some reason all the lines breaks have been stripped out, so the web browser can’t read it:

            http://www.nearlynomad.com/wp-content/plugins/shashin/Public/Display/shashin.css?ver=3.1

            If you uploaded shashin to your site by FTP, it’s possible you have an incorrect setting in FTP client (FTP clients have settings which handle converting line break differences between unix and windows computers). Your shashin.js file is like this too, but .js and .php files still work without linebreaks.

            I still need to add the timed slideshow option. However fancybox does not have any built-in support for a “pause” function like Highslide.

  5. Remco March 6, 2012

    Hi,
    Tried to upgrade from an ancient version of Sashin. No succes.. got the same error as Josh Comstock. As this was my local test db I’ve just deleted all wp_sashin* tables that were there.
    Creating the table wp_sashin_album didn’t succeed. Maybe this is the error?
    ATM I’m not able to enable the plugin at all 🙁

    • Donovan March 6, 2012

      Hi,

      I am having an issue on activating the plugin… now getting following error.

      Shashin Error: Failed to create table wp_shashin_album

      I blew away everything first… go rid of toppa libraries and old sash in….then installed them fresh/new… but still getting above error when trying to install sashin.

      I know rolling out new versions of stuff can be a pain, and understand why you had swap out Highslide (and probably quickly upon request… as I see other people in the plugin community who were using high slide also had to recently and quickly pull it from their plugins:) ). I am sticking with you man !… Your work is solid. Will be patient as you figure out these bugs :)… thanks.

      Donovan

    • Mike March 6, 2012

      If you’re upgrading from a version before 3.0, there are links in the admin that guide you through the upgrade process, but it sounds like it’s too late for that. You can’t create the tables by hand. If you’re starting fresh, make sure you also have the current version of Toppa Plugin Libraries

    • Mike March 8, 2012

      I uploaded a fix yesterday. You’ll need the latest version of Toppa Plugin Libraries also

  6. Donovan March 6, 2012

    excuse me. I meant getting the error when trying to “activate” the plugin, not “install” the plugin. Install works, subsequent activation is where the issue is. :). Just to be clear.

    • amdacoba March 6, 2012

      To me it is exactly the same

      • Mike March 6, 2012

        Donova, amdacoba – there seems to be a bug in the wordpress automatic upgrade. It doesn’t seem to actually deactivate and reactivate. Please try that, and if you are getting an error, please tell me exactly what the error message is.

      • Mike March 6, 2012

        If you are doing a new installation, there may be a bug with creating the tables. I will check this tomorrow.

        • amdacoba March 7, 2012

          The mistake is to do a new installation. You can not do tables.
          I have another installation to upgrade, but I’m waiting for you to fix this problem.
          ¿I update or wait?

  7. Ernst Nieuwoudt March 7, 2012

    Hi, first of all thanks for the plugin. However, I am battling because the hover over a photo now gives a whole div showing the href address as well as the caption and it looks pretty horrible.

    Can I do something about it so that the hover just shows the caption as in the old days?

    If I use highside as the viewer it shows the title correctly but then just push the enlarged image onto a blank canvas with no controls.

  8. Tom March 7, 2012

    Hi Mike,

    I was about to post the exact same remark as Ernst above, the title tag contains disgraceful HTML code. You could store the HTML in another tag and then use the titleFormat callback from the plugin’s API to fill out the image caption.

    Also, my French translation was deleted by the upgrade 🙁
    If you lost it of for the French speaking readers here, you can grab it there http://www.t0m.fr/shashin.zip

    Cheers
    Tom

    • Mike March 9, 2012

      Hi Tom – I improved the handling of the captions in the version I released today. That was a result of my having to do this very quickly, to get Shashin re-instated in the wordpress.org repository.

      Thanks for the translation. I’ll add it!

  9. Donovan March 7, 2012

    I just grabbed the latest plugin update from wordpress (looks like Mike just released it today for fixes to stuff).

    And now everthing working 100% perfect !. Installed and activated with no errors.

    I am running MAC with Safari 5.1 PHP 5.3.6 MySql 5.5.9

    Thanks Mike !! Great support. And very much appreciate your time and effort to bring such a quality plugin to the wordpress community !

    donovan

  10. Ernst Nieuwoudt March 7, 2012

    Hi, I have just updated but my thumbnails still have the whole div as the title. Please help! At the moment I am using Fancybox as a other pluhin to show proper titles on mouseover. Thank you very much for your quick response

    • Mike March 8, 2012

      Hi Ernst – I am working on this today. I should have revised code on wordpress.org tonight or tomorrow.

      I wasn’t originally planning to use Fancybox at all. I switched in order to get Shashin reinstated in the wordpress.org plugin repository, and I had to do it quickly.

      • Ernst Nieuwoudt March 8, 2012

        Mike you are my hero. Tx very much. BTW I am not that familiar with PHP yet, can only do basic things. Could you perhaps steer me in the right direction with what I can use in the rel thingies to continue using highslide?

        • Mike March 8, 2012

          I’m also working for a plugin for Shashin (a plugin for a plugin) so you can continue using Highslide with it. I will need to make it available outside of wordpress.org however. I hope to have it ready within a week. Highslide doesn’t use the “rel” attributes and is fairly complicated to set up, so I can’t provide a quick how-to

          • Ernst Nieuwoudt March 8, 2012

            Tx. Glad that it looks like I was not that stupid. Anyways thank you very much for everything

      • Ernst Nieuwoudt March 9, 2012

        Hi Mike, the latest uopgrade fixed the problem with the title, but now my caption is totally wrong. Please help. You can look here http://www.springriverbits.com. Thanks a stack

        • Mike March 9, 2012

          Hi Ernst – from looking at the html code, it looks like you may have entered settings in the “other viewer settings” section of the Shashin settings page (the “rel” attribute looks like its being overridden). If you select “Use Fancybox” with the drop down menu near the top of the settings page, you can leave the “other viewer settings” fields blank. Let me know if that’s the problem or not.

          • Ernst Nieuwoudt March 10, 2012

            Sorry Mike, my bad. Out of desperation I went back to the other viewer settings which work fine other than for the bigger images. At least the site looks good this way. I will change the site back to fancybox if you want so that you can see the problem. I live in South Africa so I will st6ill be awake for another two hours, so just pop me an email when you want me to do the change over so that you can see what the problem is. Much appreciated.

          • Ernst Nieuwoudt March 10, 2012

            Mike I have changed the site to use Fancybox now, so that you can see what it looks like.

        • Mike March 10, 2012

          Hi Ernst,

          You have an old copy of the shashin stylesheet that you copied to here:

          http://springriverbits.com/Site/wp-content/themes/weaver-ii-ecommerce/shashin.css?ver=3.1

          You need to either delete that or replace it with the shashin.css stylesheet included in shashin 3.1.2. What’s appearing on your page is supposed to be in a hidden div.

          • Ernst Nieuwoudt March 10, 2012

            Mike, thank you very much. I should have known that. I am really sorry for wasting your time and will make a note to check my customisations first before calling for help.

  11. amdacoba March 7, 2012

    All new installation perfect.
    thank you very much

  12. Eddy March 8, 2012

    Upgraded from V2 to the current version and lost several hundred pictures. Only about 30 left in the table. Thank you for a nice plugin.
    When I click the couple of pics that I do have, they no longer pop up the page on a dark background like they used to. They no just open in a new window.
    I feel the plugin has no use for me any longer. I’m using nextgen from now on.

    • Mike March 8, 2012

      I try to help everyone who comes here looking for assistance with my plugins, and have spent hundreds of hours doing so over the years, with no compensation. If you are interested in fixing this, and not just complaining, give me a link to your site and I will take a look.

  13. lelmarir March 10, 2012

    Hi,
    i have some trouble with Shashin (v 3.1.2):
    using [shashin type="album" size="medium" order="date" columns="2"] tag, after entering in an album clicking on th “Return” link it just give a blank page:
    it seem that ” $(parentTableId).fadeIn(‘slow’); ” (shashin/Public/Display/shashin.js:148) does not work properly and the “#shashinGroup_[id]” stay with “display:none”
    I really don’t know jquery, and i can’t tell what is the problem, for now i fixed it replacing with $(parentTableId).show();
    Hope this can help.

    • Mike March 10, 2012

      Thank you for reporting this. I am seeing the problem now on my site too. It used to work so I must have affected it in some way with my fancybox work. I will work on correcting it.

  14. NintendoGal March 10, 2012

    Hiya Mike,

    Thanks for working so hard on keeping the plugin going, really appreciate it!

    Unfortunately this update kinda broke my slider on the top of my page so I had to disable it for the time being. What it does is remove the text to the right of the large images slideshow up top, therefore no one has any context as to what they represent and the right is completely empty. I’m not certain, but I think it uses FancyBox. Perhaps a conflict?

    Thanks for reading. 🙂

    • Mike March 10, 2012

      Hi – could you temporarily re-enable Shashin tomorrow morning? I would need to see what you are describing and look at the html and css to diagnose it.

  15. Niek March 10, 2012

    Hi Mike,

    Just updated to your latest version. Now it shows “view at picasa” and “close x” under each picture, as already stated in another comment here.
    How can I fix it?

    • Ernst Nieuwoudt March 10, 2012

      Hi Niek, Mike has correctly pointed out that I had an old version of the stylesheet shashin.css being used. When I deleted the old version, the problem was solved. I am sure that just like me you copied the stylesheet into your themes directory to customize it. So rather just rename it so that if necessary you can check what customizations you did.

      • Niek March 10, 2012

        You were right, apparently I had another shashin.css in the themes folder…
        Thanks for the help.
        I’ll have to change the one in the shashin plugin folder though, as all my captions show up white on a white background.

  16. Jeff March 10, 2012

    Hi Mike,

    Thanks for the awesome plugin. I just updated to 3.1.2 and noticed a few things. One was already mentioned above (the Return link going to a blank page). The other is, all my photo thumbnails from an album have a “CLOSE X” underneath them. Is there a way to remove that through settings? The problem can be seen at:

    http://teamupnext.com/?page_id=86

    The tag I’m using is:

    [shashin type="album" id="8,5,9" size="medium" order="date" columns="2" caption="y"]

    Also, is there a way to revert to the previous version for the time being?

    Thanks,
    -jeff

  17. Jeff March 10, 2012

    The suggestion above my original post worked. I had a custom shashin.css file. Thanks, Ernst. And thanks, Mike for all your work and this wonderful plugin.

    -jeff

    • Kim March 11, 2012

      Hey guys,

      About the “view at picasa” and “close x” under the thumbnail :
      It’s gone now, I just copied the shashin.css file to my desktop through ftp, opened it and copied it back again and it worked.

      I never uploaded shashin myself through ftp, always did it via the wordpress plugin on the dashboard.
      Strange but if it works, I’m happy.

      Thanks Mike

Comments are Disabled