Leave a Comment:
(21) comments
That is wonderful. I was looking for the slider option in Unbounce from so many years but couldn’t find it anywhere. You have saved alot of time. Thank you.
Looking forward to next updates.:)
ReplyThat is a wonderful step by step instruction and i loved the way you have explained everything. I was looking to add image slider with text and button in my unbounce pages from couple of years but never got succeeded.
But thanks to you, i have successfully got a working slider on my unbounce page.
Looking forward to more updates.
Cheers!
ReplyI have used above same for image slider but did not get positive result.
ReplyUncaught TypeError: $(…).rbtSlider is not a function
at HTMLDocument. (preview?attempt=1&page_uuid=462cbdf8-59b4-4b21-927f-e2a258b3c28a&time=1554903942&token=5f72fde1ec3499747cd96d0c97b7ace62be590a2f4b6f1896d81be1c4209802e:325)
at i (jquery.min.js:2)
at Object.fireWith [as resolveWith] (jquery.min.js:2)
at Function.ready (jquery.min.js:2)
at HTMLDocument.J (jquery.min.js:2)
___________________
don’t know why, but it not works
The order of adding the JS script should be reversed. “mainjs” is the first one. Thanks for code.
ReplyHey Dmytro,
That has worked on plenty of sites but since the unbounce has reduced dependency on JS, it may require some changes that i will look into.
By keeping the mainjs at the top, did the slider work for you? If yes, then please revert so i could tweak the post for other users.
ReplyI followed the step by step instructions but all that came up was blank space on the page? Even when I didn’t change any of the original image URLs and kept everything as you have had above, it didn’t work.
ReplyHi Hannah,
As you can see in the demo, the slider is still working. So it should be good. I would like you to keep the “mainjs” first and add “slider” js after that so see if it works.
I will be happy to assist you with any other questions.
Thanks!!
ReplyI was able to get the demo to work after switching order and making mainjs first before slider. But, my image doesnt fill page. It stays contained within the 1000px middle screen. How do you get the entire image to fill the page in desktop mode?
ReplyHi Thancan,
You may want to see your CSS that is containing the slider within 1000px range? You can check in “Inspect Element” of the browser.
Hi!
How can I remove the blank space on the right side near the scroll bar?
Thanks for any help.
Preview
https://imge.to/i/bGfFG
[=
ReplyHi Raphael,
If you could check the CSS, there may be some sort of padding or margin that is doing this. If you have existing CSS in your page, you may want to double check it?
Please let me know if you will need any other help.
Thanks!!
ReplyI can’t put the carousel in the possession I want it to be on # lp-pom-block-14
Could someone help me?
ReplyHi Rafael,
You will have to update JS and CSS based on the block ID then. Existing code should work with Custom HTML element as mentioned. But trying to update the JS and CSS may break the slider.
Suggest you to stick to the structure and just move the HTML block up or below where you want it in the page.
ReplyI created this carousel as the instructions read, and it works correctly. But, I tried to add it to a Landing Page that was already designed with a lot of other elements and also other Javascript and CSS already were in the landing page. I copied over the mainJS and sliderJS (both as “head”) and then copied the CSS as is too. And it doesn’t show carousel. Any idea why this would be?
Any thoughts on this would be appreciated. Thank you.
ReplyHi ThanCan,
If you’re using too many javascripts then that may break your slider. It is recommended to keep any other JS or CSS low where you want to use this slider.
Unbounce is also using scripts so sometimes it doesn’t always work with multiple custom scripts.
ReplyI can help you with Avin. Can you please share your URL here? Are you using any other JS on the page? If you’re okay to share your login details then i can share my email with you personally to help you in setting it up.
Reply