WunderSlider

The ultimate Responsive Embedded & Fullscreen jQuery Slider



Also visit the WunderSlider Demo and the WunderSlider WordPress Demo.

Download

Purchase to download WunderSlider and obtain a license for commercial purposes.

Download WunderSlider for free personal use.


  • Responsive & Flexible Layout

    Adaptive display modes support responsive designs without the need for media queries.

    WunderSlider’s flexible sizing system offers transition effects in all modes:

    • Fullscreen mode – occupies the entire viewport while staying in the background so that content can be displayed on top.
    • Proportional mode – adapts proportionally to the screen size.
    • Fixed mode – displays at a set fixed size.
  • WordPress plugins included

    WunderSlider comes with its own WordPress plugin that allows to embed it on WordPress sites through its own shortcodes.

    Visit the WunderSlider WordPress demo site for examples based on standard WordPress galleries and NextGen Gallery.

    The WunderSlider Gallery plugin provides an automated way to convert any standard WordPress gallery that is embedded on a page using the [gallery] shortcode into a WunderSlider.

    WunderSlider Gallery also supports NextGEN Gallery to embed any gallery as a WunderSlider using the [wunderslider_nggallery] shortcode or by enabling it as the default renderer for the [nggallery] shortcode.

  • Automatic Image Adjustment

    Images are adjusted to the slider size and display mode, maintaining the original image’s aspect ratio.

  • Effects

    41 transition effects that can be applied randomly or specified per slide.

  • Themes

    8 skins (themes) that support both embedded and fullscreen modes.

    Easily themeable.

  • Overlays

    12 overlay meshes in black or white with adjustable opacity for smoother image appearance on all display sizes.

  • Flexible Captions

    Individual image captions with titles, HTML descriptions and links.

    Caption position and size can be set independently for each image.

  • Links

    Link images and captions optionally: Allows to link image captions only or also the image.

  • Controls

    Show or hide UI controls independently: Next & previous navigation, image selectors, image captions.

  • Flick it!

    Flicking / swiping on all devices.

  • Touch Enabled

    All controls, including flicking / swiping, are supported in all display modes also on touch-enabled devices.

  • Viewing Comfort

    The slideshow can be paused optionally when the cursor is placed over an image.

  • Random Order

    Randomize image order: the order of the images displayed can be fixed or randomized.

  • Configurable Effects & Transitions

    Configurable number of effect blocks with auto-adjust feature to maintain a square block geometry if desired.

    A random number of blocks can be used as well.

    Configurable transition and effect times.

  • Lazy Loading

    Helps to save bandwidth by lazy loading images.

  • Valid Code

    • Valid HTML5
    • Valid CSS3
  • Cross-browser Compatible

    WunderSlider works with: FireFox, Internet Explorer, Safari, Chrome, Opera and other browsers on PC, Mac, iPhone, iPad and many other devices running Windows, Linux, Mac OS, iOS, and Android.

    Tested on:

    • FireFox (FF)
    • Internet Explorer 7, 8 and 9 (IE7, IE8, IE9)
    • Safari on Mac OS and iOS (Mac, iPad)
    • Chrome
    • Opera
    • Android

What version – Free for Personal Use or purchase a Commercial License?

The free version for personal use provides the same features as the commercial version. Its use is limited by the Free Personal Use Single Domain License (FPUSDL). This version adds a small logo to the bottom of pages where it is used and sends usage data (on 10% of page loads indicating the URL of the site it is used on). This is to spread word about the WunderSlider and make its use more wide-spread. It also helps to improve it – the more it is used, the more effort is put into its further development.

The commercial version is available for purchase under the Single Use Single Domain License (SUSDL) for commercial purposes. This version does not include the little icon and it does not send any usage data.

Documentation

WunderSlider includes extensive documentation in PDF form. For additional information please refer to the WunderSlider Documentation.

