Dynamic text replacement: don’t parse dash as space? V2.0

  • 5 April 2021
  • 5 replies
  • 26 views
S

Did Unbounce ever fix this? There is a topic on this already that is dead so I thought I’d renew it here. Basically when you use DTR, any dashes are rendered as spaces - which sucks for phone numbers 😦

The solution provided in the post by @leah.ann didn’t work for me (but if you read this Leah, you’re a whiz! It’s likely me not understanding something).

 <script>
function getURLParameter(name) {
    return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search)||[,""])[1].replace(/\+/g, '%20'))||null
}
var num = getURLParameter('num');
if (num) {
lp.jQuery("#lp-pom-button-46 .label").text(num);
};  
</script>

Any and all help would be appreciated!

5 replies

Jess
Rank
Userlevel 7
Badge +1

Hey Joe!

First of all, thank you for adding a new post about this! It makes it a lot easier to find a solution rather than dig through rows of comments.

I’ll loop in the @UnbounceTechTeam and see if this is on their radar to be fixed. I’ll let you know what I hear back!

-Jess

Becky
Rank
Userlevel 2
Badge +1

Hi Joe!

When using DTR, dashes will be rendered differently depending on the ‘Text Style’ that’s chosen 🙂

image

No case, UPPERCASE, lowercase, and Title Case will render dashes as spaces.

Sentence case will render dashes as dashes.

With this in mind, you can consider:

  1. Using ‘Sentence case’ to render dashes, or
  2. Replacing the dashes in the URL with an ‘em-dash’ or an ‘en-dash’. These types of dashes will render as dashes instead of spaces, regardless of the chosen text style

To create an ‘em-dash’ use %E2%80%92 to replace dashes in the URL. For an ‘en-dash’ use %E2%80%93

Here’s an example of what an ‘en-dash’ looks like with each DTR text style case: http://unbouncepages.com/dtr-phone-number-test/?phone=(604)%20555–5555

Cheers,
Becky

S

Thank you! One quick question, what is the compatibility like for em-dash use?

S

Also… I didn’t think about this but… how do I make the call link Dynamic as well? I managed to get it working but I am unsure as to how to make the link dynamic as well?

On our page go.mediatorlawgroup.com I am trying to make the numbers clickable but dynamic as well based on a numb url reference.

S

@Becky Thank you again Becky, I added some questions above:

How does em-dash work with compatibility wise (mobile, other browsers)

And how do I make this change my tel link as it only changes the display number.

Reply


Terms & ConditionsCookie settings