Insert wow slider
Author: Jeanet V.I would like to insert a wow slider into website x5. Iam not sure where to save the map of images and script. I've got the html code as below and past this into the HTML/widges. I've put the map of WOW in the library and uploaded all the mentioned images and scripts but still didn't see the pictures running.
Iam new in the world of website x5, hopefully can somebody help me:). Iam trying now for days but can not figure outwhat I'm doingwrong.
Thanks!
Jeanet
<!-- Start WOWSlider.com HEAD section -->
<link rel="stylesheet" type="text/css" href="engine1/style.css" />
<script type="text/javascript" src="engine1/jquery.js"></script>
<!-- End WOWSlider.com HEAD section -->
</head>
<body style="background-color:#d7d7d7">
<!-- Start WOWSlider.com BODY section -->
<div id="wowslider-container1">
<div class="ws_images"><ul>
<li><img src="data1/images/checkmark_events_tourmanagement.png" alt="checkmark events tourmanagement" title="checkmark events tourmanagement" id="wows1_0"/></li>
<li><img src="data1/images/checkmark_events_knrm_reddersgala.png" alt="checkmark events knrm reddersgala" title="checkmark events knrm reddersgala" id="wows1_1"/></li>
<li><img src="data1/images/checkmark_events_lifestile_fairs.png" alt="checkmark events lifestile fairs" title="checkmark events lifestile fairs" id="wows1_2"/></li>
<li><img src="data1/images/krnm_reddersgala_checkmark_events.png" alt="KRNM Reddersgala checkmark events" title="KRNM Reddersgala checkmark events" id="wows1_3"/></li>
<li><img src="data1/images/publiek_vierkant.png" alt="publiek vierkant" title="publiek vierkant" id="wows1_4"/></li>
<li><img src="data1/images/checkmark_events_knrm_gala_kurhaus.png" alt="checkmark events knrm gala kurhaus" title="checkmark events knrm gala kurhaus" id="wows1_5"/></li>
<li><img src="data1/images/checkmark_events_begeleiding_vierkant.png" alt="checkmark events begeleiding vierkant" title="checkmark events begeleiding vierkant" id="wows1_6"/></li>
</ul></div>
<span class="wsl"><a href="http://wowslider.com">Bootstrap Slider</a> by WOWSlider.com v4.8</span>
<div class="ws_shadow"></div>
</div>
<script type="text/javascript" src="engine1/wowslider.js"></script>
<script type="text/javascript" src="engine1/script.js"></script>
<!-- End WOWSlider.com BODY section -->
</body>
</html>
did you put this in the head section of your page?
<link rel="stylesheet" type="text/css" href="engine1/style.css" />
<script type="text/javascript" src="engine1/jquery.js"></script>
also make sure you add "style.css" and "jquery.js" in a folder "engine1"
look at the picture and follow 1 to 5, in that case you dont need to go manualy to add that code to head section of your page.
you need to add them 1 by 1
Author
Hi Anthony,
Thanks for your response. I've done that and now I see a slider without pictures moving to the left. In the slider I see a small symbol of an image but the image itself not.
Should I put the engine1 folder directly in the map of library (or maybe in upload??). Now I have put the whole folder of WOW slider in the library.
Jeanet
Author
Here's an image of the slider.
Jeanet
no, if you plan too update your website, you better do as following
do the same steps for your pictures but skip number 5
add your picture like "checkmark_events_tourmanagement.png"
and add your folder name "data1/images"
let me know the result
Good Luck
Author
the folder named data1/images was allready in the same folder of WOW slider. The images are added like you mentioned but it didn't have results. I also tried to upload the page, maybe was that the problem but it didn't succeeded.
look at my attachment an tell me which options you have check marks?
Author
the same as in your attachment. see my attachments general, pictures and publish
Author
wow slider pictures
Author
wow slider publish
Hello Jeanet,
You need to add the files necessary for the wow slider in the HTML&Widget Object in the program by following the Instructions of Anthony. It is important whene you add every single file to watch in which folder it will be then added by choosing the same folder name like created by wow slider. The files cannot be added manually in the project folder since this folder will be overwritten when you start the preview or export the project.
Many thanks!
Author
Hi Anthony and Claudio,
I followed Anthony's instructions but still it don't work. Let me explain step by step what I have done. Maybe you see where it's going wrong.
1) I've made a slider (slider checkmarkevents.html) in WOW and published it to my map of Incomedia/websiteX5v10-Evolution/Checkmark Events/preview
2) I opened the slider slider checkmarkevents.html and copied the code into the websiteX5 programm HTML- en widgets object, in the page HTML and the advanced page CSS.
3) I have insert the pictures out of the map incomedia/.../preview/data1/images
4) I have insert the wowslider.mod.js, wowslider.js, style.mode.css, style.css, script.js, jquery.js and marked them as js/css to link these items.
5) When I look at preview now I see the slider running. But when I upload the site to ftp server/public/sites/www.checkmarkevents.nl it doesn't show the slider.
Do you have suggestions?
Thanks for your help!
Jeanet
Author
Hi Anthony and Claudio (or maybe somebody else?),
Do you have suggestions about my latest message?
Jeanet
Author
Hi Anthony and Claudio,
I have succeeded to insert the slider into my website!! In the programm Wow slider I have published the slider directly to the ftp server and also saved it in website x5. After that I've enclosed the html code in website x5. Iam sure this is not the eassiest way but it worked out:).
Thanks for your help!
Jeanet