[How to Add] Dynamic Click To Call Buttons

dtr
clicktocall
button

#1

community tips scripts banner

Have you ever found yourself in a situation where you needed a Click To Call feature in your Unbounce landing pages or popups? For example, perhaps you have different phone numbers for different locations, and need DTR functionality to work within a link (when the URL the link points to changes based on the value in the URL parameter).

Up until this point, Unbounce DTR couldn’t change button or text link URLs. I’m happy to announce that those days are over, thanks to our in-house developer/marketer/designer/wizard @Luis_Francisco :boom:

Luis added DTR to the button and used jQuery to change the link text to include the URL parameter.

You can see this in action (built in Unbounce) here.

To achieve this functionality, follow the instructions below…


:rotating_light: WARNING: YOU ARE ENTERING DEVELOPER TERRITORY :rotating_light:
This is not an official Unbounce feature. This functionality is based entirely on third party code, and has only been tested in limited applications. Since this isn’t a supported Unbounce feature, our support team will be unable to assist if things go awry. So if you are not comfortable with HTML, Javascript and CSS, please consider consulting an experienced developer.


Instructions

Enter the following code snippet into your your button’s Javascript tab, below the body end tag, and follow along with the commented code, and BOOM! You’ve got yourself a Dynamic Click To Call button! :tada:

<script>

  
function getParameterByName(name) {
    var match = RegExp('[?&]' + name + '=([^&]*)').exec(window.location.search);
    return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
}

  
  //replace 'phone' with your DTR's URL parameter
var phonenumber = getParameterByName('phone');

  
 //replace "#lp-pom-button-9" with your button id 
$( "#lp-pom-button-9" ).attr("href", "clkn/tel/"+ phonenumber);


</script>

Want to take your Unbounce landing pages + Popups™ to the next level?
:spinbounce: Check out the Ultimate List of Unbounce Tips, Scripts & Hacks


#2

Pretty darn useful …


#3

Don’t you mean “Before Body End Tag” cause any other choice, does not work (for me at least).
58%20AM