Have you ever been asked to make a landing page "pop"? Don't you just love that? Well here's a way you can really WOW some folks with this nifty new script!
Introducing: Typed Text Effect in Unbounce
Gone are the days of having to choose just one adjective, or just one feature to display on your landing page. Rejoice!
View the page here.
Download the .unbounce template here.
WARNING: YOU ARE ENTERING DEVELOPER TERRITORY
Link to script: https://gist.github.com/noahub/59f4bb0db7c6ec353709efdcbe1761dc
- Create a new text element for your 'typed' text and add some default text. Make this text element wide enough to accommodate your 'typed' text.
- Click 'view source' and create a new innermost span around your default text. Give this span an id of 'typed' (or another ID/class of your choosing)
- Replace '.element' with the ID from step 2.
- Add your 'typed' words or phrases to the strings array
- Optional: for blink cursor effect, copy CSS from 'animated_cursor.css' and add to your page Stylesheets
Now let’s test this puppy out! Like any other feature that you implement onto your page, you’ll want to see what effect it has on your conversion rates. We recommend running an A/B test and segmenting a small portion of traffic towards the page, just to be safe. Documentation on A/B testing can be found here.
Did you find this tip useful? Did you test this on your landing page? Let us know in the comments below!