jQuery Slider, jQuery Slideshow
Bildergalerie jQuery, HTML Diashow
Galeria de Imagenes con jQuery, Slide Imagenes Gratis
Diaporama jQuery & Galerie D'Image jQuery
Slideshow Immagini jQuery, Galleria jQuery
WOW 网络幻灯片：jQuery 效果的幻灯片
Slider jQuery Chocante, Slider de Imagens jQuery
WOW Slider: jQuery слайдер изображений, HTML5 слайдшоу, CSS3 слайдер
WOW Slider: jQuery Bild-Slider & Galleri
WOW Slider : jQuery画像のスライダー＆ギャラリー
WOW Slider: jQuery Afbeelding Slider & Gallery
Support
For troubleshooting, feature requests, and general help, contact Customer Support at
.
Make sure to include details on your browser, operating system, WOW Slider version, link to your page. In most cases you'll get a reply within 1 business day.
Please read the FAQs first to see if your question has already been answered.
FAQ
Technical Questions
See also:
1. Q: How can I add WOWSlider into an existing page? >>
A: To insert WOWSlider into your page:
1) Create your slideshow using WOWSlider.
2) Publish it on a local drive in any test folder:
- open Gallery->Properties->Publish or click 'Publish' button on the main menu panel;
- select 'Publish to folder', click 'Browse' button and select any local folder
- click 'Publish' button
3) Open index.html file from the saved folder in any text editor (Notepad for example) or you can:
- open index.html page in any browser
- right click on the page
- select 'view source' of the page.
You'll find 'engine' and 'data' folders in this saved folder also.
4) Copy code for the HEAD section and paste it inside the HEAD/BODY section of your own webpage, for example:
<head>
...
<!-- Start WOWSlider.com HEAD section -->
<link rel="stylesheet" type="text/css" href="engine1/style.css" media="screen" />
<style type="text/css">a#vlb{display:none}</style>
<script type="text/javascript" src="engine1/jquery.js"></script>
<!-- End WOWSlider.com HEAD section -->
</head>
5) Copy code for the BODY section and paste it inside the Body section of your own web
page in the place where you want to have a gallery, for example:
<body>
...
<!-- Start WOWSlider.com BODY section -->
...
<-- End WOWSlider.com BODY section -->
...
</body>
6) Notice, you should copy 'data' folder with images and 'engine' folder with all files
into the same folder with your own webpage.
7) Preview your website in the browser.
Notice, that if you want to install galleries in Blogger posts and other pages which are
not on your FTP server / domain name you should upload 'engine' and 'data' folders on your
server and use absolute paths for all WOWSlider files, for example:
<!-- Start WOWSlider.com HEAD section -->
<link rel="stylesheet" type="text/css" href="http://yourdomain.com/engine1/style.css" media="screen" />
<style type="text/css">a#vlb{display:none}</style>
<script type="text/javascript" src="http://yourdomain.com/engine1/jquery.js"></script>
<!-- End WOWSlider.com HEAD section -->
That's all.
2. Q: Is it possible to add more than one slideshow onto the same page? >>
A: With WOW Slider app. you can install several separate sliders on the same page.
You can do it in 2 ways: manually and using 'Insert to Page' option:
1. Insert to Page option
- Create first slider and install it on the page using 'Insert to Page' option.
- Create second gallery: Gallery->New.
Add it in the same page using the same option etc.
2. Manually
You should for each next slider:
1) Open Gallery->Properties->Publish;
2) Specify an unique ID for the slider: Slider ID
3) Install sliders in the usual way.
3. Q: I'd like to make the different pictures in my slider link to different pages. Is it possible? >>
A: It's possible to add individual link to each image.
You should select image by clicking and specify link in "Url" field.
4. Q: I copy the html code and paste to my site but I see question marks instead of slideshow. What am I doing wrong? >>
A: It seems that you didn't upload generated "data" and "engine" folders on your server or upload them into wrong place. Generated "data" and "engine" folders should be into the same folder with your page where you added a slideshow.
For example, you have the following folders and files on your server:
pages/
page1.html
page2.html
new_pages/
page3.html
page4.html
main_page.html
So, if you add WOWSlider into:
* "main_page.html" page - "data" and "engine" should be into a root folder on your server;
* "page1.html" or "page2.html" - "data" and "engine" should be into "pages" folder on your server;
* "page3.html" or "page4.html" - "data" and "engine" should be into "new_pages" folder on your server.
5. Q: It's possible to use animated GIF images in WOWSlider? >>
A: Actually, WOWSlider app. generates .jpg images only.
But you can change them on .gif images manually.
1) Upload your .gif images to data/images folder
2) Change image format in generated .html code. For example:
...
<li><img src="data1/images/image1.jpg" alt="image1" title="image1" id="wows1_0"/></li>
...
should be:
...
<li><img src="data1/images/image1.gif" alt="image1" title="image1" id="wows1_0"/></li>
...
Try this.
6. Q: Is there a way to add a video (iframe/pdf/page/etc.) in WOWSlider? >>
A: It's impossible. WOWSlider supports images only.
7. WOWSlider doesn't work correctly in Internet Explorer although seems to work perfectly in the other browsers. Please give me some advice. >>
A: Try to add the DOCTYPE declaration for universal compatibility:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
It should be the first line in your code (before <head> and <html> tags).
8. Q: I want to have a simple slideshow without descriptions, navigation arrows, borders, shadows, bullets and thumbnails - scrolling of images only. Is it possible with WOWSlider? >>
A: Yes, it's possible. WOWSlider app. provides "Show Prev/Next buttons", "Show descriptions", "Remove frame and shadow", "Show bullet navigation/Filmstrip" options. You can find all of them at Gallery->Properties->General tab and enable/disable options you need.
9. Q: I plan to add 100+ images in my slideshow. Does WOWSlider allow it? Should all images be pre-loaded before slideshow will start the playing? >>
A: You should use "On-demand image loading" option in this case. Only first image should be pre-loaded and slideshow will start. All other images will be loaded during the playing.
Please see 100+ slides jQuery Slideshow Demo
10. Q: Will WOWSlider play on iPhone/iPad/Android? >>
A: Yes, it'll. WOWSlider supports all modern devices.
11. Q: I want my slideshow to begin from a random slide and play images in random order. Is it possible with WOWSlider? >>
A: Yes, it's possible. You should go to
Gallery->Properties->General
and enable "Random order" option.
12. Q: I have both landscape and portrait photos. Is it possible to use them in the same slideshow? >>
A: Yes, it's possible. Go to
Gallery->Properties->Images
enable "Preserve aspect ratio", "Stretch small images" and "Shrink large images" options in this case.
13. Q: I want to change the position of description (font/font size/text color/color of description field/transparence of description field). How can I do it? >>
You can do it manually in generated "style.css" file. Open it in any text editor (for example, Notepad), find classes ".ws-title" and ".ws-title div" and make changes you need.
For example, "style.css" file of Aqua template:
#wowslider-container1 .ws-title{
position:absolute;
display:block;
bottom: 18px; // y-coordinate of description
left: 20px; // x-coordinate of description
margin-right:25px;
padding:7px;
background:#FFFFFF; // color of description field
color:#16B6FF; // color of title
z-index: 50;
font-family:Tahoma,Arial,Helvetica; // font of description
font-size: 15px; // font size of title
border-radius:2px; // radius of description field
-moz-border-radius:2px; // radius of description field
-webkit-border-radius:2px; // radius of description field
opacity:0.8; // transparence of description field
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);
}
#wowslider-container1 .ws-title div{
padding-top:5px;
font-size: 12px; // font size of description
font-weight: normal;
color:#333333; // color of description
}
14. Q: How to make the next and previous arrows are always visible, not just when I hover over the slider image? >>
A: Navigation arrows are always visible in some templates. For example: Terse, Crystal, Noble, Elemental, etc.
You can change other templates manually in generated "style.css" file. Open it in any text editor (for example, Notepad), find following lines:
#wowslider-container a.ws_next, #wowslider-container a.ws_prev {
background-image: url("./arrows.png");
display: none;
height: 30px;
margin-top: -15px;
position: absolute;
top: 50%;
width: 30px;
z-index: 1001;
}
and remove line "display: none;". That's all.
15. Q: Navigation arrows in my slideshow are always visible. I want them to appear on mouse hover only. How can I do it? >>
A: Some of templates provide this feature already. For example: Prime Time, Calm, Shady, Noir, etc.
You can change other templates manually in generated "style.css" file. Open it in any text editor (for example, Notepad), find following lines:
#wowslider-container1 a.ws_next, #wowslider-container1 a.ws_prev {
position:absolute;
display:block;
top:50%;
margin-top:-20px;
z-index:60;
height: 45px;
width: 45px;
background-image: url(./arrows.png);
opacity: 0.8;
}
set "none" value for "display" parameter and add the following lines:
* html #wowslider-container1 a.ws_next,* html #wowslider-container1 a.ws_prev{display:block}
#wowslider-container1:hover a.ws_next, #wowslider-container1:hover a.ws_prev {display:block}
16. Q: How to make navigation arrows outside the slideshow? >>
A: You can change the arrow position in the generated "style.css" file. Open it in any text editor and find the following lines:
#wowslider-container1 a.ws_prev {
background-position: 0 0;
left: 21px;
}
and
#wowslider-container1 a.ws_next {
background-position: 100% 0;
right: 21px;
}
Change values of left and right parameters.
17. Q: I use "basic" transition effect. Can images go from last to first without "scrolling" back? >>
A: "Basic" transition effect can work in this way only. Please use "Basic linear" effect.
18. Q: Is there a way to adjust timings and/or transitional effects on a "per slide" basis? >>
A: Unfortunately, it's impossible to set delay or transition effect for separate slide.
19. Q: Can I add my own arrows/shadow in slideshow? >>
A: You can find images of slideshow (arrows, bullets, shadow) in generated "engine" folder and edit them in any graphics editor.
20. Q: I have just downloaded WOW Slider for Windows. It was installed fine, however it will not launch at all. >>
A: Try to do the following:
Control panel -> System -> Advanced system settings -> (Performance) Settings -> Data Execution Prevention.
Turn off DEP or add WOW Slider in the exception list.
21. Q: Do you have a phone number to call you? >>
A: Unfortunately, we don't provide support by phone, e-mail only.