Kentico V8 custom slider web part

Question

I don't have a very strong dotNet background, as i'm primary a JS/CSS guy.

I want to use slick.js as a slider plugin, but i'm lost one how. I'm wondering if i'm on the right track here.

Ideally, an editor would be able to create a new page based on a slider template i create each. Each page would be a new slide. These pages would be in a specific folder in the site tree.

My web part would then pull these pages in and render the correctly formatted code and include the needed JS.

Am i on the right tract here? And if so how do i start.

Answer 1

You're absolutely on the right track. I've used slick on a couple of sites now and followed this pattern:

• Setup a repeater webpart
• Set the repeater's HTML envelope to be your slider's wrapper
• Set the repeater's transformation to repeat the content of the documents you want to repeat as slides
• Setup your slider script in a javascript webpart OR (my preferred method) on the page template's markup

Here's an example implementation in Kentico that uses slick's documentation. I'm using version 7, so things will look a little bit different and be in different places, but it shouldn't be too hard to figure out where to go with some googling

First off, you'll need to get the css for slick. Here I've just added it to the CSS file applied to this site in Kentico.:

---

Next you need to setup your page template:

Then add a repeater in the design tab:

And setup the repeater's HTML Envelope like so:

Finally, create your transformation:

Edit: You'll also need to make sure you've setup your content properly, and made sure your repeater's content settings are pointed to the right path. Here I've set the repeater up to pull everything from underneath the current path ./% which is the slick document.

It's pulling in the test documents which you see here: