How do I make a jQuery slider work with a BC web app and Muse?

Report · Feb 11, 2017

Hello,

I am looking for a way to make a jQuery slider work with a Business Catalyst web app and Muse (responsive). It is really hard find any documentation about this subject.

Hope that anybody here can help.

Thanks

Report · Feb 12, 2017

Your question is very broad. More than likely if the jquery slider is not already responsive it would need to be. The temple or web page you are using would have to be customized to support however the slider renders or vise versa.

Report · Feb 13, 2017

Hello BCMan, Thank you for your reply. The jquery slider is already responsive. I think that the problem lies in retrieving the right tag to add in Muse. I've been trying a few things in my test-webste hero . The html code and the tag (which I took from the BC placeholders) `i used and which I placed into my Muse file (in a html container) is:

{module_webapps,31824,a}

</div>

It does render the images, but not in a hero slideshow.

I've also tried {module_webapps}, but that didn't help.

I've also added the following code into the Muse page (via a jQuery injector)

$ (function() {

//hero slideshow

$ ("#slideshow") .hero({

textSpeed: 1000,

imageSpeed: 2000,

pause: 6000,

paging:true,

titles:false,

prevAndNext:false,

divider:false

});

And in the page properties>header of the muse page I know should add some code, but there I get stuck. From another tutorial I figured out it schould be something like:

<link rel="stylesheet" type="text/css" href="slick/slick.css"/> /<link rel="stylesheet" type="text/css" href="slick/slick-theme.css"/>

(but then for my hero, not the slick slider).

As a designer not a developer I wouldn't know how to create this code.

Also, I am not sure whether the tag {module_webapps,,} is right.

Does this make sense...

Report · Feb 13, 2017

If you take a look at the console you can see the error messages.

In your HTML change

https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js

</script>

To:

Then see what errors we get after that if any

Report · Oct 10, 2017

Im trying to make the slider using slick but I get this error in the console "TypeError: $(...).slick is not a function"

This is my page.

<html>

<head>

<title>My Now Amazing Webpage</title>

</head>

<body>

<div>your content</div>

</div>

$(document).ready(function(){

$('.your-class').slick({

});

</script>

</body>

</html>

Adobe Community

How do I make a jQuery slider work with a BC web app and Muse?