Dynamic Text - caracthers limit or readaptation of the text size depending on the lenght


#1

Hello everyone!

I’ve tried the dynamic text feature on one of my landing page. However, the parameter I have put as dynamic can actually be filled in with millions of variables that goes from 10 to 40 caracthers
Two examples: from=Rome-Milan or from=San Benedetto del Tronto-Firenze Porta Susa
As a result, the sentence, after text replacement, could be one to three lines. Graphically, this is definitely not great. 

Does any of you know if there is there a way to force the text to fit in just one line and therefore dynamically modify the text size depending on the overall string lenght? Or else, is there a way to cap in any logical way the total numer of caracthers being input in the dynamic strings (for example S. Benedetto instead of San Benedetto del Tronto)?

Thanks a lot for your help,

Maria


#2

Hi Maria,

The ability to limit the characters on dynamic text insertion his is something that I’ve suggested before so I’m completely with you on that one. 

In the meantime there are a few options available to you. Trim the text (not so great can end up with half sentences), replace the text (better) or change the font size (not good design practice).

The easiest way is to use a small snippet of Javascript to replace the original values with something shorter based on what they match. I’m not sure how many variations you’ll have so i’m not sure what logic to use but the general idea is below.

So for instance…

I hope that makes sense, I’ve tried to include a bit of detail for an actual working solution but without seeing the page I can’t actually write the whole thing.

Feel free to pick my brains :slight_smile:

Cheers

Stuart.


#3

Hello Stuart,

thanks a lot for your helpful reply. I guess the script you’ve suggested would be the best solution. However, it may be quite time consuming as I have more than 10K city name to re-adapt. It would probably be easier to set all strings longer than 40 caracters to be redirected to the default option. Do you know if there may be the chance to do so through a different script?

Also, I’ll add a question as you may be able to help you with this one as well. :slight_smile: The dynamic text feature does not seem to be able to recognised signs (ie: if my dynamic parameter is axis= and the output is Milano-Torino or Milano-Roma, on the landing it just appear Milano Torino and Milano Roma respectively). Any idea on how to avoid the sign to be lost?

Thanks a lot Stuart for your precious help!

Maria


#4

I have struggled with this too!  Setting the max characters would be a good solution for the mean time.  Maria, ultimately I agree that the text should resize because time and time again I would look through my the search terms/queries that dynamically inserted, to find that it exceeded my character length expectations and overlapped my subheadline.  Stuart, you are a Javascript master! :slight_smile:

Thanks,

Joe


#5

@stuart this is the challange I am facing :slight_smile:
My text string is Risparmia fino a - 75% rispetto al treno! with dynamic text feature insert as following:
Risparmia fino a -> from=
75% rispatto al -> to=
treno! -> price=

In the from and to parameter I will get different train station name which may be too long. I would therefore like to substitute each of the stations (that could appear in the subparameter from= or the to=) whose name is too long (ie: San Benedetto del Tronto being translated into “S.Benedetto” & “Milano Centrale” into “Milano”)

I don’t seem to be able to do it through the script text you have sent me as it still does not work. Could it be because the element ID incorporate more than one parameter? Unfortunatelly I have to keep it this way or else I won’t be able to choose where to put each of the three blocks graphically as it would depend from the lenght of the station name.

I am so lost in this, thank you so much for your help!
Here attached a preview of the lp from unbounce


#6

Thank you so much Stuart!
Here’s the link of my landing page (i will use it only for an android campaign therefore, you should probably check it on mobile even if the dsk versione is available as well):
http://partner.blablacar.com/trenit/?..

The dyanamic parametri are the following: from, to & price.
The elementi id for the concerned text string is #lp-pom-text-14

Let me know if anything else is needed.

THANK YOU!!!


#7

Stuart, this is really amazing. I ran this by a few script wizards internally and they all tipped their hats. Again, great job!


#8

Hi Maria,

Can you provide a link to your landing page so I can pull outside element id’s and I’ll see what I can come up with for you.

Thanks

Stuart.


#9

Hi Maria,

The script below should do what you’re looking for. It doesn’t matter that  different parts of the dynamic text are all in the same element, actually it makes it simpler.

You can make multiple replacements on the string just make sure the line your duplicating is the one in the second replacement, see my notes inside the script. 

Apologies this didn’t work first time around, I forgot to change a variable name when trying to make it more relevant to your specific issue.

I hope this helps, feel free to quiz me again. I am looking at a couple of other ways to accomplish this but I’m overseas for a few days from tomorrow so won’t get to look at this again until the end of next week.

Cheers

Stuart.