WordPress SmoothGallery plugin


This page is about a plugin for WordPress that helps you to embed JonDesign’s SmoothGallery in your blog.

It’s this simple:

  • insert some standards compliant markup into your post or page
  • annotate that post or page with smoothgallery and some options
  • watch your smooth gallery

You can download the plugin here.

Check out the extra features.

Example

Have a look at this cool example. Kudos to my brother and his friends for taking these awesome pictures; thanks that I may show them here.

Bergpark - Aqueduct

You can display a sensible description for this picture here.


Bergpark - Aqueduct

Bergpark - Bridge

Another stunning picture.


Bergpark - Bridge

How to

Tired of writing markup? Use this tool to generate it.

You can display a SmoothGallery inside a post/page or integrate it into your theme. If you’d like to integrate it into your theme, read about this here.

If you’re using WordPress to upload the images, attach the images you’d like to show in a SmoothGallery to your post or page and the markup will be generated for you. All you have to do is to copy and paste the HTML from the box saying SmoothGallery located at the bottom of the Advanced Options on the edit screen. Check out this video.

If you want to write the markup yourself I recommend using this tool and adapt the HTML to your needs. If you want to start from scratch, you simply start with a div (id set to myGallery) and wrap your pictures inside with more div’s (class set to imageElement). Have a look at this example:

<div id="myGallery">
  <div class="imageElement">
    <h3>Bergpark - Aqueduct</h3>
    <p>You can display a sensible description for this picture here.</p>
    <a href="http://[...]/park1.jpg" title="open image" class="open"></a>
    <img src="http://[...]/park1_thumb.jpg" class="full"
         alt="Bergpark - Aqueduct" />
  </div>
  <div class="imageElement">
    <h3>Bergpark - Bridge</h3>
    <p>Another stunning picture.</p>
    <a href="http://[...]/park2.jpg" title="open image" class="open"></a>
    <img src="http://[...]/park2_thumb.jpg" class="full"
         alt="Bergpark - Bridge" />
  </div>
</div>

That’s the markup I used for the gallery you can see on this page. Although the markup is indented for this example, don’t do this in WordPress because this might render your page invalid, i.e. W3C’s validator will report open tags and the like.

Options

If you don’t annotate your post or page with smoothgallery the CSS and JavaScript will not be loaded and the gallery won’t work. So, add a custom field with the key set to smoothgallery if you’d like to enable the SmoothGallery. If the value is set to 1 or On the default values for the gallery will be used.

If you want to change the defaults you can use the following options:

Height
Use h:250 to set the height of the gallery to 250 pixels
Width
Use w:500 to set the width of the gallery to 500 pixels
Timed
Use t:true for a timed gallery
Delay
If you’re using a timed gallery you can use d:4000 to set the delay between transitions to 4 seconds
Arrows
Use a:false to disable the arrows
Carousel
Use c:true to enable the carousel
Links
Use l:false to disable the links
Border color
Use b: followed by an RGB color to set the border color, e.g. b:FFF for white

Default values

If you don’t specify any options you’ll get a gallery with the options set to:

Option Value
height 345
width 460
timed false
delay 9000
showArrows true
showCarousel false
embedLinks true
bordercolor 000, i.e. black

Example

With the following code you would end up with a timed gallery that is set to 350×400 pixels:

h=350
w=400
t=true

As you can see, you can use = instead of :, too.

Extra features

  • Integrate a gallery into your theme? Read this page.
  • Do you want to have the images of the most recent posts inside one gallery? Read about this here.

Troubleshooting

You can’t see the gallery and you’re using Prototype or jQuery on your site? Then you’ll have to change the value SMOOTHGALLERY_USE_NAMESPACED to true. You can find it in the file config.php on line 29. If you don’t use one of these frameworks set it to false; that’s the default.

You’re using Internet Explorer and can’t see the gallery? Read about a solution here.

Future work

If you’re missing a feature write me an e-mail or a comment and I’ll try to implement it any time soon.

