Shopify merchants have the option to display the PayNow logo at their Shopify Products Pages.
Note: The display may differ depending on site-specific theme and layout. Please view the example below:
How to Configuration PayNow Logo
Login to your Shopify Store Admin and click Themes under Online Store from the left hand side navigation:
Under themes, click Actions > Edit Code:
Navigate to theme.liquid and copy/paste the below code snippet at the end of the page as shown below and click Save:
<script>
var timeint = setInterval(function(){
if(document.getElementsByClassName("shopify-payment-button__button").length){
//Create text node
var para = document.createElement("div");
para.id="PayNow";
var node = document.createTextNode("Checkout instantly and securly with ");
para.appendChild(node);
para.style.fontSize = "18px";
para.style.textAlign = "center";
//document.getElementById("PayNow").appendChild(para)
//document.getElementsByClassName("shopify-payment-button__button")[0].parentNode.appendChild(para)
var container = document.getElementsByClassName("shopify-payment-button__button")[0];
$(para).insertAfter(container);
//Create Image
var x = document.createElement("IMG");
x.setAttribute("src", "https://i.ibb.co/PhmSS7P/logo-Pay-Now.png");
x.setAttribute("alt", "The Pulpit Rock");
x.style.verticalAlign = 'middle';
document.getElementById("PayNow").appendChild(x);
clearInterval(timeint)
}else{
//Create text node
var para = document.createElement("div");
para.id="PayNow";
var node = document.createTextNode("Checkout instantly and securly with ");
para.appendChild(node);
para.style.fontSize = "18px"
var imgContainer = parent.document.getElementsByName("add")[0];
$(para).insertAfter(imgContainer);
//Create Image
var x = document.createElement("IMG");
x.setAttribute("src", "https://i.ibb.co/PhmSS7P/logo-Pay-Now.png");
x.setAttribute("alt", "The Pulpit Rock");
x.style.verticalAlign = 'middle';
document.getElementById("PayNow").appendChild(x);
clearInterval(timeint)
}
},3500)
</script>
