2011
06.30
UPDATE: WP Supersized is now at version 3.0.1. It now allows the use of images from NextGEN Gallery, the WordPress Media Gallery, your own choice of directory within the wp-content folder, or a list of slides defined in an xml file (for advanded users). See the changelog.
PayPal — The safer, easier way to pay online.

After my previous tutorials about the integration of Supersized 3.1 and 3.1.x in WordPress, I had started to write an updated version of those tutorials. Until I realised that I should really use my understanding of this integration of Supersized in WordPress in a better way.
Why not write a plugin that would seamlessly integrate Supersized in WordPress, without the user having to modify his templates ?
I quickly read a book about WordPress plugins and I analyzed several plugins that I was using on my WordPress install. Armed with this information and my fresh and limited PHP knowledge, I decided to take up the challenge and write a WordPress plugin.
After several evenings of hard work, here is the result: WP Supersized.

Download WP Supersized here

WP Supersized gives you the ability to easily integrate the Supersized jquery extension in the pages/posts you want.

I am not the developer of the Supersized jquery extension itself. It was written by Sam Dunn. My plugin only integrates it into your theme and gives you easy access to many options for displaying this full screen resizeable slideshow background where you want on your website or blog.

I have now moved all the FAQ and other details to the WordPress plugins repository. Much easier to maintain. So, please go to the FAQ for more details.

Do not hesitate to comment this post if you need help or if you want to say how good my plugin is ;-)

Related Posts

378 comments so far