135 Responses to “WordPress SmoothGallery plugin”

  1. David Stembridge says:
    January 29th, 2008 at 1:38 am

    Great finding this plugin! Any chance of expanding your instructions a little more…?

    How exactly do you go about annotating your post or page with smoothgallery? Aside from the plug in being activated, are there other places code need to be inserted?

  2. Christian Schenk says:
    January 29th, 2008 at 12:55 pm

    Hi David,
    I’ll expand the instructions soon…

  3. Andy says:
    February 1st, 2008 at 4:56 pm

    I’ve tried to put this into a sidebar, but it just puts the pics there. Without even the possibilty to click them.

  4. Christian Schenk says:
    February 1st, 2008 at 5:21 pm

    Hi Andy,
    It’s not possible to integrate a SmoothGallery somewhere outside a post or page, i.e. in your theme’s sidebar, header or footer.
    I’ll implement this any time soon.

  5. GD says:
    February 1st, 2008 at 8:19 pm

    Promising, but doesn’t work at all in IE6.

  6. Christian Schenk says:
    February 2nd, 2008 at 10:47 am

    Hi GD,
    I’m looking forward to fix this in the next version…

    Update: read about it here.

  7. Ninaccio says:
    February 2nd, 2008 at 1:06 pm

    Hi! I’ve been searching for a thickbox wordpress plugin..But sincerely I can’t understand how to use it on wordpress…Could you make an example for a post?

  8. Christian Schenk says:
    February 3rd, 2008 at 11:14 am

    Hi Ninaccio,
    sure, I’ll write something about ThickBox any time soon.

    In the meantime you can have a look at Andrew’s Shutter Reloaded plugin for WordPress: it is an image viewer that works similarly to Lightbox or ThickBox.

    Update: Have a look at another ThickBox plugin here.

  9. Boudia says:
    February 4th, 2008 at 7:48 pm

    Great job, Christian. The markup generator is a real time saver. Is the IE6 problem fixed?

  10. Christian Schenk says:
    February 5th, 2008 at 11:46 pm

    Hi Boudia,
    I found a solution to the IE6 problem: read about it here.

  11. Raul says:
    February 6th, 2008 at 1:23 am

    i make everithing you say i need to do to make this plugin works, but i can`t make this work

    HELPME PLEASE

  12. David Stembridge says:
    February 9th, 2008 at 3:27 am

    Hey, you are keeping busy Christian, I will give some of the new features a try! Thanks, David

  13. boudia says:
    February 9th, 2008 at 5:59 pm

    Running wp-2.3.1, and could not even activate the plugin.

    Anyone encountered this problem before?

    TIA

  14. ipeppas says:
    February 11th, 2008 at 2:42 pm

    WordPress 2.3.3 could not even activate the plugin.
    Error = Plugin could not be activated because it triggered a fatal error.

  15. Christian Schenk says:
    February 11th, 2008 at 5:40 pm

    Hi Boudia and ipeppas,
    I’m running WordPress 2.3.3. and the plugin works just fine.
    If anybody could mail me more details about this I might be able to fix it. Maybe it’s a PHP4 related error - I’ve tested the plugin with PHP 5.2.x.

  16. Danny says:
    February 11th, 2008 at 7:29 pm

    Hi Christian, could well be a php4 error, I’ll try it with php5, however I don’t really want to change my hosting right now, so is there any chance of a fix in an update?

  17. Christian Schenk says:
    February 12th, 2008 at 8:39 am

    Hi Danny, Boudia and ipeppas,
    I tried the plugin with PHP4 and fixed some errors. It would be nice if you could download version 1.5, try it again and write a short comment here whether it worked for you.

  18. Danny says:
    February 12th, 2008 at 2:00 pm

    Hi Christian, 1.5 seems to activate fine, although nothing shows up in either posts or pages, It could be an issue with the theme I’m using, which is a mod of the upstartblogger minim theme.

  19. Danny says:
    February 12th, 2008 at 2:07 pm

    Okay, I just tried it with a blank theme, and it works great, Any idea why it won’t work with the theme i’m using?
    Thanks for all the replies and work on this plugin.
    Danny

  20. efrain says:
    February 12th, 2008 at 5:52 pm

    yeah i’ve been trying to get this working, i even upgraded to PHP5 with the 1.5 version. It’s now activated but I can’t get it to show up. I’m gonna try a different theme to see if that’s the problem.

    :: efrain

  21. Danny says:
    February 12th, 2008 at 5:57 pm

    Hi, Christian and efrain, I just set the the values for the “insertSmoothGallery” function to the same as the defaults in the “get_smoothgallery_parameters” function. Being a total code butcher I have know Idea why, but that seemed to work.

  22. efrain says:
    February 12th, 2008 at 6:01 pm

    aha! that’s strange. i think i finally got it to work sorta.! Danny you are a butchering genius!
    :: efrain

  23. efrain says:
    February 12th, 2008 at 6:06 pm

    http://evalverde.org/
    that’s the site I’m trying to get it to work on. In Mozilla it’s sorta working. but in IE it’s weirdy lookin’.

    :: efrain

  24. Christian Schenk says:
    February 13th, 2008 at 8:44 am

    Hi Danny and efrain,
    if the function insertSmoothGallery doesn’t return false but an array the CSS and JavaScript will be inserted on every page - normally, you don’t want this.
    First, make sure that your theme has got wp_head() somewhere in the header and wp_footer() in the footer.
    If that’s the case add a custom field named smoothgallery to the post or page with your gallery. Of course, this isn’t necessary if you want to integrate a SmoothGallery into your theme: you may want to follow the instructions here.
    If the gallery is “weirdy lookin” in IE I think that you shouldn’t blame me ;-)

  25. jez says:
    February 13th, 2008 at 1:23 pm

    is there a way to permanently set the custom key of smoothgallery so that it is “activated” on the home/index page (not a post/page) without manually hacking the files (javascript and css calls) into the header?

    cheers,
    jez

  26. Christian Schenk says:
    February 13th, 2008 at 2:54 pm

    Hi jez,
    all you have to do is to implement the insertSmoothGallery function; you can find it in the smoothgallery.php file. If you want to stick with the defaults you would just replace the line saying return false; (line 49) with return array(); and the JavaScript and CSS will be included on every page. If you only want this on your home/index page you can use a conditional tag like is_home() or is_page():

    if (/* some condition */) return array();
    return false;

    Where some condition may be is_home or is_page('My frontpage').
    If you want to change the defaults, put some values inside the array like so

    array('width' => 45,
          'height' => 35,
          'timed' => 'false',
          'showInfopane' => 'false')

    This would result in a timed gallery without an info pane that’s 45×35 pixels.
    Note that it’s currently not possible to have more than one gallery on a page, e.g. say one in your header and another in your post. If somebody wants to do this I may implement it any time soon.

  27. jez says:
    February 13th, 2008 at 4:10 pm

    hello christian,
    thanks for your detailed reply, as always I have used the time in between to berserk my way through, which resulted in the following:
    - moving the scripts & css folder to the root of the site
    - adding this to the header (.php)
    - using your cool markup generator to create the code and put it into place
    - then add the following directly below the code:

    function startGallery() {
      var myGallery = new gallery($('myGallery'), {
        timed: true,
        showArrows: true,
        showCarousel: false,
        delay: 6000
      });
    }
    window.onDomReady(startGallery);
  28. Mike says:
    February 13th, 2008 at 8:44 pm

    I’m trying to get the image to be at the top center of the box, not center center. I tried in jd.galler.css:

    .jdGallery .slideInfoZone
    {
    	background-position: top center;
    }

    I’ve tried everything else I can think of, and I can’t get that image to move at all. Can you help?

  29. Christian Schenk says:
    February 13th, 2008 at 11:15 pm

    Hi Mike,
    I’m sorry but I don’t know how to do this either.
    Please ask this in Jon’s forum.

  30. Abel says:
    February 14th, 2008 at 7:32 pm

    Hi Christian. Thanks indeed for making it easy to integrate smoothgallery into wordpress. As you can see here in http://www.rawvolution.net , it’s working great! I customized the values. No links, carousel, arrows, infopane but just the images.

    Javascript is way above my head and it’s the first time I implemented one like this. Your instructions, if followed properly, are very useful and works the way it says it would. :D

    My only question is it does not validate on 1 particular line.

    Warning: Line 21: escaping malformed URI reference :

    I have no idea how to fix this line. It is dynamically generated in the

  31. Christian Schenk says:
    February 16th, 2008 at 11:13 am

    Hi Abel,
    this bug should be fixed in version 1.6.

  32. David Stembridge says:
    February 18th, 2008 at 5:21 am

    Hi Christian, I have noticed that I still have to turn off visual editor when editing the page with the markup. I haven’t seen any other feedback regarding this issue, do most people edit without visual? Not that big of a deal; except that I do use visual editing for most of pages.
    Thanks!

  33. Christian Schenk says:
    February 18th, 2008 at 9:42 am

    Hi David,
    I think that most people use the visual editor, but that’s just a guess.

    You might want to try the TinyMCE Advanced plugin: I haven’t tried it myself but maybe it will give you more control over the HTML - check out the HTML/XHTML button in the menu bar.

  34. Chrob says:
    February 18th, 2008 at 2:05 pm

    Hi,

    really nice plugin! Unfortunately i am getting an “empty” smoothgallery on my page :-(

    Smoothgallery seems to work, but there is no image displayed… Here’s my testsite http://www.robeller.net

  35. Abel says:
    February 20th, 2008 at 11:48 pm

    Hi Chris,

    Thanks for your email response on the validation issue I mentioned the last time. Removing the spaces in the custom field values worked and the site validates already.

    Just to share with everyone…

    Key
    smoothgallery

    Value (no spaces)
    w:495
    h:298
    t:true
    d:4000
    a:false
    c:false
    l:false
    i:false
    showInfopane=false

    Thank you so much!

  36. Christian Schenk says:
    February 21st, 2008 at 8:52 am

    Hi Abel,
    I fixed this bug in version 1.6 - so you’re allowed to insert spaces again ;-)
    This will work:

    w : 250
    h = 320

    Mixing : and = is possible too.

  37. scott says:
    February 26th, 2008 at 12:14 am

    Hi Christian, lovely work on this plugin, would just like to clarify one thing, that I was unable to gather from your posts.

    Am I able to have a slideshow in seperate posts?

    eg. Monday post about a concert, slideshow of concert photos at bottom.

    Tuesday post of random thoughts.

    Wednesday post about my fishing trip with slideshow of the days catch at the bottom.

    Thanks

  38. Christian Schenk says:
    February 26th, 2008 at 8:29 am

    Hi Scott,

    Am I able to have a slideshow in seperate posts?

    Definitely. Just insert the markup in the post about the concert, the fishing trip or your last holidays, add a custom field named smoothgallery to these posts, modify the options if you’d like to and you’re all set. The gallery will work in every post.
    Just to make this clear: it’s not possible to have more than one gallery in one post - but it’s no problem to have a lot of different galleries in different posts.
    If enough people want more than one gallery per post I may implement it - but this might be complicated.

  39. Scott says:
    February 26th, 2008 at 8:59 pm

    Thanks for the response Christian, my only other problem is that I cannot get the slideshow to load in the theme that i have created. It works in the Wordpress Default and Classic themes, but when switched to my personal theme, it does not load.

    The theme I have created is based on the Default theme (copied some code) and has got wp_head() in the header and wp_footer() in the footer.

    have used the custom field as advised.

    Is there anything that you can think of as to why it will display in the default theme, but not my theme?

  40. totokah says:
    February 26th, 2008 at 10:18 pm

    Hi Christian,

    nice plugin, its allready work in my blog. I’m newbiz for webblog, so I need ur help. can I load a different size photo to upload in my gallery with automaticly resize? for example: I have 2 landscape photo and 3 potrait photo, how can I do it? and how I can do create the link in another page like as Gallery?

    regards, totokah

  41. Christian Schenk says:
    February 27th, 2008 at 9:29 am

    Hi Scott,

    If you want to integrate the gallery into your theme you don’t have to add a custom field to a post/page - you’ll have to implement the insertSmoothGallery function in the PHP script (named smoothgallery.php). There’s a short video that shows you how to do that.

    Basically, you’ll insert some if statements to check whether certain conditions are met, i.e. if you want to display a gallery on a page with the id 42 you’d write if (is_page('42')). You can add more pages like so if (is_page('42') || is_page('23')).

    If you don’t know how to do this or you’re not that familiar with PHP, tell me what you want to do and I’ll help you hacking it. Although I provide this support for free, I think donating some bucks would be adequate if I helped you solving your problem.

    Another thing that might apply to your situation is the problem with Prototype and Internet Explorer. If you’re using Prototype in your theme the gallery might not work in IE: I wrote something about this here.

  42. Christian Schenk says:
    February 27th, 2008 at 9:41 am

    Hi totokah,

    if you want to show the five photos in one gallery, set the width of it to the width of the photos in landscape format and the height to the height of the photos in portrait format. This way there’ll white space above and below or at the left and the right depending on the photos. But that’s inevitable if your pictures don’t have the same size.
    I recommend that you show only pictures of the same size and format in one gallery; e.g. use the Gimp to edit the photos.

  43. Scott says:
    March 1st, 2008 at 5:17 am

    Thanks for the assistance for your great plugin Christian

  44. David Stembridge says:
    March 1st, 2008 at 9:46 pm

    Hi Christian, well, I finally have taken the time to start moving my current front page over to your plugin!
    http://fbcwaynesboro.org is the main page, (Currently using a simple ajax image fader)
    and http://fbcwaynesboro.org/smooth-test the testing page… The box size seems off. I designated the dimensions in the function field as 600 x 375; yet it seems to crop the borders. Any suggestions?
    Thanks!

  45. xkill says:
    March 6th, 2008 at 9:12 am

    And SmoothGallery 2.0?

  46. Christian Schenk says:
    March 6th, 2008 at 9:39 am

    Hi xkill,
    the default is to use SmoothGallery 2.0. If you want to use version 1.2 you’ll have to change line 32 in the code and replace false with true.

  47. xkill says:
    March 6th, 2008 at 12:09 pm

    I try to install smoothgallery plugin but it doesn’t work well, the Carousel works fine, but the other bigger images doesn’t appear. Can you help me?

    The url: http://mankomanos.ath.cx/fotos

  48. Leonardo Parada says:
    March 8th, 2008 at 3:33 am

    Hello…congratulations.
    I have some questions.
    I have some problems with the wordpress wysiwyg editor . This one clear all tags…and I can’t use your plugin.
    how can i do for solve that?
    I saw on your video that you have not problem with that. And you have an especial editor. Can you talk about that? plis
    Thanks

  49. Shay says:
    March 9th, 2008 at 4:40 am

    Hi, great job with the plugin!
    I’m currently having a problem: I’m running jQuery on my site, so I changed the value to “true” for SMOOTHGALLERY_USE_NAMESPACED. But when I do this, the SmoothGallery won’t show up anymore. Any idea why this happens? Thanks & keep up the good work :)

  50. Christian Schenk says:
    March 9th, 2008 at 11:07 am

    Hi everybody,

    Leonardo: please read the first item in the FAQ.

    Shay: read this post; maybe that helps.

    xkill and others: for problems not related to this plugin but to SmoothGallery please ask your questions in the forums. You’ll find better help there.

  51. Leonardo Parada says:
    March 9th, 2008 at 11:18 pm

    Thanks very much…other question. Your plugin don’t work on WordpressMU. Is it right? I can’t do it work.

  52. Marfeal says:
    March 11th, 2008 at 7:27 am

    Thanks for this plugin! but im having a little problem. I have several posts with smoothgallery, but in my frontpage where all the recent posts are, only the most recent post with the smoothgallery is displayed. Although when I click on another post, it shows the gallery in that single post. My site is sort of a newsletter site, i need to include images in my posts. please lend some help. thank you very much.

  53. Christian Schenk says:
    March 11th, 2008 at 8:55 am

    Hi Leonardo and Marfeal,

    Leonardo: I haven’t tried this plugin on WordpressMU so I just don’t know. I’ll have a look at this any time soon.

    Marfeal: that’s the right ;-) behavior. I’m looking forward to fix this any time soon.

  54. Jayef says:
    March 11th, 2008 at 12:46 pm

    Hey,
    I’m new here. and may I just act stupid by asking how does this whole thing works?
    I still can’t make sense out of it, I mean, I have this theme where smoothgallery is already integrated in it and I have no idea how to change the pictures and customise it.

    Your help is appreciated.

    thanks.

  55. Christian Schenk says:
    March 11th, 2008 at 1:20 pm

    Hi Jayef,

    [...], I have this theme where smoothgallery is already integrated in it and I have no idea how to change the pictures and customise it.

    I don’t know either: please ask the theme author.

    If you want to use this plugin read this or watch that. Still not working? Leave another comment.

  56. Marfeal says:
    March 11th, 2008 at 2:39 pm

    thank you very much. i’ll be looking forward to that “fix”.

  57. Matt says:
    March 13th, 2008 at 2:15 am

    Hey,

    First off, great plugin. But im having some trouble. I have everything working fine (here) but when i try turn the carousel on it makes it so that the slideshow is no longer displayed. Im turning on by setting it to true in smoothgallery.php and when set to false its perfect. Any idea’s?

  58. Christian Schenk says:
    March 13th, 2008 at 10:26 am

    Hi Matt,
    have a look at this video.

  59. Matt says:
    March 14th, 2008 at 1:13 am

    Thanks heaps Christian. Wasn’t expecting a reply within 24hrs let alone a reply with a video tutorial haha, great job :)

  60. Christian Schenk says:
    March 16th, 2008 at 6:32 pm

    Hi Marfeal,

    thank you very much. i’ll be looking forward to that “fix”.

    I’m sorry to tell you that I haven’t got the time to implement this feature. Having more than one SmoothGallery on a single page would add a lot of overhead and would be hard to implement.

    If you find somebody who implements this feature or you implement it yourself, send me a patch and I’ll add this to the plugin. Until then you’ll have to manually add the CSS and JavaScript for the various galleries if you’d like to have more than one gallery on a page.

  61. art says:
    March 19th, 2008 at 11:53 pm

    hello,
    does anyone know why the gallery is working only when implemented in the newest post on the page?
    if it is in the second or next it will not work unless you insert the custom field in the first post /not containing any galleries/.
    is integrating the gallery into the theme the only solution?
    thanks in advance for any comments.

  62. Jacob Stoops says:
    March 20th, 2008 at 7:18 pm

    I’ve implemented the custom field ’smoothgallery’ in the code and nothing seemed to happen, the gallery would not show…when i changed the custom field key to ‘SmoothGallery’ it did this http://www.ticketsgaloreinc.com/2008/03/19/hello-world/ …how can i fix and get the slideshow to display like it should?

  63. Garfield says:
    March 23rd, 2008 at 4:57 am

    If you are using WP NextGen-Gallery, there is a wordpress plugin that automatically generates and shows your images in Smooth Gallery.

    Chek it out:
    http://uninuni.com/wordpress-plugin-nextgen-smooth-gallery/

  64. Christian Schenk says:
    March 25th, 2008 at 9:19 am

    Hi art, Jacob and Garfield,
    art: it’s possible to have more than gallery on a page but I’m tempted to say that the implementation in WordPress is time-consuming. Currently, I’ve stopped working on that.
    Jacob: the JavaScript is missing on your page. Make sure that there’s a call to wpfooter() in your theme.
    Garfield: that’s looking great.

  65. Martin says:
    March 28th, 2008 at 6:51 am

    Hi!

    Ich sehe in deinen Videos, dass du einen Mac benutzt. Ich selbst benutze seit jeher den Mac. Darum bin ich etwas verwöhnt was die Einfachheit anbelangt. Mein Verbesserungsvorschlag für dein Plugin wäre: Bilder vom Desktop auswählen. Die Bilder werden hochgeladen und automatisch eine Gallery erstellt. Man muss die Bilder lediglich in der richtigen Größe auf dem Desktop haben. Das wäre Top!

    Aber ist ja nur eine Idee. Ich finde dein Plugin auch so schon toll! Vielen Dank dafür und mach weiter so …

    Gruß Martin

  66. Kimberly says:
    March 31st, 2008 at 6:49 pm

    I’ve just selected your great theme LivingOS UPSILON 1 for my website but I can’t figure out where or how to change the photo gallery images and photo titles.

    I uploaded the folder smoothgallery into the plugin folder at the /wp-admin/plugins.php location but smoothgallery isn’t showing up to be activated. Did I even need to do that since the default photos are already showing quite well?

    Thanks for your help.

  67. Christian Schenk says:
    April 1st, 2008 at 6:18 am

    Hi Kimberly,
    I’m not the author of this theme, it’s Tim Hyde. The theme and this plugin aren’t related to each other, so you don’t have to upload my plugin.
    Instead have a look at the theme’s folder. There’s a file extra.php and you can configure the gallery there. If you need help with that write me an e-mail or contact the author of this beautiful theme here.

  68. Manny says:
    April 6th, 2008 at 6:09 am

    Hi Christian, thanks for the plugin.
    Is it possible to go into more detail on how to use the plugin on the home page or a page that is static? I read your reply to one of the comments regarding this issue, but I’m a novice when it comes to CSS so any additional information would be appreciated.

    Thanks.

  69. Jeff Payne says:
    April 6th, 2008 at 6:25 am

    Hello Christian,

    Thanks for taking my question. I have been using the Revolution theme for a website at http://www.trustpointlending.com. I have a SmoothGallery installed and works great as a plugin. You can see it perfectly in Firefox the far right column at top before the header. However in IE it makes that one column go wacko. Any advice. I am not an expert at this stuff so please if possible give me step by step. Thank you for your site and your advice.

    Most grateful,
    Jeff

    Jeff Payne

  70. ceti says:
    April 7th, 2008 at 3:26 pm

    Hi Christian,

    This is a great little plugin. Thanks so much for your efforts!

    However, I think Wordpress 2.5 broke it somehow as the exact same code installed on a page does not work anymore. Sorry I can’t provide more details but maybe others have had the same problem.

  71. ceti says:
    April 7th, 2008 at 3:36 pm

    Never mind about that last post, my reinstallation was just incorrect. My university server just has complex settings, and changing those helped.

    Works perfectly!

  72. Abel says:
    April 9th, 2008 at 9:23 am

    Hi Christian,

    Are there known issues in running smooth gallery plugin in Wordpress 2.5 ? My gallery seems not to work anymore after upgrading. I see you also upgraded this blog to 2.5 and your example above won’t display as well…

    Thanks!

  73. Abel says:
    April 9th, 2008 at 9:58 am

    @Manny

    Is it possible to go into more detail on how to use the plugin on the home page or a page that is static? I read your reply to one of the comments regarding this issue, but I’m a novice when it comes to CSS so any additional information would be appreciated.

    You may watch the how to videos here.

  74. Christian Schenk says:
    April 16th, 2008 at 9:23 am

    Hi Abel,
    this plugin should work just fine with WordPress 2.5. My example wasn’t working because I forgot to remove Prototype after upgrading.

    Maybe you’re interested in this post.

  75. Abel says:
    April 16th, 2008 at 12:17 pm

    Hi Christian,

    Thanks for that info :) Great support as usual!

  76. ceti says:
    April 18th, 2008 at 3:25 am

    Just a quick note: is absolutely necessary to include in your theme, preferably in your universal footer before and maybe even within the last .

    Some themes are poorly designed and don’t include this call, which is absolutely necessary for embedded PHP to function.

    Try this before going through your wordpress install and disabling a bunch of things.

  77. David Stembridge says:
    April 21st, 2008 at 1:19 am

    Hi Christian,
    have you tried using the plugin on Safari on a Mac?
    http://www.fbcwaynesboro.org/smooth-test
    is working great on firefox; but the’s a javascript error when it is loaded on safari.(javascript:void(0)
    Any ideas?
    Thanks! David

  78. David Stembridge says:
    April 21st, 2008 at 1:21 am

    Oh… one more thing, how do you get rid of the box that fades in at the bottom, when there is no title s description referenced? I’d actually like to have no arrows, or even the little light thing in the center showing, just the image fading. Is this possible?
    Thanks again!

  79. David Stembridge says:
    April 21st, 2008 at 2:50 am

    Ok, I figured it out, I added the following under custom field:
    it all works like a charm now!
    h:375
    w:600
    t:true
    d:4000
    showInfopane: false
    a:false

    I can now move to my home page!
    Thanks Christian!!!

  80. Christian Schenk says:
    April 21st, 2008 at 6:05 am

    Hi David,
    great that you figured it out yourself, I wasn’t fast enough to respond to that ;)
    @Safari: no problems so far, at least not on my page. So I guess some other script causes this error.

  81. dinakar says:
    April 25th, 2008 at 5:50 pm

    Hi christian,

    I have added the plugin NexGen gallery and then added the add on Smooth Gallery for it. I have created the gallery by specying [smooth=7, 400, 400, false, true, false, true]in my post. Am able to get the pictures on my post. But there is one problem. Instead of getting the full image in that 400×400 frame, am getting only some part of the entire image.(as my images are 1600*1200). But i want the entire image to be shown in that 400*400 frame(as shown in the example provided in this page). How can i get this done

    Regards
    Dinakar

  82. Christian Schenk says:
    April 27th, 2008 at 8:32 am

    Hi dinakar,

    But i want the entire image to be shown in that 400*400 frame(as shown in the example provided in this page). How can i get this done

    Resize the large pictures to 400×400 pixels with some image manipulation program; I’m using the GIMP for this.
    For issues with the SmoothGallery plugin for NextGen you may want to ask your question here.

  83. skyle says:
    April 27th, 2008 at 8:14 pm

    I searched for a question or explanation on the image source location for the plugin but could not find. Is it possible to designated a folder for images to be drawn from for the slideshow or does the name of each image need to be manually typed in every time you add an image? I suppose the text has to be linked to the image in some way if you’re using that feature. So then how about MYSQL where images and text can be linked and stored, and then pulled into the carousel? Maybe this is the wrong plugin but I’d love to make it work this way, even if the text for the images are derived from each sub-folder that they could be placed in. I would much appreciate your ideas.

  84. Christian Schenk says:
    May 3rd, 2008 at 7:13 pm

    Hi everybody,
    I added a new feature: If you’re using WordPress to upload images, attach the images you’d like to show in a SmoothGallery to your post or page and the markup will be generated for you. All you have to do is to copy and paste the HTML from the box saying SmoothGallery located at the bottom of the Advanced Options on the edit screen. Check out this video.

    Furthermore I setup a changelog here that should help you to track the changes better.

  85. Elle says:
    May 6th, 2008 at 7:53 am

    At the risk of sounding like a broken record, I would like to say: great plugin and great videos, but… I’m having some trouble. I also am using eshop plugin but no js libraries. The error I get is:
    el.getElement(options.linkSelector) has no properties
    [Break on this error] link: el.getElement(options.linkSelector).href||false,
    jd.gallery.js (line 161)

    When I set SMOOTHGALLERY_USE_NAMESPACED to true in config.php line 29, my error changes to:
    $ is not a function
    [Break on this error] var myGallery = new gallery($(’myGallery’), {…

    Any idea what is the problem?
    Thanks in advance.

  86. Christian Schenk says:
    May 6th, 2008 at 11:32 am

    Hi Elle,

    The error I get is:
    el.getElement(options.linkSelector) has no properties

    This happens when the HTML markup for the gallery is missing a link to the large images. There’re two ways to fix this:

    1. don’t advice SmoothGallery to use the link to the large images by adding l:false as an option to the custom field of your post/page
    2. add an anchor tag to each imageElement in the gallery

    The code for solution two looks like this:

    <div id="myGallery">
     <div class="imageElement">
      <!-- ... other elements ... -->
      <!-- make sure that you've got the following line ... -->
      <a href="http://[...]/image.jpg" title="open image" class="open"></a>
      <img src="http://[...]/image_thumb.jpg" class="full" alt="Image" />
     </div>
    <!-- ... -->

    The second error might be a problem with this plugin. I’ll have a closer look at this soon.

  87. Elle says:
    May 6th, 2008 at 9:19 pm

    1st solution worked. Thanks :)

  88. ceti says:
    May 7th, 2008 at 5:05 pm

    Just a quick note, in the new 1.8 version, styling to align:right no longer seems to work for some reason. However, substituting float: right worked.

  89. matt mcclard says:
    May 7th, 2008 at 11:16 pm

    Hi, I really want to use this plugin it looks great, but I am seeming to have some problems with it. If I just plug in the markup, I can see the images fine. However if I add the Custom Field everything disappears. I read up the page that I need to make sure that I have wpfooter() in my footer, but when I put this in I get an error that the function doesn’t exist. Is it supposed to be . I am using WordPress 2.5.1. And at present I am not using any other plugins. Any help would be much appreciated.

    thanks

  90. matt mcclard says:
    May 7th, 2008 at 11:17 pm

    uh oh it took out my code. is it supposed to be wp_footer() instead? sorry :(

  91. Giovanni says:
    May 8th, 2008 at 2:14 pm

    hello
    when I upload plugin smoothgallery 2.0 in my “plugin folder” of wordpress I don’t show it in plugin page.

    If I upload 1.8 versione and paste code into the post I see image in normal mode and not with smoothgallery effect.

    why?

  92. Christian Schenk says:
    May 8th, 2008 at 2:28 pm

    Hi Matt, Giovanni,

    @Matt: yes, it’s wp_footer() like so:

    <?php wp_footer(); ?>

    @Giovanni: SmoothGallery and this plugin haven’t got anything in common per se - this plugin just bundles SmoothGallery and makes it available to WordPress; just uploading SmoothGallery won’t cut.

    [...] and paste code into the post I see image in normal mode and not with smoothgallery effect.
    why?

    Make sure the following is true:

    • plugin is activated
    • markup for the gallery is in the post
    • post has a custom field smoothgallery
    • there’re no JavaScript errors (e.g. test with Firebug)
  93. Emilie says:
    May 12th, 2008 at 8:35 pm

    for the life of me I cannot get this work. I don’t have much html experience but I’ve followed the instructions word for word and nothing. Also, your introduction video is “no longer available” so I don’t know if I’m missing something but I can’t get this to work at all. I am so frustrated right now -please help

  94. Christian Schenk says:
    May 13th, 2008 at 7:03 am

    Hi Emilie,
    Since the videos are hosted on YouTube I can’t guarantee that they’re available 24/7, but the Introduction is still here.
    I’m sorry to hear that you’re experiencing frustration with this plugin. I’ll write you an email, so we can figure this out…

  95. Can you spell cacophony? » links for 2008-05-19 says:
    May 19th, 2008 at 5:38 pm

    [...] WordPress SmoothGallery plugin (tags: @inbox) [...]

  96. twincascos says:
    May 27th, 2008 at 11:39 am

    Hello Christian, Thanx alot for the plugin, looks great. Although it fails to work for me so far…
    I have two questions: do you plan to upgrade the mootools to 1.2? would you consider switching the slideshow script to Slideshow2? It’s a much more robust slideshow , I believe.

    As for my errors, firebug says:

    el.getElement(options.imageSelector) has no properties. 
    image: el.getElement(options.imageSelector).getProperty('src'),

    My html in the post says:

    <div id="myGallery">
    <div class="imageElement">
    <h3>title</h3>
    <p>descript</p>
    <p><img src="http://play.daivmowbray.com/../image.jpg" class="thumb" alt=""/>
    </div>

    Perhaps I need a link or anchor with each image, I’ll try that now.

    Thanx for any comments and/or help

  97. Christian Schenk says:
    May 27th, 2008 at 1:28 pm

    Hi twincascos,
    I don’t think that it’s a good idea to switch the slideshow script because a lot of people using this plugin want to have a SmoothGallery and I don’t want to disappoint them.
    That being said, Slideshow2 looks really great and it should be pretty easy to package it in a plugin.
    Regarding your problem: replace class="thumb" with class="full".

  98. STORMizer says:
    May 31st, 2008 at 6:51 pm

    Hi all,

    Has anyone figure out how to make the image opened in a lightbox-sort-of interface? This great plugin (when clicked) will open the full-picture in a new window, what i had in mind is for it to open in a lightbox interface.

    Any enlighment or assistance will be appreciated.

    Christ: you might want to include that feature in the next version ;) –that is if its not already there and i simply miss something.

  99. Christian Schenk says:
    June 2nd, 2008 at 5:11 pm

    Hi STORMizer,
    if Jonathan Schemoul releases a new version of SmoothGallery that works with Lightbox and the like I’ll add this to the plugin as soon as possible.

  100. Ray says:
    June 5th, 2008 at 7:53 am

    hi,
    this plug-in is really nice. I was wondering if there is a way to remove the black border that shows up on the images? Thanks!!

  101. Christian Schenk says:
    June 5th, 2008 at 8:41 am

    Hi Ray,
    first off, thanks for writing the 100th comment ;-)
    I just packaged a new release (1.8.1) that allows you to set the color for the border. The default is black but if you’ve got a white background you can remove it by adding b:FFF to the custom field smoothgallery.

  102. Ray says:
    June 5th, 2008 at 8:35 pm

    thanks for the help. I just seen the update :)

  103. Taeke says:
    June 12th, 2008 at 12:32 pm

    Hi Christian,

    thanks for the plugin I have implemented it on some of my sites and it works great. For a client I would like to use his Flickr account as the main source of images. Would that be possible (in a future release?) with this plugin?

    your thoughts on this are appreciated!

  104. Christian Schenk says:
    June 12th, 2008 at 4:01 pm

    Hi Taeke,
    the integration with Flickr is a great idea. I’ll figure out the details and include a first draft in the next release.

  105. MarthaTheCakeLady says:
    June 19th, 2008 at 12:00 am

    Is there a way to make the center link to a post instead of to the image itself. I would love to have the slideshow on my front page and people could click through it to reach an archive they like…. I hope I am explaining what I am wondering. I feel pretty clueless but I love the plugin! Thanks! Martha

  106. Christian Schenk says:
    June 19th, 2008 at 3:19 pm

    Hi Martha,
    yes you can do that: just replace the link to the large image with a link to your archive page. So instead of this:

      <div class="imageElement">
        <h3>Wedding Cakes</h3>
        <p>Have a look at my Wedding Cakes.</p>
        <a href="http://[...]/cake.jpg" title="open image" class="open"></a>
        <img src="http://[...]/cake_thumb.jpg" class="full"
             alt="Wedding Cake" />
      </div>

    you would replace the link in the href inside the a-tag with something like the following:

      <a href="http://marthathecakelady.com/?cat=4" title="open image"
         class="open"></a>

    I hope that helps!

  107. Alex D says:
    June 21st, 2008 at 6:15 pm

    I’m trying to put this onto the homepage of my games reviews website http://www.nometet.com but was having a little trouble, so, I looked at your videos but the one that explained how to get started was “unavailable” - could you re-upload it?

    Thanks for making the plugin!

    Alex

  108. Plugins per creare un portale con Wordpress | BigThink - Idee dal web: gadgets, risorse webmaster, tutorial, programmazione says:
    July 1st, 2008 at 5:21 pm

    [...] SmoothGallery - mostra uno slideshow di immagini relative ai vari post, con il relativo excerpt per ognuna. [...]

  109. PsAmp Blog » Blog Archive » WordPress SmoothGallery plugin says:
    July 1st, 2008 at 7:49 pm

    [...] Read the original article and the explanation here. [...]

  110. Andly says:
    July 1st, 2008 at 7:52 pm

    I Chris, I’m having the same trouble of Alex, please re-upload the video, Thanks!

    Andly

  111. Jeff says:
    July 3rd, 2008 at 11:50 pm

    Where is the config.php in WP 2.5?

    You can’t see the gallery and you’re using Prototype or jQuery on your site? Then you’ll have to change the value SMOOTHGALLERY_USE_NAMESPACED to true. You can find it in the file config.php on line 29. If you don’t use one of these frameworks set it to false; that’s the default.

  112. Christian Schenk says:
    July 4th, 2008 at 10:03 am

    Hi
    Alex and Andly: I’ve uploaded the videos here and there.

    Jeff: you can find the file here: wp-content/plugins/smoothgallery/.

  113. Justin says:
    July 5th, 2008 at 1:25 am

    Hi Christian

    Thanks for the plugin, still trying to get it to work tho.

    I’m getting a Javascript error in mootools.js on line 3, which is the following:

    Element.Styles[style].push is not a function e("Top")

    The page is not showing up any of the images.

    Hope you can help me out

    Thanks

  114. Justin says:
    July 6th, 2008 at 9:39 am

    I’ve figured it out, it was the conflict with script.aculo.us.

  115. Joel says:
    July 12th, 2008 at 12:03 pm

    Need help - plugin does not work in WP 2.5. Returns this error:
    plugins\smoothgallery\smoothgallery.php on line 94

    And another question - is there a tutor/documentation that would explain how to use this plugin (the vid it seems has gone)

    Is it possible to get somewhere instruction step by step? - things here are a little confused…

  116. Christian Schenk says:
    July 12th, 2008 at 5:36 pm

    Hi Joel,
    have a look at this comment: you can download two of the videos from the given locations.
    The step-by-step instructions are on the top of this page. Basically it’s inserting the HTML markup and adding a custom field named smoothgallery to the post/page.

  117. Vicki Flaugher says:
    July 12th, 2008 at 9:28 pm

    I am making a website for my mom, using WP 2.5.1. and the livingos-upsilon-1 theme which incorporates smooth gallery. Uber cool, but here’s my problem.
    http://ukuleleuniverse.com
    The pictures appear and roll fine on the about me page (which I have set as the static start page) and the home, but it hangs up on any other page or post. I have checked the code the best I know how to and it seems right….any advice? Also, one of the original pretty pictures (that came stock with the theme) seems to flash as I navigate around prior to showing my custom ones and/or prior to getting hung up in limbo. Don’t know how to get rid of that or fix this problem….hmmm….What am I missing?
    Vicki

  118. Christian Schenk says:
    July 15th, 2008 at 9:11 am

    Hi Vicki,
    I’m not the author of this theme, it’s Tim Hyde. Although I might help you fixing easy problems, please ask him this specific question.

  119. wildgames says:
    July 18th, 2008 at 12:59 am

    Anyone knows if that plugin is compatible with WP 2.6?

  120. wildgames says:
    July 18th, 2008 at 1:41 pm

    Hi!

    I tried it with WP 2.6 and works fine. :) Bye!

  121. julxz says:
    July 24th, 2008 at 9:36 am

    hi,

    thanks for this plugin..
    its really amazing, ive used this plugin to one of my websites..

    just one question, is there a way to increase the length of the description?

  122. Christian Schenk says:
    July 28th, 2008 at 9:20 am

    Hi julxz,
    there’re three things you can do that come to my mind: increase the size of the infopane, reduce the size of the descriptions font or do both.
    You’ll just have to change some CSS and here’s how it works. Open the file jd.gallery.css from the directory css; you can find it in the plugins directory. Then:

    1. locate the stanza .jdGallery .slideInfoZone and change the value height to say 80px. This’ll increase the size of the infopane.
    2. find the stanza .jdGallery .slideInfoZone p and change the font size to say, 50%.

    While the latter isn’t such a good idea, the first option seems to be a nice solution.

  123. julxz says:
    July 28th, 2008 at 9:29 am

    thanks christian,

    this would really work.. what i will do is just increase the size of the infopane..

    thanks for this plugin, its really amazing..

  124. Jon says:
    July 30th, 2008 at 9:01 am

    Hi Christian, great plug-in… I just can’t get it to work.

    In Firefox, WP2.5, plug-in activates fine, appears to work (generates the html), but refuses to display on the page.

    Not trying to integrate into the theme, just a page.

    The correct calls for header and footer are included and I have no other plug-ins installed. Using a theme called Cutline 3-Column Split. The page source shows the javascript within the footer: You can see the source @ http://bikes2trikes.riverstrucking.com/.

    I just can’t make it work…

  125. Christian Schenk says:
    July 30th, 2008 at 11:19 am

    Hi Jon,
    everything seems fine, but the markup for the gallery is broken because the link to the large image is missing. Please have a look at this comment for a solution.
    Once again, I strongly recommend using Firebug for troubleshooting problems like this.

  126. Frank says:
    July 30th, 2008 at 1:05 pm

    I run a website and have managed to incorporate your fantastic plugin on the fontpage, currently only on my test page http://test.detvarjofint.net/

    It works like a charm, except one thing. The title is displayed in light grey in Firefox and Opera, but in IE they are in dark grey. See example on http://test.detvarjofint.net/smoothgallery_FFvsIE.jpg or just vist http://test.detvarjofint.net/ with the different browsers.

    I think I might be able to do something with CSS, but I suck at that. Anyone to any tips?

  127. Jon says:
    July 30th, 2008 at 5:28 pm

    (sheepish grin)
    and THAT’S why i should get more sleep.

    Thanks for the pointers, looks like that was my problem.

    You do great work. Compensation forthcoming!!

  128. Frank says:
    July 30th, 2008 at 10:23 pm

    Also one more thing. I have implemented carousel, and it seems to be working, except for one thing.

    Jons page say I can use textShowCarousel: ‘My new text’ to change the text, so not to show “Pictures”.

    So I implemented that in my config.php, it’s now like this, but the text don’t change.

    function insertSmoothGallery() {
      return array('width' => 466,
                   'height' => 175,
                   'timed' => 'true',
                   'delay' => '10000',
                   'textShowCarousel' => 'Snarvei',
                   'showCarousel' => 'true');
    }

    That should work, right?

  129. Frank says:
    July 31st, 2008 at 9:50 am

    I solved the last problem by editing directly in the jd.gallery.js-file and changing the option there.

  130. Christian Schenk says:
    August 3rd, 2008 at 12:29 pm

    Hi Frank,
    the different colors seem to be a problem with the CSS on your site. I’ve got the same problem on this page too: IE uses the color for the default h2 element and not the specific one for an h2 element inside the imageElement of the gallery. So since my headings are blue, the title for the images inside a SmoothGallery is blue too in IE. The bad thing is, that I don’t know how to fix this, but it doesn’t bother me too much either. Sorry.

    textShowCarousel [...]
    That should work, right?

    Yes it should. This is one of my top todo items for the next release.

  131. Frank says:
    August 3rd, 2008 at 2:04 pm

    Think I found a solution, even if it’s strange.

    In the file jd.gallery.css I went to the section .jdGallery .slideInfoZone h2
    and changed color: inherit; to color: #fff; and then I got white text in IE7.

    Don’t know why that should work, as the title uses h3, but as long as it works I’m happy.

    And lastly just a thanks for your plugin. Love the nice work you put in to make using WordPress easier for the rest of us.

  132. Cliff says:
    August 15th, 2008 at 7:58 am

    Hello Christian! This looks like a great solution for what I am looking for! All though I am such a noob and implementing it all seems like a scary task LOL. Couple of questions:

    1. In the above example, when you click the center of the picture the full size picture opens. Is there a way to arrange for the picture to open full size as seen here at lightview plus / lightview-en. I want my viewers to see some pretty big photograph without them having to leave the front page.
    2. Has anybody incorporated this smoothgallery system into the new “the morning after” theme, if so, any links?
    3. Any comments or help would be greatly appreciated.

      Thank you,
      Cliff

  133. Christian Schenk says:
    August 15th, 2008 at 12:25 pm

    Hi Cliff,

    1. Other people asked for this feature too, but currently this doesn’t work with SmoothGallery. Since Lightview uses Prototype.js it isn’t compatible with SmoothGallery anyway - maybe this gets fixed.
    2. Adding a gallery into a theme isn’t that hard: just read this page and if you need more help, write me an email and we’ll figure it out.
  134. Michi says:
    August 18th, 2008 at 8:06 pm

    Hi Christian,

    i´m using wordpress with your wonderful plugin!
    My aim is to show two or more smoothgalleries
    on the startsite of my blog. I already looked at your
    video about inserting two galleries on a single page.
    Is there an easy way to do so in wordpress?

    Thanks for your reply!

    michi (http://www.michihiebl.de)

  135. Christian Schenk says:
    August 19th, 2008 at 9:25 am

    Hi Michi,
    I started working on this, but I haven’t got the time to finish it. In the meantime you’ll have to manually add the links to the CSS and JavaScript. As soon as I’ve got it working, I’ll announce the solution here.

Leave a Reply

    • Pimped this plugin your site with a smooth gallery?
      Consider a donation.