Integrating a WOW slider into Site...

User 2796102 Photo


Registered User
66 posts

Okay. One final issue. I have followed all the instructions but the slider is not working. I loaded all the code and folders and the slider appears but does not run. Does this have something to do with the website being made in foundation framer 6.6.3?

The website is www.justoneembroidery.com

The slider is at the bottom of the page just above the footer
User 2699991 Photo


Registered User
4,817 posts
Online Now

Phillip Lanier wrote:
Okay. One final issue. I have followed all the instructions but the slider is not working. I loaded all the code and folders and the slider appears but does not run. Does this have something to do with the website being made in foundation framer 6.6.3?

The website is www.justoneembroidery.com

The slider is at the bottom of the page just above the footer

Should work ok with that build. I am not at home at the moment and on my phone the whole website is not right so it's difficult to see, if you want you can email the project file to me (details below) and I will take a look when I get home in about 2 more hours
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … uman-lina/
User 2699991 Photo


Registered User
4,817 posts
Online Now

Phillip Lanier wrote:
Okay. One final issue. I have followed all the instructions but the slider is not working. I loaded all the code and folders and the slider appears but does not run. Does this have something to do with the website being made in foundation framer 6.6.3?

The website is www.justoneembroidery.com

The slider is at the bottom of the page just above the footer


I don't see the two folders that should be in your root
i see the links in the header
<!-- 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 -->

but not the folders
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … uman-lina/
User 2796102 Photo


Registered User
66 posts

Wayan,

Here is a google drive link to the entire project. The website, the slider, and the Site Designer exported folder that I use FileZilla to load to my server. I started over and watched the video again but I still can't get the slider to function. I picked up from your video that there must be a better way or solution to having a content slider. I would love to hear your thoughts as well but I just don't get the programming aspect which is why I use Site Designer.

https://drive.google.com/drive/folders/ … share_link

Thanks again for your time
Phillip
User 2699991 Photo


Registered User
4,817 posts
Online Now

Phillip Lanier wrote:
Wayan,

Here is a google drive link to the entire project. The website, the slider, and the Site Designer exported folder that I use FileZilla to load to my server. I started over and watched the video again but I still can't get the slider to function. I picked up from your video that there must be a better way or solution to having a content slider. I would love to hear your thoughts as well but I just don't get the programming aspect which is why I use Site Designer.

https://drive.google.com/drive/folders/ … share_link

Thanks again for your time

Yes Philip but Site designer has a slider already built in as a component, which with a little bit of work can be adapted to something similar to your slider,
Phillip
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … uman-lina/
User 2699991 Photo


Registered User
4,817 posts
Online Now

Philip
You need add the following into the header of your index page

<link rel="stylesheet" href="./engine1/style.css">
<link rel="stylesheet" href="./engine1/style.mod.css">

and the following into your footer on the index page

<script src="./engine1/jquery.js"></script>
<script src="./engine1/script.js"></script>
<script src="./engine1/wowslider.js"></script>
<script src="./engine1/wowslider.mod.js"></script>
Attachments:
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … uman-lina/
User 2796102 Photo


Registered User
66 posts

Wayan,

Again thank you. For my understanding, if I am using a wowslider on any page I will need to add that code to the header and footer of that page? I would like to learn more about using the orbit slider. I have looked at the component and it seems all I need to do is swap out the pictures and to add slides add additional List Item Container - Li with another picture element. Also in the orbit container I would need to increase the number of elements. What I can't seem to find is how to control the speed of the slide show and how to add the preview slides at the bottom so users can click on the image they would like to see next. I also think from what I am seeing that all of the images would have to be sized exactly alike to make it more consistent, which I can do in photoshop. You have been so helpful and one of the best forum guides I have ever worked with. I can't thank you enough. Any advice or suggestions on how to make those additional changes to the orbit slider would be appreciated when you have a free moment.

Blessings to you.
Phillip
User 2699991 Photo


Registered User
4,817 posts
Online Now

Hi Philip
Orbit is very versatile and can be made to adapt to different sized images, and have thumbnails etc the slider animation time can be adjusted easily by adding a custom attribute "data-timer-display" value= "xxxxx" milli miliseconds

I have a tutorial video about orbit, it does however need updating as it is for earlier versions of site designer, I am updating my website for those video tutorials even as we speak, I will bring the orbit one forward and let you know.
In the meanwhile as I am sure you are aware your project needs plenty of work still to make it responsive for all devices, but I will endeavour to get the orbit one done soon. Two days ago we had a minor earthquake more like a shudder than a full quake it did however knock down our water tower which in turn smashed our septic tank to pieces so now my priority for the moment is organising the workers for clearing the area and rebuild a new tower and septic tank
I will get back to my "day job :D asap"
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … uman-lina/
User 2699991 Photo


Registered User
4,817 posts
Online Now

Phillip Lanier wrote:
What I can't seem to find is how to control the speed of the slide show and how to add the preview slides at the bottom so users can click on the image they would like to see next. I also think from what I am seeing that all of the images would have to be sized exactly alike to make it more consistent, which I can do in photoshop. You have been so helpful and one of the best forum guides I have ever worked with. I can't thank you enough. Any advice or suggestions on how to make those additional changes to the orbit slider would be appreciated when you have a free moment.

. I would love to hear your thoughts as well but
I just don't get the programming aspect which is why I use Site Designer.


Phillip


Hi Philip
So first of all I have made a demo example of a page with a couple of orbit sliders (yes you can have more than 1 on the same page)
I have to emphasize that it is a DEM only I used some of the images from your project just so it was more pertinent and applicable to your images and adapted one of my site designer themes.

I just don't get the programming aspect which is why I use Site Designer.

This is also not a criticism so please don't take offense, your not getting the programming aspect is fine because that is one of the good things about site designer, however, it is a restriction/limitation that someone not "getting the programming aspect" faces, what is important is to gain even a small amount of understanding the how to the why's and the what if's which opens a whole new world ad unleashes the power of 'site designer' I truly believe that one needs to 'learn by doing' which leads to 'understanding by learning', which is one of the things I strive to achieve with my step-by-step video tutorials. The only thing I do do though is offer to help with those to people whom I think are willing, capable and want to gain the 'understanding'
Most of them are specific to someones particular project or problem but there are some which are common things (in addition to the ones available with CC own videos). So watch the demo as to see if it's anywhere near something you think you would like to learn about, if it is you then need to let me know so that I can set up your own secured page on the tutorials site.

If anyone else who happens to be following this thread or lands on it who might also be interested then I would also be happy to do something for them if they let me know and if enough show interest then it would become a general open tutorial (not specifically geared to your situation or needs).

To view the demo go to
https://rsdtutorials.asia
follow the button link to the classrooms and then the 'classes; button link, there you will see the 'orbit' demo you can let me know from the email link on the contact page, or through the link below.
The classes are still being updated as I have time, so there are only the couple more will become available over the following few weeks.

If you decide not to take it further, then that's OK too

(by the way, your existing slider images only need re-sizing a little bit, and you mentioned 'Photoshop' I assume that you use the Photoshop "droplets" batch resizer which makes the whole process a doddle and very quick, (you can even use it to get rid of those WOW slider watermarks at the same time.

Take care as always wherever in the US of A you are or wherever you are in the world for anyone else.

W
▼▼▼▼▼▼▼
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … uman-lina/
User 2699991 Photo


Registered User
4,817 posts
Online Now

Update
The Demo for this 'Orbit ' component is no longer available but you can still request a step-by-step tutorial if anyone is interested.
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … uman-lina/

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.