Quote Carousel with Owl Carousel

Bootstrap Studio Help
1

Hi Guys!

I turn to you guys as I can't get a quote carousel to work correctly. I am trying to redo this one quote carousel here So what I did I copied the HTML AND CSS and past the code into a custom code and style sheet to see if it works linked the owl theme and carousel css then link the owl js fil in external with cdnjs and added the JS to file in BSS.

Now; When I do that it works I can see it in my chrome browser however I can't see it in BSS as a visual I don't see it in BSS with the custom code or a rebuild version that i did. I have looked into it and I pulled it to pieces and found that if I delete the carousel.min.css link I can see it in BSS. I took the carousel.min.css and had a look at it and found the (class owl-carousel that has a display:none; if you remove that you can see the design in BSS but of cause the carousel doesn't work. Does anyone have a solution or know of a work around to make it work. Guys you are my last chance only you can save me... lol (for starwars fans)

thanks

2

First thing, the app doesn't run JavaScript for primarily security reasons that's why it doesn't show/run the carousel. The script sets the display property to block when it loads. Secondly if something is hidden from view you can force it to be shown in the app by selecting the element that it being hidden and then in the Options pane click the Gear Icon and expand the Accessibility menu and toggle SHOW if you manually created it. If you used Custom Code component then just add the class show to the class owl-carousel.

You can then either leave the SHOW enabled or disable it when you go to export. The difficulty you'll have is that other testimonials in the app will just be stacked in order.

Saj

3

Thank you Saj I will try that.