318 comments

  • Piter Moon

    gracias

  • VBK

    Glad to see another Wonderful plugin from you.

    Good luck

  • Carolina

    can’t I use it in home.php to use it in my homepage? (is not a single page or post)

    • Sure, you can use it there as well, for example indicating the id attribute to identify it (the gallery).

      • Carolina

        I don’t know this, I mean what is the shortcode for it, the kind of “”

        Thanks

        • Assuming that you are going to use the WunderSlider Gallery plugin:
          For example, if you have attached some images to a post, use the post ID and pass it to the gallery: [gallery id="123"] where 123 is the ID of the post with those images attached.
          If you want to use it in a template, you can do <?php echo do_shortcode('[gallery id="123"]'); ?>.

  • Pat

    Hello.
    The plugin is installed, but I get the error of The WunderSlider plugin is missing. Am I doing something wrong?

    • WunderSlider Gallery is complaining about the WunderSlider plugin missing. Simply download or purchase WunderSlider using one of the links on top of the page, unzip the downloaded file and you will find the WunderSlider plugin in the wordpress folder. Install and activate it (there are two plugins in that folder, as you have already installed WunderSlider Gallery, you only need to install one). The WunderSlider Gallery plugin handles the [gallery] shortcodes and uses the WunderSlider plugin to convert the standard WordPress galleries into slideshows.

      • Hello Kento,

        I’ve downloaded the WunderSlider gallery on WordPress and also downloaded the zipp Wunderslider plugin. maybe i’m really stupid but i don’t understand where I can install this plugin? I don’t have a WordPress folder on my mac because everything about it is on the internet… so where and how can I install this plugin to make the WunderSlider Gallery work?

        • ad

          Go to Appearance>plugin Add new then on the top bar is an UPLOAD link. Navigate to the zip file on your download folder and upload and activate.

  • pasportit

    What are the 8 themes that support this plugging?

  • Hi,

    Great plugin! Just one problem I’m having: when I choose the “Proportional” setting and use the exact same shortcode provided in your example, the images won’t load. The other two methods work fine, any reason why?

    Thanks in advance!

    • Hi Justin, thanks for using it :)

      Have you set a width in Proportional mode? Check out the example on this page, it uses display="proportional" along with container_width="91%" container_height="360px" – in proportional display mode, you must specify the container width as a percentage and give the container an appropriate height.

      • Justin

        Hm, seems there was something wrong with my shortcode.

        It’s working now, thanks!

          • Spoke too soon, I’m having another problem.

            I’m trying to call the shortcode outside of the “post content”, but within a single blog page.

            When I write this code, the gallery does not show up UNLESS I TYPE [gallery] inside of the post content (showing two galleries):

            It does create the div, but no images can be found.

            When I write this code, the gallery does show up with no problems:

            Any tips?

            • When used in the template like that, you will have to make sure that the WunderSlider Javascript is loaded as well. The page throws an error because it currently isn’t included, if you modify it and add the script as shown here, it should work. Note the script that is loaded just before the gallery shortcode.

          • Justin

            http://ax3battery.com/devsite/?p=34530

            1) Is it just me or is the box getting smaller every time I click on the arrow to the next image?

            2) After I click on the arrow to the next image, when I click on the top logo or the accordion.. it’s making the slider go to the next image as well. Is it a script conflict?

            • 1) is a bug, I just tried it on Safari and it keeps getting smaller, on FF it shrinks only once. Will fix that immediately.
              2) might be a conflict, will have a look at that.

            • Fixed 1) in release 1.3.7 now available to download. Please update to that release.
              Regarding 2) it looks like a conflict to me, not sure why it happens. Clicking anywhere on that page left or right after having advanced a slide will navigate through the slides.
              (By the way, you have a fixed-size WunderSlider on that page as well (near/below the last image) which doesn’t display anything but you can click the navs.)

  • Ricardo

    Hey,
    First off, congratulations for the great gallery. I’ve tried thousands of them but this is definately the one I was looking for. Just one question, in the features it says: Allows to link image captions only or also the image.
    How can I link the images in the slideshow to the img source in order to open a lightbox?
    Thank you in advance.

    • Thanks Ricardo :) Do you want to use any specific lightbox?

      • Ricardo

        hey Kento, I’m using easybox http://code.google.com/p/easybox/ in other parts of the site, but I can choose another, ;)

        • Works nicely, for example: save this as easybox.html in the demo folder, copy the easybox folder there as well. When you click on an image, the lightbox appears.

          • Ricardo

            That works fine! The thing is that I’m working in wordpress and I don’t know how to add links to images on the gallery. I suppose that if the easybox script is loaded and the images are linked to the img source that should work, but I don’t know how to do that…
            thank you!

          • Mari

            Hi,

            I had a very similary question as the person above. I would like each image to be clickable, a feature mentioned in the manual. I’m using the WordPress Gallery and defining the links in “Attachment Post URL” of the wordpress gallery. I’ve also ensured that the shortcut has the parameters clickable=”true”. However, when my gallery shows up it is not clickable. Is that not where WunderSlider fetching the image URL? Am I supposed to define the links for each image elsewhere?

            Thank you

  • Larry Bradshaw

    I tried inserting this line into my php template file (instead of using the shortcode in the text box), but it won’t produce the result, just blank space where the slider would be. What other code am I missing?

  • pasportit

    Hello again, it is a wonderful slider, although I am wondering if you can help me to make the fullscreen slider on the main page (with no body) the only thing with the slider should be the menu. Is that possible? I really appreciate your help.

    • For plain HTML or PHP, in the demo folder of the distribution package you will find examples for that: wunderslider-fullscreen.html and wunderslider-fullschreen.php. If you are looking for a way on how to do it on WordPress, you can either use the Fullscreen example or with the WunderSlider Gallery plugin you can use the example on this page and set display="fill". You might need to add some CSS rules depending on your theme as well.

  • John

    How do I get more than one slideshow on a page? The short block of code pointing to the gallery is: [gallery container_width="80%" container_height="300px" display="proportional" mode="proportional" clickable="false" link="file"] I see no way to point to a separate gallery. link-“file” seems to be vague. How can i do this?

    Thanks

    John

    • You would pass the post ID to embed the gallery from a different page or post: [gallery id="123"]
      If you are using NextGEN, you would provide the gallery id: [nggallery id=”5″] if you are using WunderSlider as the default renderer or also [wunderslider_nggallery id=”5″] – please refer to the WunderSlider Gallery page as the documentation here needs to be updated.

  • Valerie Adler

    Hiya, I’m trying to use Wunderslider, but after spending literally hoursS trying to pick the perfect thing (and deciding it was yours), when I downloaded the plugin for personal use, it says: The package could not be installed. No valid plugins were found.
    Plugin install failed. What shall I do next? Thanks

  • Larry Bradshaw

    Any way to control when the caption/title appears? On some pages I want captions for my sliders, other pages I don’t want captions (like my home page). I tried entering caption=”false” in the shortcode, but this didn’t do anything. Is there anything I can use besides the either all Off/On switch as I want captions on by default.

    • There is the useCaption parameter which can be set to false but when trying it with the gallery shortcode it doesn’t seem to work. That would be a bug to fix. Workaround, with the editor in HTML mode, add a CSS rule before the shortcode where no caption should be displayed:
      <style>
      .wunderslider .caption {
      display: none;
      }
      </style>

  • Hi there,
    I’m trying to use Wunderslider with NextGen Gallery and have tried all the combinations of settings and shortcodes that I can think of – but I can’t get the Wunderslider to appear on the page! I’ve used the [wunderslider_nggallery id=”2″] in the page comments, but nothing appears other than the page heading. What am I doing wrong?

  • HW

    I’ve installed the WunderSlider plugin, and the gallery plugin, and everything seems to be working fine EXCEPT the navigation NEXT/PREVIOUS buttons. They show up, but are not functional. Any suggestions to fix this? Thanks for a great plugin.

  • Pingback: Webdesign and Development Resources

  • I’ve installed the WunderSlider plugin, and the gallery plugin, and everything is ok. But I see thin lines on the photos. What can I do? Should I buy a license for commercial purposes?
    Thanks and regards
    Raed

    • Thin lines? Ah ok, I suppose you mean the overlay … that has nothing to do with the license, it’s a feature :) You can turn that off by specifying None under Appearance > WunderSlider Gallery when using the WordPress plugin or by simply omitting that attribute when creating the WunderSlider.

  • HW

    Can WunderSlider Gallery pull from various NextGen Galleries at the same time? I tried a shortcode like [nggallery id=”1,2,5″] but that did not work.

    Thanks.

  • Craig Miller

    I really like the pluggin and am hoping to use it extensively. However, there are a few things that seem to limit it versatility for extensive usage on a website.
    (1) Can photos be resized to fit within the slider? As far as I can see, the slider simply crops everything to fit. Hence portrait shots don’t work. Right now my workaround is to take portraits into photoshop and expand the canvas, crop to the slider dimensions (with black then on either side of the photo) and resave. But this is time consuming. Any ideas?
    (2) I’m using the slider with nextGen galleries. For different galleries displayed on different posts, I want to adjust the wunderslider’s properties. Specifically, I want to control the transition effects and the transition timing attributes for individual slideshows (e.g. Slow Checker transitions in one show, faster Fade-in transitions in another). Is this level of control possible?
    (3) Ideally there would even be some level of adjustability within a show–say speeding up transitions in one section, showing down in another–but I recognize that if I’m using the nextGen gallery format, that may be asking too much.
    (4) My transitions seem to generally have a little hick-up in them. For example, if the transition is “Slide down” the new slide gets about 10 or 15% of the way down and then freezes for a fraction of a second. Along the same lines, I’ve noticed that when I first view a post with a wundersilder on it, the transitions may be quite slow and erratic. Then if I click on the slider so as to trigger a transition, things suddenly work better (though the small hick-up effect still remains). Any thoughts?

    Thanks! Craig

    • Hi Craig,

      Many thanks for your detailed feedback, regarding #1 yes you are right, when it is in proportional mode, it will make the image fit regardless of its dimensions. This is to make it more convenient to handle images that are of similar proportions. If you have landscape and portrait images that should be displayed in the same slider, then it’s really the best to do what you are doing now, i.e. to choose a part of the image that will show the desired area. It would be great to have a cropping tool built in for that though, isn’t there an addition that allows to do that with NextGEN or the normal WordPress galleries?

      On #2, have a look at the documentation that comes in the pack, there are a lot of configuration options that you can use and these can be passed on through the NextGEN shortcode. There are a few options that need review and also some enhancements are planned for the next release to make it more flexible to handle.

      #3 wouldn’t depend on NextGEN, it would be an additional set of controls that would have to be added to WunderSlider’s core.

      Please post a link for #4, I’d like to see and test this myself to find out what might be causing it.

      Cheers

  • Sy Moen

    hey… there is an error in your documentation that drove me crazy:

    container_width=”85%” height=”360px”

    …should be:

    container_width=”85%” container_height=”360px”

    Please update these refs for the hair health of others.

  • Hi Kento! Thanks for sharing your creation to the world. Do you know if there’s a way to grab images randomly from a SQL database? Thanks in advance!

    • If you want to randomize the images there is an option for that, see randomize under Transitions in the PDF documentation included with WunderSlider.

  • Alex

    Hey Kento, Thanks for this plugin.. it’s really useful.

    Do you know of a way to link NextGen’s Imagelist thumbnails to their corresponding image in a wunderslider?

    Right now I’ve got NextGen Options > Gallery > gallery open in imagebrowser ticked on, so that at least takes each thumb to the image in NextGen’s image browser (not lightbox).. but the wunderslider isn’t applied.

    Thanks in advance.

    • Thanks Alex, nice to hear that :)

      As you can’t link the images with the [nggallery] shortcode, I can’t think of an easy way to achieve exactly what you describe. You can link images with the [singlepic] shortcode though, so you could at least create a page with the WunderSlider on it showing the whole set of images and link the single image to that page.

      If you want more details on the [singlepic] shortcode, there is a demo and documentation on Demos of all NextGEN Gallery Types.

  • Hi! Thanks for the cool plugin. I am trying to use Wunderslider with WordPress. 9 times out of 10, though, the first image in the slider does not properly load. It just appears in a small portion of the top-left corner, and a loading symbol appears in the middle of the container, but it doesn’t load until you press next or previous. Link: http://www.strategies4collegeapps.com/2012/sample-essay/
    code: (removing the open tag symbols so the code will show)
    [wunderslider]
    wunderslider mode=”proportional” width=”608px” height=”886px” period=”99999″>
    image url=”http://www.strategies4collegeapps.com/2012/wp-content/uploads/2012/10/sample_1.png” title=”Sample personal statement for law school admission” description=”by Michael Crouch” />
    image url=”http://www.strategies4collegeapps.com/2012/wp-content/uploads/2012/10/sample_2.png” title=”Sample personal statement for law school admission” description=”by Michael Crouch” />

    image url=”http://www.strategies4collegeapps.com/2012/wp-content/uploads/2012/10/sample_4.png” title=”Sample personal statement for law school admission” description=”by Michael Crouch” />
    /wunderslider>
    [/wunderslider]
    thanks!

    • Hi Michael, I just tried the link but the site currently appears just blank. Anyhow, make sure that you use plain double quotes on all attribute values instead of the right double quotes that appear in your code as it is now.

      Correct: mode="proportional"
      Wrong: mode=”proportional”

  • Hi,

    I have managed to install Wunderslider no problem and have it display NextGEN galleries. My only problem is that when I try to change some of the options e.g. “Show next/previous buttons” and “Show slide selector buttons” these changes aren’t showing on the slideshow. I’d love to know what I’m doing wrong.

    I have taken it off my website for now in anticipation of a fix to this issue.

    Thanks

  • Hi,

    I have now created a test page for us to resolve this issue.

    http://bcslearning.net/maths/gallerytest/

    • Hi Nick,
      Can you please share the shortcode used on the page?

      • Hi,

        This is the short code used:

        [wunderslider_nggallery id=”3″]

        I have also put a screenshot on the page with the relevant settings showing “Show slide selector buttons” as being switched off but still appearing on the gallery.

        Thanks

        • On the settings page Appearance > WunderSlider Gallery is the option Enable these settings by default? checked?

          • Hi,

            It looks like that has fixed it so thank you.

            One other thing – is there a bit of shortcode to align wunderslider centrally on a WordPress page?

            Thanks

            • Yes, you can wrap it for example like this:

              <div style="width:95%; margin-left:auto; margin-right:auto; left:0; right:0;">
              [wunderslider_nggallery id="4" width="540px"]
              </div>

              Probably needs some adjusting for your theme but that’s the general idea to center it.

          • One further question too, please. Is there a way to lose the drop shadow around the wunderslider?

            • You can add this after where you embed the WunderSlider on the page, or add the rule to a stylesheet in your theme if you don’t want the shadow in general:

              <style type="text/css">
              .wunderslider-wrapper { box-shadow: none; }
              </style>

  • Mari

    Hi! Thank you for this fantastically designed plugin, well worth it.

    I’m having a rather bizarre issue though; where the nggallery works fine with the slider; but the wordpress gallery does not work at all. I would prefer to use the wordpress gallery because I want my photos to be linked to other pages, which is not possible using nggallery.

    I’ve tested this with multiple themes etc. and nothing is working. So I’m wondering if anyone has any idea as to why the slider works for one code but not the other.

    [gallery id="89" wunderslider="true" useCaption="true" width="735" height="400" effects="slideRight" overlay="none" overlayopacity="0.8" preloadimages="0" mouseoverpause="true"]

    [wunderslider_nggallery id=”9″ useCaption=”true” width=”735″ height=”400″ effects=”slideRight” overlay=”none” overlayopacity=”0.8″ preloadimages=”0″ mouseoverpause=”true”]

    Thanks!

    • Hi Mari,

      Thanks for your nice comment, it’s great to see that people like it :)

      Regarding the shortcodes you are using, I’ve noticed that the first one indicates id="89" while the second one has id="9" – by any chance, is the first one pointing to a gallery that doesn’t exist?

      Note that some of the attributes should be corrected as these are case-sensitive:

      overlayopacity should be overlayOpacity
      preloadimages -> preloadImages
      mouseoverpause -> mouseOverPause

      Also currently there is a bug that results in the effects parameter passed through not being applied. If you only want one effect to be applied, you can use the singular form which will work: effect="slideRight".

      Please check if that does it or let me know if you still have problems. In the latter case, please post which other plugins are activated on your site as well.

      Cheers

      • Mari

        Hi Kento,

        Thank you for your very prompt response, I don’t think the case-sensitivity was causing an issue because the plugin was working with nggallery’s shortcut, but you were right on with the plugin interference.

        I de-activated all of my plugins (about a dozen or so) and re-activated them one-by-one. I found the problem was with ” Gallery Shortcode” (which allows user to set a comma seperated string of ID’s for the [GALLERY] Short tag from http://mfields.org/wordpress-plugins/mf_gallery_shortcode/) which I guess isn’t being supported anymore anyways. Now pretty excited to actually explore the features of the plugin!

        Have a great weekend!

  • Tom

    Hi Kento,

    Thank you for this wonderful tool.However, I have a problem that I hope you could help. Somehow the images on the wunderslider are cropped and only a topcorner part of the image is shown. You can go to my website at: vietyouthdc.org/?page_id=40&preview=true&preview_id=40&preview_nonce=bbcae04b8a to take a look (I dont know why the second one works and the first one doesn’t. Maybe it’s because of difference in the size of the photo?)

    PS: I’m using the full-screen display option

  • salshork

    I’m using your plugin on http://sallyshorkend.com and in my gallery, I have pics of different dimensions, and I’d like these images to be shown in their full dimensions.

    How do we manage putting all these pics up with different dimensions when you have a standard dimension setting.

    • When you say “I have pics of different dimensions, and I’d like these images to be shown in their full dimensions” do you mean you don’t want them auto-cropped to the WunderSlider container?

      In general, if you have images of different proportions where the auto-cropping does not yield the results you want, create copies of those images and in each copy choose that part of the image which adjusts to the desired proportions and is yet adequate to convey what the image tries to express. Then use a fixed mode instead of proportional to display the images.

  • hi
    i was wondering can it support thumbnails as well

    thanks

    • That would be a great addition. Do you suggest any particular format? Feel free to mention other sliders or plugins that do what you would like to see. Feedback on that is welcome!

  • Pingback: Images finally added | Retro World

  • hi thanks for the replay
    what i was thinking is a way to add thumbnails to the slider
    the you can choose between dots or thumb
    like wp-supersize gallery has

    can it be done
    it will be a great update for the plugin
    thamks

  • hi
    how are you
    can it be done?

    thanks

    • Yes it can be done, I think it would be a great addition and it actually is on the todo list. I can’t promise when exactly it will be available though.

  • LGJ

    I have wunderslider w/ nextgen. In the fullscreen mode the nav buttons show, but aren’t active. Click as you may, nothing. In other modes, the buttons work, but then I need the fullscreen mode. I tried to z-index the nav container to 9999, did not help.

    The url: http://www.racketsandrunners.ca/wordpress/
    the shortcode: [wunderslider_nggallery id=”1″]
    Neither works: [wunderslider_nggallery id=”1″ clickable=”true”]

    Please help!
    PS I’ll buy for the client the commercial version once the problem is fixed.

  • Cees Wouda

    I installed Wunderslider and Wunderslider Gallery. Main reason is to get responsive gallery based on Nextgen. BUT for some reason the gallery does not adjust to smartphone (Android ICS) display size. The demo-website behaves OK. I use Weaver II theme. Any idea?

  • Adam Winsor

    Hey, Just a heads up- in WordPress, on the Wunderslider default settings page, under Proportional display mode it includes this example code:
    [gallery container_width="80%" height="360px"]

    but that breaks the slideshow for me. After reading through some of your conversations with others in this thread I figured out the problem- It needs to be:
    [gallery container_width="80%" container_height="360px"]

    Hope this helps!

    Thanks for the great plugin!

    • LGJ

      Depending on the use of nextgen or not:

      Nextgen gallery:
      [wunderslider_nggallery id=”1″ container_width=”100%” container_height=”450px” display=”proportional” mode=”proportional” clickable=”true”]

      Not Nextgen gallery:
      [galley container_width=”100%” container_height=”450px” display=”proportional” mode=”proportional” clickable=”true”]

      Adjust the id, container_width, container_height, clickable to your prefs, else leave it as is.

      LGJ

      • Adam Winsor

        Right, mine is working, but the provided example in WP says “height=” when it should say “container_height=”.

        If you follow the example, then it breaks.

        • Yes that’s true, thanks for mentioning it – the documentation needs to be corrected :)

          • Paul A

            Documentation still not corrected – I had a headache with he same issue, and then spotted these comments which has saved the rest of my hair from being pulled out. Seriously, you need to update this info! I almost gave up on your plugin.

  • ZAP

    Hello –

    Great plugin! Thanks for all the hard work.

    A couple others have also commented above about the same issue that I have: displaying images of varying sizes.

    In my case we want to be able to throw up an assortment of images into NextGen galleries and have them completely visible (not cropped to fit) within the slideshow. We do not want to resize them all to fit the proportions of the slideshow. What we’d like is for all of the images to be scaled to fit within the slideshow (and the rest of the slide should be filled with a solid background).

    It doesn’t look like I can do this just in the CSS, and I don’t want to edit the plugin code and then not be able to get future updates. Any chance you folks will be convinced to implement this option? Would you be more likely to do so if I hack it into the code myself and share it with you?

    Thanks again!

    • Hey ZAP,
      You’re right, CSS rules won’t help you to achieve this. On the technical side of this – the images are sliced up for the effects – using images of different proportions that do not fill the container can create a bit of a problem. I wouldn’t mind adding an additional option to the mode parameter – for example a fit option that doesn’t crop but resizes maintaining the aspect ratio and fitting the dimensions of the container, but I fear it’s going to be very hard to implement because it’s quite different to the approach and ideas behind WunderSlider. In other words, I need to check if it’s feasible to implement that option.
      You can however achieve the same effect, you just need to create versions of the images and use the fixed mode as I have suggested in this comment. It involves an intermediate step (which can be automated with ImageMagick) but will actually yield better results I would say (thinking about image quality).
      Thanks for the suggestion and offer to help out with coding that. I’ll follow up on this after reviewing the possibility to add the option.
      Cheers

  • finchin

    Just bought a license last night. It did a very good job existing galleries.

    I have run into a couple of problems trying to use the gallery plug-in in creating a new post.

    The images are all 1280×720 pixels, and I want them in a gallery sized 640×360. The page (column) width itself is 660px.

    1. When I try fixed width (set as default at 640×360 px) I get only the top left quarter of the image. Am I missing some setting?

    2. I cannot seem to figure out how “proportional” must be set at all. Sometimes, I simply get XML error on line 0. Other times, it’s a tiny grey box with no image.

    I have looked at the documentation with my extremely limited coding knowledge, but could find no situation,or not understanding it.

    At the moment, I have turned off its default use. Would very much like to use it though.

    Thanks in advance.

  • webguy262

    I’m using the slide right effect. Any way to have the first slide load in place rather than have it slide in?

  • zitrusblau

    Dear Kento,

    at first thanks for this great work! I already try out your Plugin for WordPress a few weeks ago and all works fine. Now we’ve purchased a licence and it seems that the shortcodes are not working. If I want to add a slider by shortcode (with NextGen) I’ll get this javascript error:
    “Cannot set property ‘effectWorker’ of undefined [http://dev.zitrusblau.de/justbig/wp-content/plugins/wunderslider/js/wunderslider-min.js?ver=3.5:22]”
    If I paste the shortcode include XML which is mentioned in the documentation for single pics the slider works fine but this is very difficult to handle galleries by this way also I need the working shortcode for Homepageslider.

    Here are the specifications on dev.zitrusblau.de/justbig:
    – WordPress 3.5
    – Responsive Theme (I try it also on standard TwentyTwelve Theme, same result)
    – Gravity Forms Plugin
    – WP UI plugin
    – NextGen Gallery plugin
    – Wunderslider Plugin
    – Wunderslider Gallery Plugin

    I try also to deactivate all Plugins step by step but nothing change.
    The first error you can see on Homepageslider, On the “Beispiel-Seite” I’ve added two slider, one with shortcode which is not working and one with XML wich works fine. I’ve also tried different settings for NextGen on the Wunderslider Gallery Options Page but nothing changes.

    It would be glad If you can help to find the issue, cause this Plugin is really great and I want to get it work fine. Sorry for my bad english!

    • zitrusblau

      Dear Kento,

      sorry for confusion, this is my mistake I’ve forgot to set width and height for proportional mode. All works fine!

      Now I’ve another problem. ;-)
      I want to use the Wunderslider for NextGen galleries which is generally no Problem, but the title of the single pics are not showing in the caption. The slider shows the title of the whole gallery instead, same on your NextGen demo.
      Is there any way to get the title of the single pic? Otherwise the Wunderslider is not really usefull for NextGen galleries… :-(

      • zitrusblau

        Kento, now I’m near to a nervous collapse. It seems Wunderslider is really unusable for NextGen galleries or/and your documentations relating to WordPress and NextGen especially the shortcodes are a nightmare!

        I need to have the caption on the right side of the image and try the following attributes at the nggallery-shortcode: captionContentElement=”span” -> no effect, caption_top=”0px” caption_right=”0px” -> no effect, caption=”top right” -> no effect
        The next problem in this relation is the width of the image and caption container because the widths are setting as inline style by your script. If there is any way to position the caption beside the right side of picture, would be the inline style adjusted? Cause the caption should not be an overlay.
        I can set the container class by shortcode (this atrribute works fine) and set the widths with “! important” statement but this is very ugly…

        • You can target the caption and place it pretty much everywhere you need, it’s just a question of using the right CSS rules within the context. For example, this would be a start for what you want to achieve:

          <style type="text/css">
          .wunderslider .pane div.caption {
          right: -100%;
          width: 200px;
          }
          </style>
          [nggallery id="1" wunderslider="true" container_width="50%" container_height="300px" display="proportional"]

      • Thanks for pointing that out, if you update to 1.3.4 this has been changed so that the image alt/title text is used as the caption title.

        • zitrusblau

          Dear Kento,

          many thanks for the changes, this is great!

          About the CSS, I’ve already change the rules to get the needed layout, but with many “! important” – statements. It would be very usefull if it’ll be possible to create own slider-templates by copying the template-files into the used theme folder, similar to NextGen.

          Maybe you can consider this for a future version?!

          best regards

          • I totally agree, I was going to suggest to create one but the WunderSlider has to be improved so that it will take other themes than those provided with it. I’m putting this on top of the list of things to do.

  • LuisMu

    hi, I bought the product: wunderslider
    I’m so used fullscren mode, but the image in landscape mode screens is cut by the top.

    How can I do to cut the image “only” for the bottom?
    Regards

  • q1

    How to remove powered by wunderslider from the frontend in wordpress site?

  • Henk

    I have tried to install the plugin via:

    – Manually via FTP (upload to plugins folder)
    – Via admin console, upload ZIP
    – Via admin console, WordPress plugin libary.

    The Wunderslider plugin shows up, but says:
    The WunderSlider plugin has not been found. You need to install or activate it.

    Please visit WunderSlider to obtain a copy, then install and activate the WunderSlider WordPress plugin.

    How can I fix this?

  • Alsace

    Hi Kento, very nice plugin !

    I have some trouble with WP 3.5.
    I need URL links, I put the code (HTML preview)
    [wunderslider]

    [/wunderslider]

    and it runs well, but when I select in backoffice “Visual” all between [wunderslider]
    [/wunderslider]
    is erase…

    Do you have some advise ?

    Best regards

  • beyondeyes

    Hello there!

    First i have to thank you for this great and powerfull plugin!

    I´ve got a little problem in Chrome & Safari: Among the picture selectors are question marks shown whithin the slides.

    In Opera, Firefox, IE9 and mobile Browsers everything is fine. Any solution?

    Thanks in advance!

    • beyondeyes

      [you can look at the problem here: http://idmodus.com/cms_de/inspiration/ ]

    • Thanks, the site looks awesome by the way :)
      What happens is that you have a CSS rule that tries to load images/postbullets.jpg on the li tags and the resource is missing, thus the question marks. The solution would be to restrict that rule to where it should be applied only, so that it doesn’t get applied on the WunderSlider.

      • beyondeyes

        I see – thanks for looking into the code. Unforunately i´m just a designer, not a coder. But i think after achieving your support i´ll figure out where to find the corrupted part.

        And also thanks for the compliment!

  • beyondeyes

    Found it. Double-facepalmed myself for it.

    I´m using custom css from another folder for some pages and forgot to replace the links in the css-files.

    Thank you, thank you, thank you!

  • Jose

    Really like the plugin, has pretty much everything one would want.

    I was wondering if there is a way to add thumbnails of the images under the slider? or even as a pop up thing when u scroll to the bottom?

  • hi i would like to get an offer to include thumbnails in the slider

    can it be done

    thanks

  • q1

    This plugin is superb.

  • q1

    Is there a way to show and hide caption from shortcode?
    As I am using three sliders on same page, so when I hide caption through css it hides for all the three sliders.
    So what is the way to hide it for two sliders only?

  • Megan

    I purchased the commercial version of Wunderslider and also the premium Nextgen optimizer, and everything was working fine till all of a sudden my slideshow on the home page disappeared (and the gallery lost it’s lightbox effect on the gallery page at the same time). Not sure if this had to do with updating WP to 3.5. The home page, with non-working slideshow is http://www.ritasahai.com.
    Can you tell me why it isn’t working, but was just fine before?

  • luis

    Kento, hello again, I have re-sent the e-mail with the url example.
    I hope you can see it …
    thanks

    • Hi Luis,
      I’ve seen it now, in that mode it will adjust so that the image is centered. As that happens automatically I think it would be difficult to try to override with a CSS rule, probably adding as an option would be a good idea.

  • jan

    Hi,

    testing your nice Wunderslider, because of the features “responsive” and “proportional” and integration with ng gallery.
    however i have some remarks/wishes, which would actually make it generally useful for my purpose.

    1. i find the “responsiveness” not proportional. the slider has flex width but always fixed height. when resizing this results in non proportional slider, just showing a cropped part of the image. To me, responsive and proportional would be resizing height and width proportionally.
    2. i wish images would optionally not be cropped but fit inside the slider container filling empty space with solid bg color.
    3. optional thumbnail carrousel strip would also be nice…

    I am looking around already a long time to find a nice customizable slider/slideshow which fits these 3 points and is also smooth, has custom positioning of nav elements and is compatible with nextgen and mobile devices.

    thanks
    jan

    • Thanks for your thoughts Jan, I think #1 would be good to have as an additional option, same for #2 and #3. Similar requests have been made already by others and I hope to be able to add these soon.

  • Jeff

    Just wondering if Wunderslider has been tested on a Multisite environment. I installed it on a clean WP 3.5 multisite and when I go into the configuration I get this message “The WunderSlider plugin has not been found. You need to install or activate it.”

    It seems to me that it isn’t Multisite compatible. Can you verify?

  • winterstreet

    Hello, Using the commercial wordpress version and it works great. But now I’d like to use the shortcode in a widget and it doesn’t do anything. I have the code in my functions file to execute shortcodes, and others work. Should I be able to get the Wunderslider to work in a widget?
    Thanks.
    Dave

  • cath

    Warning: file_exists(): File name is longer than the maximum allowed path length on this platform (4096):

    meh. whats wrong???

  • Michael

    Great plug in, but how and where do I turn off the slide transitions?

  • hakerdesign

    hi just installed it

    im using it with nextgen gallery

    it works great when i set it to full screen
    but when i use proprotioanl

    i see only arrow
    heres a link
    http://pitaro.funet.co.il/testroyal/
    this is the code im using
    [nggallery id=”26″]
    what wrong
    thanks in advanced

  • artc1209

    Hi there!
    Really excited about finding this slider, and have a couple questions.
    It is installed on a WordPress site with the appropriate plugins and is pulling images from an NGGallery.

    The Title text is displaying properly, but the Desription text is fading into the background; it seems to be about the same gray tone. The text is there and can be selected though.

    So my question is where are the colors for the display being set? I looked for color settings in the skin file but didn’t see anything that seemed appropriate.

    Any thoughts?

    • Hey thanks for using it :)
      This can normally be adjusted with the right CSS rules for the theme you’re using. Would you mind sharing a link to a page where you’re using the slider to have a look?

  • Smo

    Hello,

    i use the “Wallbase” Theme for my photo site. This theme has an own slider. For this slider there appears a new menu point in the backend, where i have to link the images that should be used for the slider. Looks similar to the editor for new sites. Is it possible, to use wunderslider whith such kind of theme specific slider?

    Sorry, if my questions seems to be stupid, i am very new to wordpress.

    Regards, and Thank You all
    Smo

    • Hi,
      That’s a perfectly valid question :) You can use WunderSlider with any theme, depending on the theme you might need to adjust some CSS rules if they interfere, other than that it usually works quite nicely OOTB. What I’m not sure about is how you intend to combine the theme’s slider and WunderSlider. Do you mean you want to use WunderSlider to display the images that you upload through the theme’s slider? If that’s the case, then it will probably easier to just upload the images to the post and use WunderSlider to display the post’s gallery.
      Cheers

  • hi
    i have purchased he plugin
    i have a prblem on ipad
    fro some reason
    i cant drag the picture
    it wont response to touch
    on i phone it ok

    *you need to go to the link from ipad to see the slider

    any clues why

    thanks in advanced
    eitan

  • hi
    anothe thing how can i stop autplay
    right now ive set period to
    500000

    but is there a smarter way of doing it

    thanks

  • Hi Kento,

    great work! I tried to use wunderslider to show panorama, portrait and landscape photos, but the images are cropped to the dimensions of the container. Is there a chance that you create a “resize” option for a proportional container?

    Thx!

  • AM

    Great slider Kento!

    2 questions:

    1. How can we add the image number to the bottom right?
    2. Can we stop the automatic sliding of images? Setting the duration to “0” doesn’t seem to work as it defaults to “1”.

    Thanks,

    AM

    • Many thanks :)

      #1 You could place the caption there and use the description to show the number.
      #2 Using the period parameter with a large number would have the effect.

  • DStckl

    Hello,

    Thank you for this wonderful Slider. It is one of the best designed slider I have ever seen.

    I tried to use the Wunderslider in normal text widget. I used the code like this:


    [wunderslider]

    [/wunderslider]

    and adapted this to get the right pictures and size.
    No pictures were shown, only the following text:


    [wunderslider]
    [/wunderslider]

    Per Twitter I got the information that I have to load the .js-filde. Where I have to load the .js-file?

    Thanks, Daniela

    • DStckl

      Hm, the code there is not the whole code I have posted. So I now posted it in pastebin: http://pastebin.de/33056

      thanks in advanced,
      Daniela

      • Thanks Daniela, do you have a link to the page where this is used?

        • DStckl

          Hi, Kento

          it is used in a widget, see http://www.huevie.at, left sidebar, widget with title “Unsere Botschafter”. I use an enhanced text widget, which should handle shortcodes.

          Which php-file I have to manipulate, to load the .js file?

          Thanks, Daniela

          • DStckl

            I use WordPress 3.5 and the wunderslider plugin personal. I tried the slider on a page and on a article. There it worked.

          • Hi Daniela,

            Thanks for the link, it seems that the widget you are using doesn’t interpret the short code. Have you tried the Custom Post Widget plugin? See Useful Plugins for a link; I think it should be working fine without having to load the .js file explicitly. At least if you place the short code in a content block and add that content block to a sidebar, it should recognize and interpret the shortcode. Please let me know when you’ve tried it out, and if you can place it on the page there to have a look in case you still have problems with it, I’ll be happy to have a look again.

  • DStckl

    Hi Kento,

    it works now. I’m very happy!

    Thank you very much for this brilliant tip with the Custom Post Widget!
    Daniela

    • DStckl

      Hi, Kento

      it works, if I put the same code of the content block to an article and save the arcticle. If I delete the arcticle, the wunderslide
      will not be shown in the custom post widget.

      Why?

      thanks, Daniela

      • DStckl

        … but when I set the article to private, the wunderslide will also not be shown. Now I put the same code to a page, which isn’t shown in the menu bar. So the slide is now shown in the sidebar.

        • DStckl

          I tested now various situations. The wonderslide is shown, if the same code is embedded in a PUBLIC article. If the article is private, the wunderslide is only shown, if am logged in.

    • Cool, great to hear that :)

  • Cindy

    Hi there, It’s working great except on iPhone (iPhone 4, running iOS 6): Right before the slide starts to transition to the next, the next slide flashes at full opacity for a quick second, and then the fade happens as normal. Based off my testing below, I suspect it is related to 320 Press’ Wp-Bootstrap theme. Have you had any similar reports and/or can you think of anything off the top of your head that I could try?

    I have tried:

    – deactivating all plugins except NextGen, Wunderslider Gallery, and Wunderslider.
    – tried removing all links to any other javascripts or css.
    – I am using HTML in the title and captions, so I tried removing all of those.
    – Switched to an untouched new install of WP Bootstrap theme (which my theme is loosely based off of)
    – Tried switching to Twenty Twelve theme, and it works fine!!!

    I have the settings set to:

    Default Skin
    No Overlay
    Overlay opacity 0.2
    Fullscreen
    Show caption
    Show slide selector buttons
    Enable Flicking
    Fade in
    8 Horizontal blocks
    Auto vertical blocks
    Period 4000
    Duration 1000
    FPS 16
    Animate 500

    Thank you, very nice plugin :)

    • Thanks Cindy, did you check if there are CSS rule being overridden? If it happens with that theme on iOS, that’s where I would look for.

  • Wolfram

    Hi,

    I purchsed the commercial version of wunderslider. How can I download an updated version of it?

    Regards
    Wolfram

  • AM

    Hi Kento,

    I would like to remove the ability to cycle through all images in the slider. Examples of this behaviour occurs when a user is clicking the PREVIOUS button when they are on the first image of the slider or when the NEXT button is clicked while you are on the last image. I would like to disable the ability to go back and forth in those situations where the gallery has hit its limit.

    Thanks!

    AM

  • Kathy

    Hi Kento,

    I purchased the commercial version and I’m using both WordPress plugins – Wunderslider and Wunderslider Gallery.

    Trying to set up a fullscreen slideshow on the home page of the site. Works great in Twenty12 theme when inserting the gallery shortcode in the content area and with other plugins active.

    But in my custom Genesis child theme I only get the shadow that’s at the bottom of the default Wunderslider theme. No images show up. I’m using do_shortcode(‘[gallery]‘); in my page template.

    Do you have any suggestions where I should look for the issue? The wunderslider js is getting loaded on the page and the script with all of the images is there as well.

    Thank you!

    Kathy

    • Hi Kathy, can you post a link to a page where this happens please?

      • kathycac

        Hi Kento,

        My theme was referencing the latest version of jquery (1.9.1) from Google instead of using version 1.8.3. The slideshow wouldn’t work with that version. Works beautifully now.

        Thanks,

        Kathy

  • kathycac

    Hi Kento,

    Is there a way to allow the full screen slideshow to be absolutely positioned rather than fixed so instead of page content scrolling up over the slideshow, the slideshow scrolls up to allow the content to scroll up from below?

    Thanks,

    Kathy

  • kathycac

    hi Kento,

    RE: my last comment. I am keeping the slideshow fixed in the background but want to always start my page content at the bottom of the screen. Before installing the slideshow I was able to calculate the marginTop of my content div as the window resizes using javascript. That calculation no longer works now that the slideshow is in place. Any idea why that might be?

    Thanks!
    Kathy

  • Kathy

    Hi Kento,
    How do you provide a linkURL using the Wunderslider Gallery for WordPress? What are the parameters for the linkURL? Nothing about it in the documentation.
    Thanks!
    Kathy
    P.S. – resolved all my other issues

    • Hi Kathy, I was just thinking about what to suggest but noticed this last comment before getting too far with that ;) Out of curiosity, how did you solve it?
      Regarding the linkURL parameter, the WunderSlider Gallery plugin doesn’t support it, but let me have a look …

      • kathycac

        Hi Kento,
        I changed my script to fire on the document ready and on the window resize. I was just doing it on window resize before. Not sure why it even worked before! The code is below. The #wrap div it the div that I want to begin below the slider. I’m looking in to how to add an arrow to indicate there is more content below, and that scrolls the content up when clicked. :)

        //change margin top of #wrap
        $(document).ready(function() {
        $(‘#wrap’).css({‘margin-top':$(window).height()+’px’});
        $(window).resize(function() {
        $(‘#wrap’).css({‘margin-top':$(window).height()+’px’});
        });
        });

    • … had a look and it seems it will stay that way. WordPress doesn’t seem to store the link URL, you can choose for example a custom URL when you insert an image into a post, but that’s just used to generate the markup that is passed to the editor. It’s not stored anywhere and thus we can’t retrieve it to pass it as the linkUrl parameter of an image to WunderSlider. And to my surprise, NextGEN doesn’t seem to allow to indicate a link URL for an image either (at least not OOTB and what I’ve seen from browsing around looked too hacky).

      Conclusion: It won’t be supported unless there is a sane way to have link URLs related to images.

      • kathycac

        Thank you for looking into it Kento. Yes, I noticed the image link weirdness in WordPress. I may just use the Wunderslider plugin and not the Wunderslider Gallery plugin and generate the shortcode in my page template, and pull the link from the description field for the image or something similar. That should work, right?

  • Kathy

    Hi Kento,

    I added a field to image attachments and then modified the code at line 382 in class-wunderslider-gallery.php to use that if it is not empty>

    Here’s the code in case you want to do something like that…

    Changed this:

    $description = $attachment->post_content;
    $xml .= sprintf( ”, esc_attr( $url ), esc_attr( $title ), esc_attr( $description ) );

    to this:

    $description = $attachment->post_content;
    $sourceurl = $attachment->source_url;
    $xml .= sprintf( ” );

    Here’s the code I added to my functions.php file:

    add_filter(“attachment_fields_to_edit”, “add_image_source_url”, 10, 2);
    function add_image_source_url($form_fields, $post) {
    $form_fields[“source_url”] = array(
    “label” => __(“Link Image to this URL”),
    “input” => “text”,
    “value” => get_post_meta($post->ID, “source_url”, true),
    “helps” => __(“Add a valid URL that the image should link to.”),
    );
    return $form_fields;
    }

    add_filter(“attachment_fields_to_save”, “save_image_source_url”, 10 , 2);
    function save_image_source_url($post, $attachment) {
    if (isset($attachment[‘source_url’]))
    update_post_meta($post[‘ID’], ‘source_url’, esc_url($attachment[‘source_url’]));
    return $post;
    }

    • Thanks for sharing that Kathy, this looks good (some of the code you posted got stripped off by the comment filter, but I get the idea).

  • Doug

    What is the most likely reason that the xml shortcode is not working?
    e.g. I’ve tried my xml and your example xml here… http://wunderslider.com/wordpress/ All I get on the page is… [wunderslider] [/wunderslider] My site is on an internal network unfortunately.

    No js errors, no php errors, no missing downloads from firebug Net panel. I also tried do_shortcode(”) and that didn’t work either.

    This does work great.. [wunderslider_nggallery id=”3″ mode=”proportional” display=”proportional” clickable=”true” container_width=”95%” container_height=”430px” ]

    I assume the only way to create an external link on the image is to use the xml shortcode, correct? It would be nice if the nextgen gallery had that attribute for images.

    Thanks a bunch – I love the responsive aspect, caption adjustments, links and skins!

  • Paul A

    Have noticed a bug/design omission:
    if the image description has a special character such as single quote, your display of the description shows the escape character prefixing it – just a bit messy!

    so David’d hat would read David/’s hat

    • Thanks for reporting that Paul, it happens when using it with NextGen, when using the normal WordPress gallery it’s ok though. Of course that needs to be fixed, I’ll release an update as soon as possible.

  • Paul A

    I just noticed that the first image in the series stays displayed for almost twice the duration of all the remaining images. I have the following settings:
    Transitions
    Effect: Fade In
    Horizontal blocks: 8
    Vertical blocks: Auto
    Period: 6000
    Duration: 2000
    FPS: 16
    Animate: 500

    I notice the first slide stay for about 9 seconds, and all the remaining ones, about 5 seconds. Even if I wait until a few have displayed and click back to the first image in the blobs (sorry I don’t know what they are called!), the first image stays displayed again for about 9 seconds.

  • bvd

    hi, love this, but as soon as I try and use it with Rails 3.2.12 I get a Javascript error:

    ‘Uncaught TypeError: Cannot read property ‘msie’ of undefined — wunderslider-min.js:23′
    which seems to be a problem with the wunderslider js.
    Could it be that Jquery 1.9.1 is not supported? (comes with Rails)

    many thanks for any insights, I could find anything by Googling the error.

  • bvd

    further to my previous post, have reproduced the error on the demo by replacing jQuery 1.7.2 with 1.9.1
    Is there a fix as I can’t downgrade my jQuery as other bits of my app depend on it.

  • Nick

    Just spotted a small typo error on the gallery setup page under the “Appearance” section: the “height=” is missing “container_”. Caused a few moments of puzzlement when trying to get it to work.

    ———————-
    Proportional display mode

    If you choose proportional you must provide the container width and height explicitly along with the [gallery] shortcode.

    Example: [gallery container_width="80%" height="360px"] .

    ———————–

    Anyway, fantastic plugin, thanks!
    Nick

  • cohnweb

    Hi Kento,
    I ran into the same issue with the z-index and the slide selector buttons as LGJ above, and your suggestion solved the problem. However, I have a js sticky footer on my site, and the background image of the footer div disappears when I do this. (I can still see the contents of the footer div, just not the css bg image). I have set the footer’s z-index to higher than anything else, even tried placing it inline and !important.

    SO, my question for you is, is there any way I can set Wunderslider css to make the full background image to stop 45px above the bottom of the window? I have it set to Fullscreen, and am using it in conjunction with NextGen Gallery if that makes any difference. (I am using JPGs; if I was using PNGs for some reason, I thought about making the bottom 45px transparent, but that won’t work in this case).

    Is there any other info I can provide you with?

    Thank you!
    -Cindy

  • Kathy Sautter

    Hi Kento,

    The full screen background slideshow is working great. There has only been one comment from a user on a Samsung phone that the images are squashed rather than fitted to the space. I have been unable to get additional info about what phone version, operating system, browser, etc. I have tried the site in a half-dozen emulators and everything looks OK. Have you heard of any other cases where the images were squashed and what the circumstances were and possible fix?

    Thanks,
    Kathy

    • Hi Kathy, it can be due to a conflicting CSS rule that is used only when targeting a specific platform, but we’d really need to know which OS it is, what browser, which theme is being used etc.

  • webguy262

    The fadein transition is not smooth. The current slide does not fade out, but instead stays at full opacity until the next slide reached full opacity. At that point, the current slide abruptly disappears.

    Sit’s not live so here’s a screencast…

    http://brinsterinc.com/wunderslider.mov

    The current image should fade out as the next one fades in, correct?

    • The problem here is that the images you are using have a transparent background. When fading in, the previous image is maintained at full opacity while the next images is faded in, increasing its opacity until it is fully opaque; at that point, the previous image is removed.

      What you’re looking for is a simultaneous fade-in & fade-out effect, which isn’t available although I think it would be a great additions so that in cases like yours, the desired transition can be achieved even with images that have a transparent background.

      Until this is added, I would suggest to add a background to the images, in this case it can be tricky though because of the gradient page background.

  • Ann Marie

    I am having this same problem: http://www.itthinx.com/topic/wunderslider-resize-problems-in-ie9/ The site is in a test environment now. Can I email you the login info so you can take a look? Looks fantastic in Chrome and even IE8 but in IE9 and 10 only partial images are showing.

    • Hi there, a link would be preferred – can you post a link to the test site or a test page?

      • Ann Marie

        Did you get my link info? We are waiting to hear if there is a fix for this or I need to find something else before launching the site. Thanks

        • Yep got it, but haven’t had a chance to look. Let me have a quick look right now …

        • You have a very hungry rule forcing max-width to 100% for any img tag in your .../themes/putterhere/style.css which seems to throw the thing off:

          img {
          height: auto;
          max-width: 100%;
          }

          When I disable that rule with Firebug, the images appear fine – if you’re trying it with Firebug, resize the browser window to make it adapt to see it’s working, it’s quite cool to see how this behaves well with the responsiveness of the theme.

          • Ann Marie

            Geez. That was it? I could have figured that out. Thanks for looking. Glad it was that simple and perhaps this will help someone else. Thanks again. This is the prefect Gallery for our needs…love that I can have several responsive galleries on the site with Wunderslider.

  • Hi,
    Am using the following wunderslider shortcode in header.php:

    echo do_shortcode(‘[wunderslider_nggallery id=”1″ display=”proportional” mode=”proportional” clickable=”false” useFlick=”true” effect=”fadeIn” container_style=”width:100%; height: 700px; margin_left:auto;margin_right:auto;left:0;right:0;”] ‘);

    All appears good apart from the nav arrows that are forced to the right of the image gallery. Please can you advise on how to fix this problem/best approach?

  • Heather

    Hi,

    I’m wondering if it’s possible to use the full-screen mode, but not in the background. I want to have a series of images on a page that can be clicked and each launch a different slideshow. Kinda like the bottom of this page:
    http://www.imaginitmusic.com/listen/roam.html

    Thanks in advance

    • Hi Heather,

      Would it be on a WordPress site or without any platform? On a WordPress site you can use an ‘empty’ template for the pages to get the effect. Or do you have a link you can share to what you have right now?

  • Jared

    Hi Kento,

    Are there any known issues with the custom settings using a WordPress multisite? I’m having some trouble getting the WunderSlider to show up using a do_shortcode function on my home template. It loads the default settings player fine, with the correct NexGen gallery id images, but when I check “Enable these settings by default?” neither the gallery or the player load into the page. I enabled it from the network page as well as the specific multisite and also tested it on a new page w/o do_shortcode, with the same results.

  • Jared

    I sorted it out. I overlooked the fact I made some changes which needed dimensions in the short code. Thanks just the same!

  • shodgej

    The slider is working well but I have a problem resizing the browser window. If the browser windows is reduced to a height smaller than the image I want it to clip the bottom rather than “push the image off the top”. I do not want to loose the top of the image. Can wunderSlider be configured to work this way? The above can be achieved following the solution on this link http://www.emanueleferonato.com/2010/11/13/full-screen-centered-background-image-with-css-and-jquery/ for a single image. Thanks Steve

    • Hi Steve,

      Currently it won’t let you do that, it adjusts things to show it centered. But it might be a good idea to offer it as an option, will take it into account.

      Cheers

  • Jared

    Ah one thing I noticed Steve; correct me if I’m wrong but this does not have any kind of no js fallback? Is there a way I can at least display the first image in the specified NextGEN Gallery if js is turned off?

    • Have you tried placing a non-Javascript version of the gallery within noscript tags?

      • I’ll give that a shot. I was considering having a responsive CSS slider as a fallback, but I’m thinking it would need to output the gallery images in a list, and then collect the title and description as a link…which sounds like it would probably be more work than its worth for the time being.

  • Ponch

    Really big fan of this! Looks really nice, thank you! I’ve noticed that there is a noticeable delay in the time it takes the first slide to turn to the second when compared to all the rest… Is there a way to shorten it at all?

    • Many thanks Ponch :)
      I think this needs to be fixed still because it applies twice the time to the first one.

      • Ponch

        Hey man. I’m trying to add the wunderslider to a content slider. However, I can’t get the wunderslider to slide out, it just remains as the background. Any ideas on how I can fix that?

        Sorry to be vague, I’m just not entirely sure what’s causing the issue.

        Thanks

  • gourav

    what can i do for autoplay off in wunderslider

  • Love this slider, but just found that it doesn’t display properly on small Android browser (Samsung Galaxy S3). Bad example is http://sippify.com/wunderslider-bad.png and good of Chrome desktop: http://sippify.com/wunderslider-good.png. Is this a bug or a configuration problem? Any thoughts/ideas are appreciated.

    • Hi Ted, many thanks for the feedback! It looks like the resize event isn’t captured, can you please provide info on the current versions you are using? Also a link to the live site would be more useful, I’ve seen something similar happen where the issue was actually caused by conflicting CSS rules (with IE though, but if you look in the comments on the page here, you’ll find it, I think there’s a topic on that as well in the forums).

  • Hi Kento, love to help, but our site is still under development and I would prefer not to publish it in this forum. If you can send me your email address I can send you the link if you can keep it confidential.

    I’m using Samsung with Chrome app on Android 4.1.1. I found that it works correctly in landscape, but not in portrait mode. The slider also fails if you resize the Mac desktop Chrome Browser (Version 29.0.1547.57) into a portrait orientation. I found that it starts to fails below width of 580px. So you should be able to recreate the problem easily yourself by simply reducing the size of the browser window into a portrait mode. If you reduce into a small landscape mode, it still works fine. This seems to imply that this a general problem with the code, not specific to a mobile browser (in my case). I have not tested on IE yet. Hope this helps.

    -Ted

  • marc

    Hi Kento,

    Great plugin. I’m currently using it on a WordPress project and as soon as the project is ready to go live, I’ll be purchasing the required commercial license.

    I do in the meantime have a question for you: Is it possible to have the transitions triggered from the Slide Selector Buttons? Currently they just switch the slide without using the chosen transition.

    Thanks
    Marc

    • Hi Marc,

      Thanks :) You’re welcome to post a link to the site here when it’s live. It’s always good to see it in action!

      Regarding your question, that would require the buttonEffects parameter set to true.

      Cheers

  • Janek

    you write example code with nextgen gallery id=1
    please help me

  • Hi guys! Congratulations for the gallery, it’s really awesome! But…I have a small and very compelling issue, I’d like to see the pictures in the homepage fully resizing when the page shrinks but when I resize the page of the browser or open the website on a small screen I see the images cut, and it’s a real big trouble to me because I have some writing over the images, that disappear on resize :(. Thank you in advance :)

  • Hi guys, I have a trouble using your gallery and I hope you can help me with this issue. When I reduce the browser dimensions, or watch the website from a small screen, I see the images cut, and it’s terrible to me because I have some writing over the images that cannot be read while resized. How can I do? Please help me…

    Thanks,

    Daniele

    • There are currently two supported display modes, fixed where images are used at their original size and proportional where images are resized and cropped to fit the container. I guess what you’re looking for is a scaled mode option but that’s not supported as it is now.

  • Hi Kento,
    Thanks for the great plugin – the proportional resizing is great. I’m playing with the plugin to see if it will work for my client’s site. A couple of things, I can’t seem to get the descriptions, captions, or alt tags to show up, even though I entered them both in the Media section and in the NextGen Gallery. Are alt tags supported?

    Other question – any way to turn off autoplay?

    http://www.brooklynupdates.com/play/?page_id=54

    Thanks again.
    Rachel

    • Hi Rachel,

      Thanks for the feedback and for giving the plugin a try. I’ve just seen the page, looks awesome!

      The caption on that page appears below the image with that skin and is currently hidden because the .post-content uses overflow: hidden – one solution is to add some padding and make the overflow visible:

      .post-content { overflow: visible; padding-bottom: 5em; }

      Another would be to change the location of the caption so it’s within the image, for example:

      .wunderslider .pane .caption { top: 1em; }

      Cheers

  • Hi Kento,

    very well performing slider!
    I’m using it with the wordpress wunderslider-gallery plugin.
    There’s just one problem: as mentioned before there seems to be a bug with the first slice being loaded twice.
    I set a delay for the captions and now at page load the caption appears, then disappears and then appears again, while the background image of the slider stays the same.
    With an animated gif as the background image, you can see a short interruption, so the image is actually loaded twice.
    Could you please fix this or give me a hint where I have to look in the code?

    Thank you very much,
    Timo

    • Hi Timo,

      Many thanks for the feedback!

      Can you please post a link to the page so I can have a look?

      Cheers

      • Timo

        This is the page we’re actually working on:
        http://medienlab-renova.phil.hhu.de/
        The wunderslider is used on the frontpage.

        • Thanks for the link, I’ve had a look at the resources being loaded with Firebug. The first image doesn’t get loaded twice, but I think that things look a bit out of sync because the images are rather huge and take time to load, combined with the delay used to display the caption.

          • Timo

            Hmm, but the same thing happens with the slider on wunderslider.com. It is set to a period of 4000ms, but the first image is being displayed for about 8s.
            No big deal when there’s no delay set for the captions, but I like delayed captions ;)

  • Need to know if my site is compatible with WunderSlider? The site runs off of websplanet.com

    Thanks in advance.

  • Rachel

    Thanks Kento! I will try that. What do you think about the alt tags on the WordPress plugin? I can’t get them to show up. Also, is there a way to turn off autoplay? Thanks again.

    • Regarding autoplay, you can use the duration parameter and set it to a very large value.

      For the alt tags, as these aren’t generated, I’m taking note to include that at least as an option or even to have these generated by default.

    • PS we’re referring to the alt image attribute I would assume, not alt ‘tags’.

  • Sheng

    I am new for the wunderslider. May i know can the caption also have animation?

  • Since adding the Commercial Licensed Slider to my website I’ve been bombarded with ads throughout my entire site. Please help!

    Thanks in advance.

  • Marc

    Hi Kento,
    Any idea when the bug with the first slides timing will be fixed?

  • I am using wordpress.org.
    I downloaded the Wunderslider file from this site onto my computer and unzipped the file.
    Within the ‘Build’ file from the Wunderslider Personal folder, I found files for the Wunderslidder Gallery Plug in and the Wunderslidder-Personal Plug in. I unzipped these files.
    Via FTP I transfered them to the WordPress-Content-Plug in directory. Since there seems to be quite of few files and folders with similar names, I am unsure of the correct ones to use.
    Nothing is appearing within my WordPress plug in installed list.

  • Hi,

    First of all, thanks for developing this plugin, it seems quite cool! And… I have some questions :P

    1. I was wondering if there is a way to hook a jquery function after some events… for example, I need to change the class of my header and footer after or before a transition starts or finishes.

    2. Also would like to know if there is a way to append a specific class to div.caption in order to have a different style for each slide.

    3. Is there a way to control the transition of the captions too? E.g. fade the caption in. It seems to just flick as soon as the new slide transition is starting and, in my case, it would be good to fade-in with the slide.

    These are some requests from my client and, if these can be done, I’ll be pleased to buy the license and probably will use this jquery plugin in future projects too.

    Btw, I’m not using the wordpress plugin, although I’m using wordpress for the job. I just needed more control over the behaviour of the slides.

    I hope you can help me with those questions… and thank you in advance!

    • Hi Gledsley,

      Sorry for the ultra-late response, I had this tagged to take a good look at your suggestions :)

      #1 Currently not, but it’s a great idea. This would allow to keep things in sync with the slides. Note taken to be added!

      #2 Yes that can be done, it doesn’t really depend on the WunderSlider itself as you can identify that div with a jQuery selector and add any additional classes you would like to have on the element.

      #3 The captions are rather dull in that sense, I think it would be good to offer some kind of transition effect on those, too.

      Thanks for the suggestions!

  • Paul

    I have gallery turned off by default as I am only using one wunderslider throughout the site. I find I have to insert attributes into the gallery shortcode as the settings page has no effect. That is fine and working well, however I’d like to learn all of the possible attribute names. ie, I used wunderslider=”true” display=”proportional” mode=”proportional” and they work well but I also want to disable the slide selector buttons and captions. Where is the list of all attribute names? BTW nice program!

  • Sarah Huang

    hi,

    I have your plugin in http://www.livingattheborder.com/makeshift-communities, in the gallery, I have some vertical pictures. I am wondering, how i can show the whole picture, becase right now it’s cropping the image which I don’t want that…

    Thanks in advance!
    Sarah

    • Hi Sarah,

      One solution to that is to use pictures with similar dimensions, this has the advantage of letting you choose which part of the picture you actually want to show.

  • Thorsten

    Hi Kento,

    Thanks for this nice plugin. It works great on one of my sites except for the fact that I always get the following message above the slider gallery:
    Warning: file_exists(): File name is longer than the maximum allowed path length on this platform (4096):

    Since the website is password protected, I can’t really provide you with a link. But it’s based on the current wordpress version as well as on the genesis framework. Thus I use some genesis plugins as well as nextgen gallery, google fonts, wp minify fix and your plugin. A link to an example image looks like this (x are counted):
    http://xxxxxx.xxxxxxxxxxx.com/wp-content/gallery/xxxxxx-xxx-xxxx-xxxxxx-x/xxxxxx_xx_xxxxxxxxxxxxxxx.jpg

    It would be great, if you could help me with this.

    Best

    • Hi Thorsten,

      Please enable debugging in WordPress and check the wp-content/debug.log after visiting the page where that happens. At least it can give a clue to what’s causing it, I haven’t seen that before and I don’t think it’s related to the plugin itself.

      Cheers

Leave a comment

Your email address will not be published. Required fields are marked *

*

Please follow the Support guidelines.

Premium Support is available for customers in the Forums.