Mobile Call to Action Float

Engage your visitors by displaying a floating Call to Action button in your website’s mobile view, as a sleek top or b

// * INSTRUCTIONS - Floating mobile CTA *
// ========================================================================================
//
// ***** IMPRTANT RULE - the selector name in twik platform needs to be "mobile-float-cta" *****
//
//
// You are good to go! Enjoy!
//
// ========================================================================================

// get selector automatically
// =================================================================

let page_variants = window.twik_tags;
let variantName = "";
for (let variant of page_variants) {
    if (variant["name"] == "mobile-float-cta") {
        variantName = variant["selector"];
        console.log(variantName);
    }
}
let mobileCta = document.querySelector(variantName);
console.log(mobileCta);
mobileCta.classList.add("stickyStyle");

// =================================================================

let stickyContainer = document.createElement("div");
stickyContainer.id = "stickyContainer";

let domLocation = mobileCta.parentElement;

let stickyStyling = document.createElement("style");

stickyStyling.innerHTML = `

@media only screen and (max-width: 900px){
    #stickyContainer{
        position: fixed;
        bottom: 20px;
        left:0;
        height: 50px;
        width: 100%;
        z-index:999 !important;
    }

.stickyStyle{
        position: absolute !important;
        margin: auto !important;
        top: 0 !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 50% !important;    
    }
}

document.getElementsByTagName("head")[0].appendChild(stickyStyling);
stickyContainer.appendChild(mobileCta);
domLocation.appendChild(stickyContainer);

Overview

Add this variant to the mobile version of your website to increase conversions. Your visitors will see a sleek floating bottom bar that engages them to stay in contact and click your main Call to Action button. Simply select your call to action button in twik, append the script and let it do the rest for you.