HTML: Add the following markup to the page where you want to show Popup.
<div id="my-welcome-message">
<h1>Don't Miss IT!</h1>
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script><!-- r-dev-bdhostit --><ins class="adsbygoogle" style="display: block;" data-ad-client="ca-pub-5794296284274241" data-ad-slot="9118652613" data-ad-format="auto" data-full-width-responsive="true"></ins><script>(adsbygoogle = window.adsbygoogle || []).push({}); </script>
</div>
CSS (pop-style.css)
<!--popup-->
<style>
.popup-signup #mc_embed_signup {
margin: 0px !important;
max-width: 600px !important;
border: 1px solid #ccc !important;
}
</style>
JS (jquery.firstVisitPopup.min.js)
!function(e){"use strict";e.fn.firstVisitPopup=function(t){var i,o=e("body"),n=e(this),c=function(e,t){var i=new Date,o="expires=";i.setTime(i.getTime()+31536e6),o+=i.toGMTString(),document.cookie=e+"="+t+"; "+o+"; path=/"},p=function(e){var t=document.cookie.split(";"),i=0,o="";for(i=0;i<t.length;i++){for(o=t[i];" "===o.charAt(0);)o=o.substring(1,o.length);if(0===o.indexOf(e+"="))return o.substring(e.length+1,o.length)}return!1},f=function(){i.show(),n.show()},r=function(){i.hide(),n.hide(),c("fvpp"+t.cookieName,"true")};o.append('<div id="fvpp-blackout"></div>'),n.append('<a id="fvpp-close">✖</a>'),i=e("#fvpp-blackout"),p("fvpp"+t.cookieName)?r():f(),e(t.showAgainSelector).on("click",f),o.on("click","#fvpp-blackout, #fvpp-close",r)}}(jQuery);
JSON (package.json)
{
"name": "FirstVisitPopup",
"version": "1.1",
"title": "First Visit Popup",
"author": {
"name": "Chris Cook",
"url": "http://chris-cook.co.uk"
},
"licenses": [
{
"type": "MIT",
"url": "MIT-LICENSE.txt"
},
{
"type": "GPLv2",
"url": "GPL-LICENSE.txt"
}
],
"dependencies": {
"jquery": "1"
},
"description": "Shows a message to the user on their first visit to your page.",
"keywords": [
"popup",
"help",
"message"
],
"homepage": "http://chris-cook.co.uk",
"maintainers": [
{
"name": "Chris Cook",
"url": "http://chris-cook.co.uk"
}
],
"files": [
"demo.html",
"jquery.firstVisitPopup.js",
"jquery.firstVisitPopup.min.js",
"readme.md"
]
}
Leave a Reply