Share This
 
All Posts  /  Kentico Development Tips  /  July 21, 2015 

Working with JavaScript Carousel Sliders in Kentico

Working with JavaScript carousel sliders like Owl Carousel in Kentico may be challenging depending on how you are attempting to implement it. One less desirable way might be to add the content into editable text regions in the Edit mode of the Pages application. While this may be preferable to Editors since they are able to directly add their content in each box, it could also cause the content to clone and append to the editable region multiple times (separated by commas), depending on how the page template was set up, if the carousel is set to loop.
Repeating text in editable regions
If the client or editor insists on using this method, one way around it would be to determine if the page is in Edit Mode in Kentico and set the loop to false.  
 var inKentico = $("body").hasClass("EditMode");
 if(inKentico){
         $('#tab-thumbs').owlCarousel({
             loop: false
       });
 }
 else{
    $('#tab-thumbs').owlCarousel();
 }
Another way to handle looping carousels and avoid all the potential issues is to create a custom page type for the items in your carousel and use a repeater to display the information.
Repeater
Information on creating page types and displaying data can be found in the Kentico documentation at:
Page Types
Loading and Displaying Data on Websites

Regardless of the new plugins created to make pages more user friendly and responsive, Kentico is a versatile CMS that gives developers and editors multiple avenues to manage content regardless of the requirements of the plugin.
Show More
Share This
 
Comments
Blog post currently doesn't have any comments.
*
 Security code
*
ADD COMMENT
Social Buzz

Get in Touch

Contact

Contact
t: 973.539.5255
f: 973.917.4730

Visit

Visit
715 Main Street
Boonton, NJ 07005

Locations

Locations
Boonton
Dallas
Jersey City
Boulder

Send Us a Message




 Security code