Add Your Comment
  1. Hi Ben, great plugin to make available, however I am only new to wordpress and I am having a bit of difficulty in using it. I am trying to use slideshow on my home page of my website http://www.irishweddingvideos.com/. I would like to position the slideshow under where the Post says ‘Hello World’. To do this I created a custom field called
    SupersizedDir and gave it a value called wp-galley. However should the value be called wp-galley or should it be the location of the slideshow ? Next i keyed in in the form but no slideshow appeared ?
    In my settings I have also set the slideshow to be used on the front page, is this wrong if I want the slideshow to be positioned under Hello World ?
    Lastly does the slideshow work off the orginal size of the photos ? or does it have the capability to change size of photos ?

    Any responses much appreciated

    • Lorcan,
      As far as I can see, the plugin is working on your homepage, using the value wp-gallery for the SupersizedDir custom field I suppose. I see part of your background image coming from the gallery (under-construction.jpg) (if you don’t see it, make you window larger). So I guess that you did things the right way :-)
      The problem is that your page already has a background that is covering part of the Supersized image. You should remove the background of this page (in your theme) to make your Supersized background visible. If you do not know how to do this, I could give you additional instructions. Please contact me through my contact form and I will explain in more details what you should do.

      The definitions of home and front pages according to WP are available here. In short, the home page is where you blog is displayed while the front page is the page that users see when they arrive on the main page of your website.

      The plugin uses the original size of the images.

  2. Hi there,

    I’m loving this plugin but seem to be having a problem.

    It works fine out of the box. As can be seen here (http://www.woolfinterior.com/)

    I am, however trying to make a 2nd animation on a 2nd page which uses the SupersizedDir custom field. When using SupersizedDir to specify a folder it works no problem (UNLESS debugging is enabled.) When using it to point at an xml file it returns to the (wp plugin) default. i.e the same animation as the homepage. Example here (http://www.woolfinterior.com/interiors/test-page/)

    Using WP 3.3.1 and Supersized 2.0.

    Cheers,

    T

    • Tom,
      I would like to help you but the links you are giving are not working. I only see the login screen of your WP.

      • hi, Ben, i have same problem

        i set SupersizedDir in Custom Field page to specify url folder for particular image show in page, and set custom field to set option with dedicated xml in the same page, but option xml don’t works.
        i set all custom field using same custom field name ( SupersizedDir)…it’s correct?
        if not how i can set it?
        i need to specificy another custom field name for xml using to custom folder in particular pag-id??

      • Samuele,
        To use an xml file to define your images and options, you must enter the location and name of your xml file in the custom field SupersizedDir. There is only one custom field to be used.
        If you use the xml file only for options and do not define images there, the images shown will be the ones from your default folder (usually supersized-slides).
        More details in the FAQ.

  3. Hi Ben,
    how can I enable the custom field on categories? I tried a lot of plugin but you tell me that supersized plugin in not enable for custom fields on category…
    thanks!

    • Stefano,
      I will try to include some modifications for this to work in my next update.
      In the meantime, you could try the following:
      In the WPSupersized.php file, replace the condition on line 99:
      if ($custom_field_exists && (is_single() || is_page()))
      by:
      if ($custom_field_exists)
      and also on line 671:
      if ($custom_dir && is_dir($full_custom_dir) && (is_single() || is_page()))
      by:
      if ($custom_dir && is_dir($full_custom_dir))

      No garantee that it will work but it should be OK.

      • Hi Ben, I try this but trick but it doesn’t work

  4. Hi,
    I am developing some new theme now, and i got some strange error. I created the folder in wp-content and uploaded 2 pics to it. after that i set up the plug-in as i wanted. But i don’t see pictures.

    the plugin stays loading and loading. the error:

    /* custom_dir = full_custom_dir = wp-content/ full_default_dir = wp-content/supersize-slides content_url = http://example.info/NIEUW/wp-content */ /* custom_dir = full_custom_dir = wp-content/ full_default_dir = wp-content/supersize-slides content_url = http://example.info/NIEUW/wp-content */ /* custom_dir = full_custom_dir = wp-content/ full_default_dir = wp-content/supersize-slides content_url = http://example.info/NIEUW/wp-content */

    • Xander,
      I see that you called your default folder supersize-slides. Unless you changed the default folder name in the options, this is not right. It should be supersized-slides (with a d).

  5. Dear Ben,

    thanks so much for this fantastic plugin!

    I just found a problem with slides not loading on systems where the glob()-function does not accept GLOB_BRACE.
    The result is an empty picture array and an ever rotating loader.

    in the wpsupersized.php I exchanged line 522 with:
    $dirArray = array_merge(glob($dir.”*.jpg”),glob($dir.”*.JPG”),glob($dir.”*.png”),glob($dir.”*.PNG”),glob($dir.”*.gif”),glob($dir.”*.GIF”),glob($dir.”*.jpeg”),glob($dir.”*.JPEG”));

    now it works like a charm – also on this server.
    Thanks again!
    cheers,
    jan

    • Jan,
      It seems that this has been happening to several other users.
      According to the php manual, The GLOB_BRACE flag is not available on some non GNU systems, like Solaris.. This might be the reason for this problem occurring on some servers.
      Anyway, thanks for the solution. I hope that it will help other users with a similar issue.
      And I will probably integrate it in my next update of the plugin.

    • Jan,

      Your code was cut off here in this post. I am having an issue with the loading page animation on every page (even those the default slides are transitioning). I’m wondering if it is related to the issue you posted. Would you please email me your code? You can reach me at mark (at) tretechnologies (dot com)

      Thanks!

      Mark

      • Mark,
        The modified code from Jan is here again:

        in the wpsupersized.php I exchanged line 522 with:
        $dirArray = array_merge(glob($dir.”*.jpg”),glob($dir.”*.JPG”),glob($dir.”*.png”),glob($dir.”*.PNG”),glob($dir.”*.gif”),glob($dir.”*.GIF”),glob($dir.”*.jpeg”),glob($dir.”*.JPEG”));

        I will include this modification in my next update of the plugin.

    • Well I tried the code and that didn’t fix the loading circle animation that is on every page. I’m at a loss as to how to get rid of this and it is utterly vexing!

  6. Hi Ben, I think this is exactly what I’m looking for to recreate my homepage as seen here http://www.globalanimalwelfare.org onto our WP installation. Our existing site structure needs streamlining so we’re moving as much to the WP platform as possible. I’d appreciate some awesome input on how to do this. My coding knowledge doesn’t include PHP so any help would be appreciated.

    • Brad,
      It should be pretty simple. You do not need to know any php to use my plugin.
      Simply install the WP Supersized plugin, choose/upload your images as explained in the readme, select where and how you want them displayed in the options of the plugin. That’s all!
      Or maybe not… depending on your theme: some of them need to have their background definitions modified to make them (semi)transparent, otherwise the background images will not be visible. If you know a bit of css, this should be very easy.
      When I will prepare the next update of the plugin, I might add some more detailed info about how to do this in the readme.

      • Hi, I got this far, but now I’m stuck:

        http://sol.globalanimalwelfare.org/front/

        1) Is there an ideal photo size to keep proportions here? Can’t seem to find an optimal size and it isn’t liking the same size background files from our site.

        2) I also can’t figure out what the white vertical space on the left side of the background is caused by.

        Thoughts?

        By the way, great job on this plugin, it’s the best one I’ve found yet that gets me closer to our goals; so keep up the great work.

        Cheers!

      • Brad,
        1) Just to summarize for all users what I told you in my email, if you use horizontal images, it is best to set the option ‘Fit portrait’ to ‘on’. Supersized will then make them fit the full height of the page, with some parts missing left and right maybe. Also usually best to keep the options ‘Center background vertically’ and ‘Center background horizontally’ on.
        2) Sorry, I could not see any white vertical space when I looked at your page.

  7. How would I use an XML file to power the slideshow? Would I be able to put in my own content divs to display on top of each slide doing this? Or would I have to do something similar to this? http://stackoverflow.com/questions/7772295/supersized-show-a-div-depending-on-the-slide

    Basically I want the background image with some text that is not part of the image and for it to all be clickable

    Thanks for an awesome plugin :)

    • Elle,
      Indeed, using the xml file, you can use html within the captions so that you could, for example, have links in there. Have a look at the example xml file. It contains details of its usage.
      I guess that you could use inline css in your html to choose where to display the caption (I still have not tried this).

    • Elle,
      I have now done some experimentation with the solution that I proposed and it works very well.
      You can use html in the captions, and, for example, insert a container div that you can style as you wish to define its position and look.
      For example, I wrapped my html into a div with class=”mywpsupersizedcaption” and then defined the style in the stylesheet of my template (could also be inline) as follows (this is just an example):
      .mywpsupersizedcaption {position: fixed; margin:0; height:150px; width:200px; top:50px; right:50px; background:#111; padding: 15px;}
      All the html that I have wrapped with this div then appears on the top right of the page.
      Of course, for this to work, you still need to keep the footer part of the plugin active otherwise the captions are not displayed. I might change this behaviour in the future (so that you could have the captions visible without the whole footer).

      • I’ve just found the example.xml file (oops) so where exactly would I put this caption?

        There are examples of slides and the parameters are slide-link, thumb-link, title and url… which bit pertains to the captions?

        I’d choose to add styles to my theme CSS anyway, not a fan of inline.

        And what do you mean footer of the plugin? I am just using the background image, no navigation, titles etc

        Thanks

      • Elle,
        “title” is what you are looking for (Supersized uses this to display the caption). Just put inside the CDATA whatever html you like.
        The inline css was only one the possible ways of doing it. I would also favor the normal stylesheet.

        What I mean by keeping the footer is to make sure that you set the option “Slideshow controls” on. Otherwise, the caption would not be shown and thus your html would not appear…
        I plan to change this behaviour to make it possible to show the caption (including any html contained in it) without the rest of the footer in an upcoming update of the plugin.

  8. Hi Ben, I’ve used your plugin for about two months and it has run faultlessly, I reall love it. However today I ran an Auto upgrade on the plugin, it installed without issues but now the slide show will not load. when I check my safari web inspector I see this error: TypeError: Result of expression ‘$.supersized’ [undefined] is not a function. I havent changed anyhing in the backend or to the plugin settings. Can you help?

    Thanks in advanced.

    • I have just performed a manual install, started from new with most recent version of wp-supersized and I get the same error.

      • From which version to which did you upgrade ?
        Did you install any other new plugins recently ?

      • After good Week of searching I figured out what was causing the issue. My friend installed a bespoke “post gallery” for me and turn off the WP_jquery, and is linking to google jquery (not really sure) via this command:

        if( !is_admin()){
        wp_deregister_script(‘jquery’); // disable wp’s default jquery on the front end. no gracias
        }

        He is out of town so I haven’t figured out how to work around it…

      • What a strange idea to deregister the default jquery. Many plugins use jquery and follow the WP rules to enqueue it, counting on it to be present as standard.
        Unless you have a very good reason to do that, I would avoid this.

  9. Hello Ben;
    Congratulations for this plugin;

    I have however a problem: I’ve followed exactly all the steps you described as to install the plugin, creat the slide folder in wp-contents, but nothing happens, it keeps going t othe default images! Tried changing the default folder image, nothing happens as well, it just works if I change the settings to the Flickr account, although it seems to be that it’s slower than having it from my own site..

    Here’s the adress: www,sparkle-animation.com

    Any ideas?

    Thanks,

    Pedro

    • Pedro,
      Could you please set the debugging option ‘on’ and send me the resulting output (use my contact form). It will help me find the reason for your problem.

      Flickr can be slower because the connection first needs to be established before downloading and finally showing the images. But, in my experience, this is not that slow (except maybe for the first image).

      • Hi Ben;

        I’ve contacted you earlier about the problem described above; still can’t find a solution; I’ve set it to the flickr slideshow and set the debbuging mode on, which I sent you the code already.
        The site is http://www.sparkle-animation.com
        Thanks,
        Pedro

      • It looks like you have selected Group as the Flickr source but you did not fill any group ID in the Flick group ID option.

      • Hi Ben,

        Thanks for that; I had the settings into the Flickr group because the normal folder in the website isn’t working and goes straight to the default images;
        I’ve updated the settings for the slideshow (default) just so you can have a look – I’ve copied all the images to a new folder I created in http://sparkle-animation.com/wp-content/supersized-slides but it goes straight to the default images..

      • Pedro,
        Have you checked that your folder supersized-slides (and all contained folders) has sufficient permissions so that it can be read by anyone. If the plugin cannot get access to the folder, it is unable to read the images.
        I will add some permissions checking in my next update to help users in finding the reason for the plugin not working on their system.

  10. Hi

    I have a problem on my site http://www.3kok.se/wordpress everthing works fine in browser but on iphone the images slideshow is really small and up in the left corner. Whats wrong?

    • Anders,
      This is a known issue of Supersized with iOS. Sam Dunn (who wrote the original jQuery plugin Supersized) said that it would be solved with iOS5 but it does not seem to be the case.
      The same issue seems to appear on Android.

    • I can’t speak for Sam Dunn, however, I know the reason for this problem. By default, iOS (including 5) has a hard “ceiling” on how large an image can be. If it’s larger, in order to save iPhone data bandwidth, the large photo is automatically cropped and served as a smaller version. Since the CSS is not setup to handle the smaller image size, it typically looks borked when displayed. I’ve run into this on multiple projects. The only way around it is to serve separate image sizes for iPhone or resize your images so they’re not quite so large. I’m not sure the exact size limitation, but I’m using some images that are 1,900px x 2,700px and they are actually ok. It’s when you get into the 3,000px + image sizes where the crop will almost always happen.

  11. the navigation wont show up in on my page, i have tried everything I could think of, including deleting and re-installing the plug-in. Anything you can suggest i try, maybe something in my header i need to fix?

    • Simon,
      For the navigation to show up, you need to set the option “Slideshow controls” on and your template must have a footer that contains wp_footer(). Otherwise, it will not work.

  12. Hi,

    I’m using the WP Supersized plugin but i’ve got an issue I can’t get resolved:
    Even if I use the default settings, the navigation buttons and bar aren’t visible.

    What am I doing wrong?

    • Rene,
      See my answer to Simon.

  13. After installing everything and getting it all setup, my slideshow doesn’t seem to work as a slideshow. Images reload on on refresh but the actual slideshow doesn’t seem to work. I have the settings set to slideshow. I am using a image folder and have the custom field and its pulling images.

    http://www.circadiadesign.com/clients/klepper/

    • Devon,
      I see in the source of the page that you there are 2 different versions of jquery that are loaded and probably interfere with each other. One in the default WP one (that all well-behaved plugins are using) and the other one seems to be loaded by Contact Form 7. The version of Contact Form 7 that you are using is probably outdated. The latest version uses the proper way to enqueue jquery. Please try upgrading to the latest version of Contact Form 7 and things should be fine.

  14. Hi Ben,

    I contacted you earlier about my problem: The pictures the plugin extracts from the NextGen gallery don’t display the title or description. It works whem I add the title etc. with an image program, but I find that not so great for my client. I just want them to type in the fields in the WP gallery. The problem can’t be NextGen because the same problem occurs whem I point the plugin to the WP media gallery.
    Is there any way you can help me fix this problem? I’d be happy to pay you off course. This is the url: http://martinevanderwal.nl/
    Thank you in advance.

    Cheers,
    Martine

    • Martine,
      I will try to have a closer look at it before the end of the week-end. I’ll get back to you asap with more info.

  15. Hi and thanks for a great plugin.

    I found a bug which I thought I would let you know about. I was able to come up with a quick hack myself, but would love to see a real fix.

    I’m using a Flickr set as the source and I noticed that the photoLink contained ‘undefined’ in stead of my Flickr username. I looked into it a bit and found out, that ‘flickr.photosets.getPhotos’ which is called in line 108 of ‘supersized.flickr….js’ does not return ‘owner’, which is needed for line 138.

    Thanks again

    • Jeppe,
      Thanks for letting me know. I will inform Sam Dunn (the writer of the original jquery plugin Supersized) about this. And I will try to implement a solution to this myself in the meantime. No garantee as I am not yet the best of jquery coders ;-)

  16. Hey Ben… great plugin!

    Getting an extra comma after the dynamically generated slide list – see screenshot: http://drm.st/EK9R. Just thought I would let you know since this typically causes IE7 / IE8 to choke. I am seeing mixed results on my end depending on which IE build I view the site on.

    Just a head’s up. Also, is the project on jQuery?

    • Brian,
      I am well aware of this small issue. It is only occurring when using the WP gallery images (forgotten to remove the final comma in my code). And the new update I am preparing will solve this (on top of adding support for NextGen Gallery). In the meantime, you can replace line 717 by the following (thanks to Simon for spotting and solving this):

      $full_output = substr( $full_output, 0, -1 ).”\n”; // removes the trailing comma to avoid trouble in IE

      My plugin is not on jQuery. But you can find the original jQuery plugin by Sam Dunn on Github.

      • Thanks, that’s perfect! I have another IE7 bug that I’m battling right now. Have you seen the behavior where the cross-fade transition will fade in only half of the image (showing the previous and next one as if both are cut in half) and then quickly the rest of the image “snaps” into place. I’m trying to figure out what’s causing that, are you familiar?

      • Brian,
        I have never seen this before. Could it be due to a slow processor (or slow IE7…) ?

  17. Hi Ben,

    First off I would like to say great plugin. I am new to creating WordPress themes and have two questions on the functionality of the plugin. First – each time I load a new page the slide show restarts. Is there any way around this? Secondly how can I get rid of the background images when using a print.css file. Thanks for your help, I’m still pretty novice when it comes to anything web.

    • Bobby,
      This is the normal browser behavious: each time a new page is loaded, all the scripts are loaded and start again fresh so there is no easy way to prevent the slideshow restarting.
      I have never tried to print a page containing the slideshow so I have no experience with this issue. I would say that the css of your theme should have part of it specifying the background for printing. I must confess that I have no experience about the print css.

  18. Hello Ben,

    I have a problem with the new version I guess.
    The wp-gallery and the default slides work just fine. When i create an xml for a post I get this error:

    `
    Warning: fopen() [function.fopen]: URL file-access is disabled in the server configuration in /home/arsenben/public_html/wordpress/wp-content/plugins/wp-supersized/includes/xmlLib.php on line 101

    Warning: fopen(http://theblink.it/wordpress/wp-content/supersized-slides/anthea/immagine-sfondo-post.xml) [function.fopen]: failed to open stream: no suitable wrapper could be found in /home/arsenben/public_html/wordpress/wp-content/plugins/wp-supersized/includes/xmlLib.php on line 101′

    The custom field is correct as I have been already using it.
    Any suggestions? Am I doing something wrong?

    Thanks

    • Sacha,
      The error message seems to point to a server issue.
      Check that your file (and its containing folder) has sufficient permissions so that the plugin is allowed to read it.

  19. Hi Ben,

    I’m working with wp supersized for a while now and it worked perfectly. Yesterday I did an update of wordpress and nou I can;t seem to figure out why the backgrounds don’t show up and keep loading al the time. I checked all my htm/php templates etc but no good. I even build up an clean wordpress install and still got the same problem. You can see the website here http://www.anamalz.nl and I got the debugmode on. can you see any weird stuff?
    Thx

    Jacob

    • Jacob,
      Looking at the debugging info, it looks like your default folder ends with a ‘/’ which should not be the case.
      Make sure that you use ‘supersized-slides’ and not ‘supersized-slides/’ in the option Default slides directory.
      The next update of the plugin will make sure to prevent this problem.

      • Hi Ben,

        Hmm I already tried that one, I removed it now. Even in default setup it doesn’t show the standard image (girl in park with books).

      • Hi Ben I got some extra info – when I look in the source code I got two error messages –

        Warning:  asort() expects parameter 1 to be array, boolean given in /var/www/vhosts/anamalz.nl/httpdocs/wp-system/wp-content/plugins/wp-supersized/includes/WPSupersized.php on line 522

        Warning:  Invalid argument supplied for foreach() in /var/www/vhosts/anamalz.nl/httpdocs/wp-system/wp-content/plugins/wp-supersized/includes/WPSupersized.php on line 548

  20. Hi Ben, sorry to bother you again.
    I think I fixed the problem. It had something to do with the WPML Multilingual CMS plugin.
    The plugin was activated but I didn’t run true the setup ( since I don’t need a second language yet. So when you activate WPML Multilingual CMS you need to run true the basic setup in order for WP-Supersize to work otherwise it only shows the loading circle.
    Anyway sorry to bother you, I love your plugin!
    Keep up the good work,

    gr
    Jacob

    • Jacob,
      Happy to see that you found the culprit. Thanks letting me know about this.
      The plugin is indeed checking for the presence of WPML to make sure the url used for the images folders are correctly defined.
      I had not planned on having WPML installed but not activated though…

  21. Hi Ben,
    I have a problem with XML.

    I added SupersizedDir custom field with this value banner/homepage.xml (for this XML ) on homepage.

    The problem is the run the default images (http://buildinternet.s3.amazonaws.com/projects/supersized/3.1/slides/quietchaos-kitty.jpg)

    I don’t undestand why don’t run.

    ¿Can you hel me?

  22. Sorry I undestanded add XML URL is that http://www.baroniadeturis.es/nuevaweb/wp-content/banner/homepage.xml

    • Eriberto,
      The path to the XML file should be starting AFTER wp-content, so in your case: banner/homepage.xml

  23. Hi Ben.

    I’ve been using this plugin on a new site and everything seems great so far. I’m trying to customize specific pages via XML files, but they don’t seem to take effect at all. Basically I want the slideshow to happen on the home page, but all other pages should use XML to define a single static image as the background. Every page is just falling back to default settings.

    I definitely have the proper XML path defined, but no luck. Wondering if I’m missing something? What other info can I give you to help debug this?

    • Jason,
      Please have a try with the latest update. It should be working better. If not, please contact me again (use my contact form).
      If you use xml files, please note that there is an important change for two fields of the xml files (sorry about that):
      IMPORTANT: if you use xml files for defining your images, two slides field names must be renamed from version 3.0: slide-link to slide_link and slide-thumb to slide_thumb in the xml files.

  24. Hi,

    I have just installed the plugin on my local Xampp server (running on Windows 7). I have created a folder under the wp-content as instructed but the images included is not being used.

    The message I get on debug mode is the following:
    /* custom_dir = full_custom_dir = wp-content/ full_default_dir = wp-content/supersized-slides content_url = http://localhost/atux/wp-content */ /* custom_dir = full_custom_dir = wp-content/ full_default_dir = wp-content/supersized-slides content_url = http://localhost/atux/wp-content */ /* custom_dir = full_custom_dir = wp-content/ full_default_dir = wp-content/supersized-slides content_url = http://localhost/atux/wp-content */

    Can you help me to understand what the problem could be? Best regards and thank you in advance.

    • Antonio,
      Do you see the default images or simply nothing at all ?
      If you do not see anything, it could be that the background of your theme is not transparent. Have a look at the FAQ for a link to some css that you can use for semi-transparent background.

  25. HI,

    Thanx for great plugin! Just wonder if it´s possible to change background image
    on “click” (changin page/post) and not having the pictures “cycle”?

    Best, Maston

    • Maston,
      If you want to change images by changing page/post, simply choose a different set of images for each page/post.

  26. So far I really like the plugin. I have the slide show working in a post. However, all of the post content is appearing over the top of the slideshow. Is there a way to have that content either run behind the slideshow or not at all? That is the only hurdle I have left to overcome.

    • Scott,
      I guess that what you want to do is to have a slideshow without post content.
      Simply edit your theme file, removing everything that you do not want to see.
      I will soon publish a post about the creation of a full screen image gallery using WP Supersized. It might help you. Look for it in the coming weeks.

  27. I figured it out. Actually it was so elementary I feel like a bone head for not seeing the solution. Just hit enter in the content area and add blank content until it does not appear on a screen.

  28. Hi Ben,

    How would you recommend placing a logo overlay on my homepage in conjunction with supersize?

    • Brad,
      You could simply add your logo in the header.php (or footer.php according to where you want it to appear) of your template.
      Everything that is contained in the page will appear on top of the Supersized background.

  29. Hi, nice plugin!
    I’m so happy for use, is all the best!!

    but i have a problem, i had intalled the lastest version and now i have a some errors when i want to edit the post, or portforlio images.. the error appear on the top of the admin pages and not is visible web you navigate around the page (for visitors mode) only i can see in the admin.

    the error:
    Warning: call_user_func_array() [function.call-user-func-array]: First argument is expected to be a valid callback, ‘WPSupersized_Metabox::custom_meta_box’ was given in /home/another/public_html/wp-includes/plugin.php on line 405

    if you tell me something to repair i’m more happy yet..
    thanks you

    • Sorry about that!
      The latest version had a problem with a wrong function call that was not apparent on my own local configuration nor on my own website.
      This is solved now with version 3.0.1.

  30. Got a problem here:

    Notice: Undefined index: wp-supersized_submit_functionality in /var/www/vhosts/xxx.de/httpdocs/wordpress/wp-content/plugins/wp-supersized/includes/admin_page.php on line 10

    Notice: Undefined index: wp-supersized_submit_size_and_position in /var/www/vhosts/xxx.de/httpdocs/wordpress/wp-content/plugins/wp-supersized/includes/admin_page.php on line 26

    Notice: Undefined index: wp-supersized_submit_components in /var/www/vhosts/xxx.de/httpdocs/wordpress/wp-content/plugins/wp-supersized/includes/admin_page.php on line 35

    Notice: Undefined index: wp-supersized_submit_flickr in /var/www/vhosts/xxx.de/httpdocs/wordpress/wp-content/plugins/wp-supersized/includes/admin_page.php on line 48

    Notice: Undefined index: wp-supersized_submit_origin in /var/www/vhosts/xxx.de/httpdocs/wordpress/wp-content/plugins/wp-supersized/includes/admin_page.php on line 58

    Notice: Undefined index: wp-supersized_submit_display in /var/www/vhosts/xxx.de/httpdocs/wordpress/wp-content/plugins/wp-supersized/includes/admin_page.php on line 68

    Notice: Undefined index: reset_options in /var/www/vhosts/xxx.de/httpdocs/wordpress/wp-content/plugins/wp-supersized/includes/admin_page.php on line 99

    I have your plugin in use on the same server, just a different domain. And it works just fine… So I dont know, what exactly is the problem…hmm I´ll try a manual installation…

    • Uwe,
      Which version are you using ?
      Please try the latest version (3.0.1) and contact me again if it is not working.

      • Thanks for your reply… I´m using the newest version.. 3.0.1. Same issue. :)

  31. Nope… its broken…other doamin is Supersized 3.2.6… multi Undefined… ;)

    Have a nice day…

  32. Juliette,
    Please have a try again with the latest update.
    It will either work better or at least give you more info about the possible cause of error. There are now more informative images shown instead of the default images, according to the type of error.
    By the way, I’m Ben ;-)

  33. hey Ben,

    I’m having a problem with version 3 of WP Supersized. It only does this error in the production side, but works fine in localhost. Everytime I try to edit a page on WordPress I get this:

    ———————————————————————————-
    500: Internal server error

    This error is generated when a script running on the server could not be implemented or permissions are incorrectly assigned for files or directories

    Troubleshooting suggestions:

    Temporarily disable any rewrite rules by renaming your .htaccess file if it exists.

    Ensure that any CGI or Perl scripts have at least .755. permissions.

    If trying to run PHP and you get this error, you may have an invalid php.ini in your /cgi-bin, or may be missing your php.dat file in this folder.

    ——————————————————————————–
    On the same server/WP installation, version 2.0 of WP Supersized works fine but 3.0 and and 3.0.1 don’t work (but they do work fine on localhost).

    Any idea what it could be?

  34. Hello there,

    Congratulations on a really great plugin. I just have a couple of questions and hope you can provide some advice.

    We would like to show thumbnails at the bottom as default. Is there a simple fix to achieve this? I cannot find an option for this in settings.

    Also, are we able to restrict the image display height so that the images are not shown flush with the top of the browser (think this will be a css fix) and so that the bottom navigation doesn’t cover some of the image.

    I hope you can spare a couple of minutes to answer these queries and give me an idea of where / how I can make these alterations. Here is an example of the functioanlity: http://www.pixeleyesphotography.co.uk/gallery-beauty.html

    Thanks

    Matt

    • Matt,
      Showing the thumb tray at the bottom from the start (without needing to click on a button) is something that several users have requested. It will be included as an option in the next update of the plugin. I cannot give you a quick modification to do to the code in the meantime as it involves modifying some javascript and also the php files of the plugin in several places.

      About the restriction in height, this is also something that some users have asked but I do not intend to include it immediately in my plugin. But you can find indications on how to do it on the Supersized website (search for ‘Lutz’).

  35. The options tab ‘Slides Source’ does not work for me in WordPress version 3.3.1 using Chrome on Windows 7. After clicking the tab, the admin bar is not shown and there is nowhere to change the custom directory. Is anyone else experiencing tihs?

    • Tyler,
      This has nothing to do with Chrome of Windows 7 (I am using both without problems with my plugin).
      This is a problem occurring for some users (too many to my taste!) since version 3.0.1. This is most probably originating from the function listing the folders in the Slides Source tab and in the post/page editor. I have not seen that on any of my test configurations so it is very difficult for me to find the origin of the problem for the moment but I am working on it.
      In the meantime, try the following:
      In the file WPSupersized.php, comment out lines 1373 to 1376 and line 1380.
      In the file admin_page.php, comment out lines 550 to 554.
      If this was indeed the origin of the problem, the plugin should now behave normally, except that you will not see the list of folders to choose from.
      Please tell me if this solves the issue so that I can focus on the problem.
      Very useful for me to know: which version of PHP are you using ? Is it in safe mode ? The WordPress version is also useful but you told me already.

  36. The error is definitely related to the new “slides source” feature. When I get into the WP Supersized settings, I can enter any tab except the slides source one. And that explains why when I try to edit any page, I get the error described above. As as I said, the plugin works perfectly on localhost, but I get this error on the production counterpart.

    I have tried to switch to 777 the wp-supersized folder inside plugins and the folder that holds all the custom backgrounds, but that didn’t fix the 500: Internal server error.

    Any ideas?

    • Cesar,
      Please see my answer to Tyler (on this page). Your problem could be related to his.
      Try the temporary solution that I provided and tell me if it works better for you.
      Please also give me some more info about your configuration (Windows/unix, PHP version, safe mode on/off, WP version).
      I am trying to find a solution to this but it is not easy as it does not appear on any of my test configurations and this issue seems to only appear for some users.

  37. All working now… Was my fault… debug was on true…. doh :D Sorry for wasteing your time. Have a nice day, and thanks for your great plugin. Keep up the good work… I will donate something soon :)

  38. /* custom_dir = fotos/15-anos full_custom_dir = wp-content/fotos/15-anos full_default_dir = wp-content/fotos content_url = http://www.mwfotografias.com.br/wp-content */

    Why not showing the galery?

  39. jQuery(document).ready(function($) {
    $.supersized({
    slideshow : 1,
    autoplay : 1,
    start_slide : 0,
    random : 0,
    slide_interval : 3000,
    transition : 1,
    transition_speed : 500,
    new_window : 1,
    pause_hover : 0,
    stop_loop : 0,
    keyboard_nav : 1,
    performance : 1,

    image_protect : 1,
    image_path : ‘http://www.mwfotografias.com.br/wp-content/plugins/wp-supersized/img/',
    min_width : 0,
    min_height : 0,
    vertical_center : 1,
    horizontal_center : 1,
    fit_always : 0,
    fit_portrait : 1,
    fit_landscape : 0,
    thumbnail_navigation : 1,
    thumb_links : 1,
    slide_counter : 1,
    slide_captions : 1,
    slides : [
    Warning: array_merge() [function.array-merge]: Argument #2 is not an array in /home/mwfotografias/www/wp-content/plugins/wp-supersized/includes/WPSupersized.php on line 539

    Warning: array_merge() [function.array-merge]: Argument #3 is not an array in /home/mwfotografias/www/wp-content/plugins/wp-supersized/includes/WPSupersized.php on line 539

    Warning: array_merge() [function.array-merge]: Argument #4 is not an array in /home/mwfotografias/www/wp-content/plugins/wp-supersized/includes/WPSupersized.php on line 539

    Warning: array_merge() [function.array-merge]: Argument #5 is not an array in /home/mwfotografias/www/wp-content/plugins/wp-supersized/includes/WPSupersized.php on line 539

    Warning: array_merge() [function.array-merge]: Argument #6 is not an array in /home/mwfotografias/www/wp-content/plugins/wp-supersized/includes/WPSupersized.php on line 539

    Warning: array_merge() [function.array-merge]: Argument #7 is not an array in /home/mwfotografias/www/wp-content/plugins/wp-supersized/includes/WPSupersized.php on line 539

    Warning: array_merge() [function.array-merge]: Argument #8 is not an array in /home/mwfotografias/www/wp-content/plugins/wp-supersized/includes/WPSupersized.php on line 539

    {image : ‘http://www.mwfotografias.com.br/wp-content/fotos/15-anos (13).jpg’, title : ”, thumb : ”, url : ”},
    {image : ‘http://www.mwfotografias.com.br/wp-content/fotos/15-anos (14).jpg’, title : ”, thumb : ”, url : ”},
    {image : ‘http://www.mwfotografias.com.br/wp-content/fotos/15-anos (19).jpg’, title : ”, thumb : ”, url : ”},
    {image : ‘http://www.mwfotografias.com.br/wp-content/fotos/15-anos (25).jpg’, title : ”, thumb : ”, url : ”},
    {image : ‘http://www.mwfotografias.com.br/wp-content/fotos/15-anos (29).jpg’, title : ”, thumb : ”, url : ”},
    {image : ‘http://www.mwfotografias.com.br/wp-content/fotos/15-anos (3).jpg’, title : ”, thumb : ”, url : ”},
    {image : ‘http://www.mwfotografias.com.br/wp-content/fotos/15-anos (39).jpg’, title : ”, thumb : ”, url : ”},
    {image : ‘http://www.mwfotografias.com.br/wp-content/fotos/casamento (1).jpg’, title : ”, thumb : ”, url : ”},
    {image : ‘http://www.mwfotografias.com.br/wp-content/fotos/casamento (32).jpg’, title : ”, thumb : ”, url : ”},
    {image : ‘http://www.mwfotografias.com.br/wp-content/fotos/casamento (4).jpg’, title : ”, thumb : ”, url : ”},
    {image : ‘http://www.mwfotografias.com.br/wp-content/fotos/casamento (46).jpg’, title : ”, thumb : ”, url : ”},
    {image : ‘http://www.mwfotografias.com.br/wp-content/fotos/casamento (76).jpg’, title : ”, thumb : ”, url : ”},
    {image : ‘http://www.mwfotografias.com.br/wp-content/fotos/casamento (84).jpg’, title : ”, thumb : ”, url : ”},
    {image : ‘http://www.mwfotografias.com.br/wp-content/fotos/gestantes (10).jpg’, title : ”, thumb : ”, url : ”},
    {image : ‘http://www.mwfotografias.com.br/wp-content/fotos/gestantes (7).jpg’, title : ”, thumb : ”, url : ”}],
    slide_links : ‘blank’,
    progress_bar : 1,
    mouse_scrub : 1
    });
    });

    • Matheus,
      This is most probably related to the glob() function that the plugin uses to read the list of images from the folder.
      This does not appear on any of my test configurations so could you please try the following and tell me if this is solving your problem?
      In the file WPSupersized.php, in lines 539 and 558, add (array) before each glob() function.
      So, for example, line 539 should become:
      $dirArray = array_merge((array)glob($dir.”*.jpg”),(array)glob($dir.”*.JPG”),(array)glob($dir.”*.png”),(array)glob($dir.”*.PNG”),(array)glob($dir.”*.gif”),(array)glob($dir.”*.GIF”),(array)glob($dir.”*.jpeg”),(array)glob($dir.”*.JPEG”));

      By the way, which version of PHP are you using?

      • PHP 5.2.17 on Apache/2.2.19
        Register Globals: Off
        Short Open Tags: Off
        Envio de arquivos: Off
        Magic Quotes: Off
        Safe Mode: On

  40. Hi. You have made a really nice work with this plugin.
    I just have a problem.
    When i go to post a new entry, i can’t see neither the wp bar at the top, nor the tinymce editor of the post, where are the options: bold, justify, etc…

    What could it be and how could it be solved?

    Thank you

    • José,
      Sorry about this issue. It seems to appear with some configurations. I am trying to solve this.
      For a temporary solution, please check my answer to Tyler on this page.
      As for him, tell me if this solves the problem and also give me some details about your configuration (PHP version, Safe mode, WP version).

      • Hi Ben.
        I commented the lines you said to Tyler but it doesn’t fixed it.

        In fact at the admin options, when i go to the slide source tab, i haven’t seen the folder list ever. Neither before i commented those lines nor after i commented them. Also in the slide source tab, the wp bar at the top disapears, just as in the new entry page

        When i commented those lines it seems that the plugin doesn’t work since i couldn’t see the images on my site.

        About my configuration:
        PHP version: 5.3.5
        WP version; 3.3.1
        Safe_mode: Off

      • José,
        What is it precisely that you can see in the Slides Source tab?
        This could help me pinpoint the problem.
        Either copy the html for that part of the page or make a screen dump and send it to me. Reply to the email I sent you previously today.

      • Just thought of something: if this is not related to the listing of the files, then there could be some interference between my plugin and another one that acts on the admin.
        Have you got any particular plugin that is acting on the admin in any way? You could try deactivating it (or them) and see if it improves the problem.

  41. run local works fine, then move to host images not show… firebug get this error: invalid regular expression flag h
    [Parar en este error]

    …a>]: Argument #2 is not an array in /home3/galeriae/public_html/eleeleele.com…

    /arkraft/ (línea 123, col 125)

    • Maik,
      Sorry about this. This is due to a stupid detail I forgot in a php function. This should be solved with the solution that I gave to Matheus (on this page). This will be included in the next update of the plugin.
      If it still does not work with this temporary solution, please contact me again.

      • Hi Ben, i added array before each glob but no image yet. Now i got a new error message:invalid regular expression flag h
        [Parar en este error]

        …e]: Filename cannot be empty in /home3/galeriae/public_html/eleeleele.com..

        Warning: getimagesize() [function.getimagesize]: Filename cannot be empty in

      • solved! thanks

  42. Hi,
    thanks for a great plug-in, this saved alot of tinkering for me.
    When upgrading to 3.0.1 I encountered like most the problem with a slideshow that doesn’t load and just the laoding icon present.

    I tried the solution mentioned by jan (the line he mentioned matched something a bit lower down on line 539, 522 had something with the nextgen integration), but I had no luck.
    From what I get of the debug it finds the directory and images fine nad builds a list of them, but then nothing.

    I’m kinda at a loss on what to do except move to the 2.x versions

    • Nic,
      Have you tried version 3.0.2 ?

  43. Ben,

    the last two updates generate an “open_basedir restriction” error on the slide source tab.
    I understand the script is trying to use a restricted path. Anyone else with the same error?

    Matthias.

    • Matthias,
      The plugin is not trying to do anything wrong, just attempting to read the list of folders in wp-content. You probably should check the access rights of one or several of your folders in wp-content.
      Have a look here for a possible solution.

  44. Ok. the latest update (3.0.2) fixed all the problems for me. Now (on the production server–in always worked on localhost) I can enter the slides source in the WP Supersized settings, as well as select a custom directory when editing any page.

    Thanks Ben for your hard work.

  45. Hi! Thank you for this wonderfull plugin.
    But i’m experiencing a problem with Google Fonts: with the plugin activated, the quality of the fonts is very low. If I deactivate the plugin, the font is ok. Any idea?

    • I do not know how Google Fonts is working but it is probably an interaction between the Supersized script and the script that Google Fonts is using. I have read on the Supersized jQuery plugin forum that other font-replacing systems (such as Cufon) also cause some problems.
      I personally use Typekit fonts without problems.

  46. Excellent job. Highly recommended.

  47. Really good article. keep going!

  48. Hi…

    It is really great that such a plugin is available for wordpress…I m thankful…and many other from what i see…Great work!

    I ve used an older version flawlessly…at least as a simple changing background.
    With the new version…i ve noticed something that i could possibly work around it, but just out of the box it shouldn’t be there.
    There is margin/padding of around 20px on the right side…a gap between the image and the browser window…that i was not getting before.
    I have tweeked the css file a little…but didn’t change the width on something. And i also think that i used different aspect ratios on the images (but that shouldn’t be an issue since width and height is set to 100%).

    Please have a look when possible…and let me know if u can figure out what could be causing that…or how to get around it.

    Thank u…in advance..

    The site is under construction: http://alpha-chi.gr

    WP 3.3.2 | WP Supersized 3.0.2 | Presswork Framework

    • Vas,
      I had a quick look and it looks like your img element in Supersized has a style left: -10px. When I switched it off (in Chrome Developer Tools – Elements tab), the background image took up the whole screen again. This is the reason of your problem. Now, I did not look for the origin of this style: you have 9 css files acting on your page so I let you find the culprit by yourself :-)

Notify me of followup comments via e-mail. You can also subscribe without commenting.