Text slider widget? Like an image carousel, but with modules of text


#1

Is there a way to create a sliding text module, similar to an image carousel where images swap out left to right or you can click between them, but with text? i want to create something where i have a block of text in the center of my page for example, then three bubbles at the bottom of the text box and as you click each, it scrolls horizontally to another block of text


#2

Hi there!

Are you looking for something like this?

We’re still working on one last kink and i’ll be happy to share it with you afterwards.

It works by swapping box elements so you can have text, images, images & texts etc. swapping.


#3

:star_struck: :star_struck: :star_struck: :star_struck: :star_struck: :star_struck: :star_struck: :star_struck:

This is exactly what I was trying to do on one of our LP. Please could you share?!

Thanks Stefano!


#4

Hey guys!

How comfortable are you dissecting an Unbounce page?

You can see it in action here and download the page here.

:rotating_light: Bug Warning :rotating_light:

The slider breaks when resizing from desktop to mobile, or from mobile to desktop (but initial load is fine). Hopefully once we resolve the bug, we can make this an official community release!

Steps for Slider

  1. Create individual box elements to nest your text/images
  2. Copy HTML boxes for your left and right arrows
  3. Copy “slider” javascript
  4. Set your slide & arrow IDs in the slider javascript
  5. Copy “do not edit” javascript
  6. Copy “general” stylesheet
  7. Copy “do not edit” stylesheet
  8. Copy “slider dots” stylesheet

** I am currently hosting external scripts, so I would suggest (if possible) that you host these on your own end as we may not host them forever :slight_smile:

Would love to see how you guys use them!


#5

:pray: Looking forward to this official community release. This is huge.


#6

This is great! I look forward to the official community release. Is is possible to have it set as an autoscroll and clickable buttons (the dots at the bottom) at the same time so the slides can change automatically after a set amount of time, and have the page visitor able to interact and click through slides?


#7

Hey Jennifer!

We’re still working out the kinks and will try to get the auto feature working for you. Although, I would suspect that autoscroll may not be the best for conversions…


#8

I’d suspect that as well, but it’s always worth a test! In fact, I’m not sure if the auto scroll has been tested on the page… there may be something down that rabbit hole


#9

Hi, I was wondering if you guys found a way to fix the bug with this (or if anybody else was able to do this).

Specifically, I was looking for the request from the original poster on this thread - a text box that has a predetermined, timed scroll.


#10

Hi there!

Unfortunately I haven’t had the time to dig into this just yet. I will keep you looped in!


#11

Hi guys!

I just recently tried to put this on my page and I followed the instructions closely. In Preview the slider looks pretty good and works like’s it supposed to but here’s what’s happening on my live page:

What do I do to fix that?


#12

Hi @mhickman,

You should look at your browser’s console and that should point you in the right direction.

It’s pretty hard to troubleshoot a script by a screenshot :slight_smile:

Feel free to post your URL and I’m sure the community will try to help.

Best,
Hristian