This is the Wiki page for the Site Background Slider Plugin for WordPress which includes Setup Information, all Documentation and FAQs. Please refer to this document if you are using the Site Background Slider Plugin and are having setup issues – if you still cannot get this plugin to work, send us a contact request or add a comment and we will help you out!
Installation
- Extract downloaded ZIP file to a location of your choice.
- Upload folder background-slider to your /wp-content/plugins/ directory.
- Activate the plugin through the ‘Plugins’ menu in your WordPress Site.
- Options can be found under your Admin / Appearance menu.
Frequently Asked Questions
I don’t understand how the images work. Can I just change the directory or does it have to be specific as set in the gallery options?
You can set the directory to whatever you like, it is based from your WebSite root folder. So specifying ‘images/slides’ as an image location means that your images should be located for example as ‘http://[YOUR SITE]/images/slides/image.jpg’. The default folder does not exist on setup, you will need to create it or set your own folder location.
How are the images displayed and read?
Images are read by the Plugin from the specified image folder location. All you have to do is optimize and place your images in that folder.
My background load slow and weird.
To make sure your images load quickly make sure the images are optimized (using an image editor), also make sure you dont have to many flashy Javascript thing running on the same page and the background slider will be super fast
Nothing loads in my background, nothing happens?
Main cause of this usually is the jQuery / CSS files are not being loaded, returning a 404 not found error; check the paths in your setup (Best done using Firebug or a live code editor) For example, your site should be able to see this: http://YOUR SITE]/wp-content/plugins/site-background-slider/assets/jquery.min.js
If the file is there, but still cannot be read, check the folder permissions (should be readable, 755). Lastly also make sure your filename has no weird characters (For example ö, ü, ä, etc).
My site theme background still shows.
Make sure your current WordPress theme is not forcing or hardcoding a background image – as this would cause the theme background to overwrite the slider image. Use an online editor like firebug or similar to check.
Please offer some advice as to the background images resolution and optimizing…
Remember to save your images optimized (Adobe products and others have this ability) in the correct respective format as shown below, as to the image sizes – it is recommended to use large images, above 1700 pixels in width to cover almost 95% of the display sizes available today. However this plugin resizes images – so I would recommend making the original image 800X600 and JPG optimized as this will still look sharp (like on the Site Background Slider Demo).
- GIF – graphic image format – graphics with minimal colors, simple graphics
- Jpeg, JPG – joint picture expert group – large photographs, great with interlacing.
- PNG – portable network graphics – mixture of both above.
I would like the slider to only apply to the home page…Is this possible? Also, what size should the images be to look crisp and proportional on the screen?
Thanks.
Updating the plugin this morning with this new feature – so keep an eye out in the plugin manager for an update
enjoy! As to your second question, check the next answer…
I see that the option for the homepage is available which is great. For some reason, this is not working for me. What determines the homepage? I have my homepage set as the WP Front Page, but the slideshow does not activate.
We have just re-written this, as there were major complications as to different setups with the home pages – version 1.0.8 and up has this new feature.
This is a great plugin but I am amazed that you give not a single recommendation for the images themselves as far as optimization for use as backgrounds. You cannot just throw a bunch of different images of different dpi, width & height, into your plugin and expect to get always optimal or attractive backgrounds.
Some images may be rendered as highly pixilated and ugly. Please come back with the OPTIMAL width & height at, for instance, 72 DPI, that your plugin works best at. This is an important requirement to get the best user experience. What do you recommend as far as optimal parameters for all images in the folder intended for backgrounds?
Thank you!
You are a funny guy… not only do we make a FREE plugin for you, but you demand to be told in detail how to use your images! That is like getting given a free car and getting offended when they dont teach you how to drive it… common – I revert you back to the old saying “google is your friend and not just a cat pic database”.
There you go: http://bit.ly/y5aHVj
That being said, will add recommendations to the FAQ and Wiki for those of you to impatient to do a bit of research. Watch this space
EDIT: Have added some advice to the wiki shown above. Enjoy!
Hi, firstly thanks for such a great plugin. I was wondering if there was a way to specify different galleries for different pages?
We are actually working on that at the moment (sort of part of the pro version coming up). Will take a while as a bit of coding to do here!
Cool because that’s exactly what i need ! Do you have a average release date for
this update / pro version ?
Still busy with it at the moment
A bit technical – looks like this will be in a pro version, in a few weeks
I could send you my code i customized your plugin a little and i thinks that could be interesting for you to see the way i do it? It’s simple, for each page i display a upload box, a input type text for the files directory and a checkbox for activate the slideshow on this page. But for this i create a new table.
It’s not finish,but i seem to work. Just let me know if you want it.
That sounds great, drop me a mail with the code and I will have a closer look
By far the best background plugin I have used. Does it only work if it is the only script activated? I had to disable the j-query because it conflicted with my site rotating images.
If you have jQuery loaded already, you can disable the option in the plugin as long as your jQuery loads above the Vegas JS Script. And that (and perhaps the no conflict JS) is the only 2 scripts you will need then
Hi, I installed this plugin on one of my local sites (testing on MAMP) and it was working perfectly. Now I’ve uploaded my website to a test server, and it will not work – it’s loading the correct .js files, but no images are showing up. I’ve checked the folder permissions where my images are stored, and it’s set to 755. I’ve uninstalled and reinstalled but still no joy. Any advice? Test site is imajandesign.co.uk/whm
Hello! I see jQuery is being loaded twice by your site – our plugin and your site seems to be loading jQuery… so remove one of those and try again
Drop me a mail if you still having hassles.
Please disregard my previous message. I’ve figured it out now. I’d set the slideshow to only show on homepage, but because my test site is in a sub-directory, the homepage was effectively the home page of the root directory, not the sub-directory
This is a really nice plug-in and I would absolutely love to have it working on my site but I’ve encountered a problem. I have installed the plug-in and set the path for the image but it doesn’t work anyway. Sometimes it seems to be loading the images because I see the loading arrows in the corner but nothing
( I don’t know what to do….appreciate if you would help me. Thanks a lot.
Having a look at your site I can see a few major issues – for example you are loading 10-20 javascript files, which is just a sure fire way to head to conflicts. Currently your site has 2 javascript errors on it. I believe Site Background Slider is not running at present on your site (disabled?) but I am pretty sure it will be a conflict with one of the other JavaScripts on your site – more than likely either the core theme or the image slideshow.
Hi,Great plugin. But is it possible to have the slide images not centered vertically, instead placing them on top? I see a css-class “vegas-background” for the images. Could I use that in my style.css for a new position of the images? EDIT: Obviously I can: img.vegas-background { top: 0 !important; }
Thank you for this beautiful plugin, it almost does everything I need ! I only have one problem, I would like to be able for the user to jump from one background to the other, I tried $.vegas(‘jump’, 1); but it doesn’t work, could you provide me the correct function to call to do this ?
EDIT: Ok I’ve found my answer, I had to call jQuery.vegas(‘jump’, 1); Thanks again for this amazing plugin!
Hi! I am total newbie in wp, plugins, coding. I installed wp for multiple sites. We are running http://www.cofestival.net and http://www.cofestival.net/en. I want plugin to work onj both sides. I enabled it first on http://www.cofestival.net and then on http://www.cofestival.net/en. But it is not showing the photos on the latter. Any advice? G
Are you using WordPress multisite or is this on two separate installs? I can see the second site is looking for images within the /en/ folder, can you check your set folder location for the second site within the plugin options?
I have WordPress installed to a subdirectory of root. When using this the Show Only on Home option doesn’t work. Thoughts? Thanks, great plugin otherwise…
I just fixed it with this (I think):
[lots of code here, implemented into 1.0.8 as mentioned below]
Version 1.0.8 has just been released that pretty much incorporates the code that you have displayed here. Well done for figuring this out before us!
Hi i am trying to install this plugin and there are conflicts with already built in slider i guess. and there is already jquery library in the template. How do i go about solving this problem . The template is disabling the background. Kindle guide me.
You need to make sure only one instance of jQuery is loading in your site, and that this is called above the Background Slider jQuery files. This should help, plus also trying the jQuery no conflict method will also help. Check with your theme provider
hey, great plugin. thanks for that!!! any chance to change the fade effect to Slide from left to right? thanks for help!
Unfortunately not at present, we are investigating more features but it seems that is one of the more complicated features to implement.
Hey there, thanks for this plug-in! Its great. I have a one page site with a video shown on start with a inline-popup. So far – so good. When the video plays, of course the background stocks – or the background works and the video stocks. So I want to ask if there is a call to stop and start the slider via event – or any other solution to override the:
// jQuery.vegas(‘slideshow’, { backgrounds:[ … //
You can use the following javascript call: jQuery.vegas(‘pause’, 1); Once to pause, and again to resume.
Strange,
it stops with the call “jQuery.vegas(‘pause’, 1);” but if I wanna resume it with da same call “jQuery.vegas(‘pause’, 1);” nothing happens?!
I have the latest version 1.0.8.
Thanks.
This will play the slideshow again, not what I had above:
jQuery.vegas(‘slideshow’, 1);
Hmmm, pause is okay.
But with “jQuery.vegas(‘slideshow’, 1);” its jumping to the next pic but thats it – not playing.
The only solution I’ve found is to do the same call as usually in the head-tag “jQuery.vegas(‘slideshow’, {backgrounds:[ …”
Its almost what I wanted – sometimes its da same next pic as that one while it stops, but its better what I had before
Thanks for your help!
Hi! I made a theme for my portfolio and I would like to use the fullscreen slider option to show every project I have done (one post per project with project title and description). I’ve been seeing demos with this slider and I didn’t see controls as next and prev. Has it that option(navigations button)?
And the last question is if you think the first part of this consultation is possible with your plugin (to get information about every project and show it : title and description). Once again, I’m sorry my bad English and I hope you understand all above.
Hello! You cannot have slide info (descriptions and titles) with this plugin – that would be complicated as slides are read from a folder location and not within a database. As to the forward and next buttons that also is complicated as it needs to be coded in the jQuery – like as follows, but not simple to do:
$ (‘#bf_next’).click(function() {
$.vegas(‘next’);
});
// On passe au précédent
$ (‘#bf_prev’).click(function() {
$.vegas(‘previous’);
});
Thanks for clarification.
love the plugin, however ever since installing it, I have a small white bar directly under the overlay. How do I remove this?
Must be something conflicting in your code – more than likely CSS which is causing this issue
Mail me your URL and I can have a look for you if you like!
Hi guys – Firstly – great plug in! So thank you for that. I was wondering if there was any way to have the background scroll when a visitor scrolls? (ie not fixed)
Hello! Thanks for the kind words
Unfortunately not, as the fixed element positioning is what allows for the force JS layering of the background – so scroll would be difficult to do – I will check out possibilities though!
Read through comments and I see that you have a pro version coming out any chance I could get advice on how to remove your link or change to smaller text. Im working with a theme that will have a menu at the bottom and this hits right where I need the menu. I know that this is how you advertise so let me know I could paypal you some money if you could email me this code. Or let me know if the Pro version will not have the info at the bottom. Thanks
No problem, you can make a donation here http://www.presspixels.com/donations/ and I will see your mail and then send you instructions / revised code as the Pro version might still take a while
Hello,
Great Plugin! Is there a way to embed a url link for each background image?
Thank you.
Not at present, we are busy building a pro version which has better image integration, we have a monday meet up to discuss time frames on this