How To Change Carousel Transition Speed in KAJABI

A YouTube tutorial by Christina Haftman demonstrating how to change the carousel transition speed in Kajabi's Premier theme. She shows how to access the active theme's code (Website → Manage Themes → Edit Code), open Assets → scripts.js, find the testimonials/slideshow block (around line 140), and modify autoplaySpeed (milliseconds) while keeping autoplay:true. She tests changes in preview, notes possible latency issues, and advises adjusting speed to match content length (e.g., longer testimonials need longer display time).
Chapters
There, it's Christina, president and founder of creatingdigitalassets.com and welcome to my YouTube channel. If it's your first time here, and if not, welcome back and thank you for subscribing. Tonight's video is actually something kind of spontaneous. I decided to share because I'm doing it in real time right now for one of my clients and we're about to launch his website and just going over some QA quality assurance of functionality and some aesthetics in the page elements and positioning and different things. So I'll show you on the home page of the website. Down here we have a slideshow of his six best selling books on Amazon. And as you can see, they are not transitioning. There's six of them and they're not transitioning fast enough. It's very slow. So I want them to there to only be about three to four seconds and they're clickable. They open up in a new window so somebody can purchase it, but they're supposed to be transitioning and without clicking, you know, it's a carousel functionality and it's too slow. So I'm going to click out of there and go back into Kajabi. And what we want to do is when we go into Manage Themes and we're using Premier theme and this is the one we want to go into, you come over to the far right and hit those three little dots to edit the code. Click on Edit code. And then here in this left hand menu you want to go under Add assets and Oops, not assets. Let me see, was it. Yes, I'm sorry, it is Assets. And go down here to scripts. Js. Okay, now in this body of source code, you want to just put your cursor in here and scroll down until you get to the area where it says testimonials. Now this is the testimonials and the slideshow are two separate blocks, but they both invoke the carousel functionality. So it's a global setting. It's not a setting that is specific to that block, that page block or that page element. So right here it'll say autoplay, which is true, which means that it'll begin transitioning and people don't have to click through it to see the slideshow. But here's where we put the speed, the autoplay speed. And it's in milliseconds. So 5000 milliseconds means every 5 seconds it'll advance to the next image. And that is too slow for us. So I'm going to try 4000 and in Kajabi, when there's configurations for numbers, they're always in green. So as you scroll through here, you can see. So I'm going to try four seconds, which in the code, it's represented in milliseconds. So 4000. Make sure you come over here and hit the plue Save button and then preview right above it to see if. To see the results of that change and if it's going to work. So let's scroll down here to the books and see. It's not scrolling at all in the preview. Okay, that typically works. Let's exit out of here. And that's already saved. So let's go. Just look at it in real time and preview it from this. It should be the same, but from this link, scroll down here to that block. And it's not moving at all. I can hide that. Wow. This is what happens when you do a video in real time. Oh, now it started moving. Let's see what it does. I think that's still too slow. 1, 2, 3, 4. Okay, let me try three seconds. I'm not sure why there was some latency before it started the carousel. Let me go back in the code. And this is good repetition. Okay, so we want to go, you know, in your back end and you want to click on Website, and then you want to click on Manage Themes. Choose the active one that's in bold. Go over to the right, click the three little buttons to edit the code. Once you're in the code, this will be collapsed ordinarily, but you want to go into Assets on the left. In the left hand menu here, scroll down to Scripts js Put your cursor in all this body of code. Be careful not to accidentally delete anything. And scroll down to the testimonials area. And again, numbers are in green. So 4 seconds. Or I should say 4000 milliseconds was too long. So let's show each book, each image for just three seconds. 3,000 milliseconds. I'm going to click the blue button to save and I'm just going to go out of all of this again to the website and preview it. Scroll down to that area and let's see what happens. There are six books. 1, 2, 3. 1, 2, 3. It seems like it's still four seconds. 1, 2, 3, 4. 1, 2, 3, 4. Yep, it didn't take it. Okay, I'm going to troubleshoot this outside of this video because there's no sense in keeping you, but this is how you will, how you would do it. So now you know where exactly in the code that you can go to make that change. And again, it's under your website. Manage themes, Edit the code, the active one, it's always on top, it's always the first one in bold. Open up assets, go down to your scripts JS and then scroll in here until you find the testimonials block which is this is the premiere theme. It's about around line 140 and change your leave your autoplay as true and then change your autoplay speed until you get it at the right speed that you want it if it is testimonials. And you know when people have testimonials some people write a little bit and other people write a lot and sometimes you want to truncate that just so that they're all sort of balanced visually. But you know, if somebody wrote a lot and it's really compelling and you want to include it on your site, just take the testimonial that has the longest amount of copy and try to make sure that the carousel pauses on that testimonial long enough for it's reasonable enough for an average person to read it before it advances. So that's for testimonials. This particular implementation I'm featuring books and all they really need to do is take a look at the front cover art and then click it if they want to go out to Amazon and see the full listing and purchase it. So I'm even thinking I might try 2002. Second thing save. I'm going to try that, but that's where you do it in the code. And that concludes this video. If you have any questions, leave them in the comments below and and I'll see you on the next one. If you have any questions about Kajabi, I have been using it for a number of years and I can definitely help you. And if you're considering it as a particular software, there is a link in the description box below where you can get a free 28 day trial. And if you think it's right for you, you can get a discount after that upon purchasing it. So click the links below and I will see you on my next video. Thanks for watching.
More from Christina

Duke Ferguson at Unleashed Potential - Video Testimonial For Christina Haftman









