How To Convert Links To Popup Box

To convert anchor tags or buttons on your webpage to open a Engage contact form a little bit knowledge of HTML and javascript is required.

To learn how to install engage tool on your website please check our tutorial from Get Started With ZNI Engage

Whenever Engage javascript file is loaded on your webpage it will callback a javascript function zipcallCallBack with a single parameter consisting of zipcall (i.e., engage) object.

function zipcallCallBack(zc) {
    //your code
}

use it only after you load the Engage javascript.

You need to add few lines of javascript to enable link-to-popup functionality.

//enable legacy mode for old engage scripts i.e. zipcall
zc('legacy', true);

//callback function
function zipcallCallBack(zc) {
    // bind click event on anchor tag
    zc.zipcallApi.bindClickEvent("a");
}

Above function will bind the anchor tag click event and listen to all click on the page. It will not transfer any data to our servers.

To enable any anchor tag to open a pop-up contact form you will have to add two data attributes to it.

<a name='contact-form' id='contact-form' class='btn btn-info' data-zipcall-onclick="contactus" data-zipcall-url="NA">Contact Us</a>

If you just want to open a contact form pop-up without forwarding the user to a new URL then set data-zipcall-url value to “NA”.

If you want that the user must be forwarded to a new URL after submitting the contact form or if they cancel the form then enter the full url of the destination.

<a name='contact-form' id='contact-form' class='btn btn-info' data-zipcall-onclick="contactus" data-zipcall-url="https://znicrm.com/" href="https://znicrm.com/">Contact Us</a>

In case of anchor tags it will prevent the default action of the click event and first open the contact form and after that will take the user to the destination.

This will not affect any SEO or non-javascript functionality of your page.