Exit Intent Popups (triggers after page reload)

25.01.2019

This is not an official built-in feature in the Landingi platform. At the moment the only way to create an exit intent popup is through external scripts. This article will show you one of the many ways you can make it happen.

Note:
This way of creating popups doesn’t require the use of a popup feature. You are creating a popup as an ultimately hidden section of your landing page, which will work as your popup.

1. In the app, go the the Dashboard -> Javascript codes tab of the chosen landing page, add a new script and paste the code below on the main page:

<script>
  !function(e){
    function t(r){if(n[r])
      return n[r].exports;
                  var o=n[r]={exports:{},id:r,loaded:!1};
                  return e[r].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}
    var n={};
    return t.m=e,t.c=n,t.p="",t(0)}
  ([function(e,t,n){
    function r(e){e.preventDefault(),p.toggle("fast"),$(document).off("mouseleave",o)}
    function o(e){e.clientY<0&&p.show("fast")}n(4);
    var i=$(".ml-popup").first(),a=i.find(".container").first(),s=$('<div class="ml-popup-background ml-popup-toggle"></div>'),p=$('<div class="ml-popup-window"></div>');p.hide().append(s).append(i),i.css("display","block"),a.css("display","block"),$("body").append(p);
    var u=$(".ml-popup-toggle");u.on("click",r),$(document).one("mouseleave",o)},
    function(e,t,n){t=e.exports=n(2)(),t.push([e.id,".ml-popup-window{z-index:99999999999999}.ml-popup-background,.ml-popup-window{position:fixed;left:0;right:0;top:0;bottom:0}.ml-popup-background{background-color:rgba(0,0,0,.3)}@media only screen and (min-width:959px){.ml-popup-window{width:960px;margin:5% auto}}@media only screen and (min-width:767px) and (max-width:959px){.ml-popup-window{width:760px;margin:5% auto}}@media only screen and (max-width:767px){.ml-popup-window{width:320px;margin:5% auto;overflow:scroll}}",""])},
    function(e,t){e.exports=function(){
      var e=[];
      return e.toString=function(){
        for(var e=[],t=0;t<this.length;t++){
          var n=this[t];n[2]?e.push("@media "+n[2]+"{"+n[1]+"}"):e.push(n[1])}
        return e.join("")},e.i=function(t,n){"string"==typeof t&&(t=[[null,t,""]]);for(
        var r={},o=0;o<this.length;o++){
        var i=this[o][0];"number"==typeof i&&(r[i]=!0)}for(o=0;o<t.length;o++){
          var a=t[o];"number"==typeof a[0]&&r[a[0]]||(n&&!a[2]?a[2]=n:n&&(a[2]="("+a[2]+") and ("+n+")"),e.push(a))}},e}},
    function(e,t,n){
      function r(e,t){
        for(var n=0;n<e.length;n++){
          var r=e[n],o=c[r.id];
          if(o){o.refs++;
                for(var i=0;i<o.parts.length;i++)o.partsi;
                for(;i<r.parts.length;i++)o.parts.push(u(r.parts[i],t))}
          else{for(var a=[],i=0;i<r.parts.length;i++)a.push(u(r.parts[i],t));c[r.id]={id:r.id,refs:1,parts:a}}}}
      function o(e){
        for(var t=[],n={},r=0;r<e.length;r++){
          var o=e[r],i=o[0],a=o[1],s=o[2],p=o[3],u={css:a,media:s,sourceMap:p};n[i]?n[i].parts.push(u):t.push(n[i]={id:i,parts:[u]})}
        return t}
      function i(e,t){
        var n=v(),r=x[x.length-1];
        if("top"===e.insertAt)r?r.nextSibling?n.insertBefore(t,r.nextSibling):n.appendChild(t):n.insertBefore(t,n.firstChild),x.push(t);
        else{if("bottom"!==e.insertAt)
          throw new Error("Invalid value for parameter 'insertAt'. Must be 'top' or 'bottom'.");n.appendChild(t)}}
      function a(e){e.parentNode.removeChild(e);
                    var t=x.indexOf(e);t>=0&&x.splice(t,1)}
      function s(e){
        var t=document.createElement("style");
        return t.type="text/css",i(e,t),t}
      function p(e){
        var t=document.createElement("link");
        return t.rel="stylesheet",i(e,t),t}
      function u(e,t){
        var n,r,o;
        if(t.singleton){
          var i=b++;n=g||(g=s(t)),r=l.bind(null,n,i,!1),o=l.bind(null,n,i,!0)}
        else e.sourceMap&&"function"==typeof URL&&"function"==typeof URL.createObjectURL&&"function"==typeof URL.revokeObjectURL&&"function"==typeof Blob&&"function"==typeof btoa?(n=p(t),r=f.bind(null,n),o=function(){a(n),n.href&&URL.revokeObjectURL(n.href)}):(n=s(t),r=d.bind(null,n),o=function(){a(n)});
        return r(e),function(t){
          if(t){
            if(t.css===e.css&&t.media===e.media&&t.sourceMap===e.sourceMap)
              return;r(e=t)}
          else o()}}
      function l(e,t,n,r){
        var o=n?"":r.css;
        if(e.styleSheet)e.styleSheet.cssText=y(t,o);
        else{
          var i=document.createTextNode(o),a=e.childNodes;a[t]&&e.removeChild(a[t]),a.length?e.insertBefore(i,a[t]):e.appendChild(i)}}
      function d(e,t){
        var n=t.css,r=t.media;t.sourceMap;
        if(r&&e.setAttribute("media",r),e.styleSheet)e.styleSheet.cssText=n;
        else{
          for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(n))}}
      function f(e,t){
        var n=t.css,r=(t.media,t.sourceMap);r&&(n+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(r))))+" */");
        var o=new Blob([n],{type:"text/css"}),i=e.href;e.href=URL.createObjectURL(o),i&&URL.revokeObjectURL(i)}
      var c={},h=function(e){
        var t;
        return function(){
          return"undefined"==typeof t&&(t=e.apply(this,arguments)),t}},m=h(function(){
            return/msie [6-9]\b/.test(window.navigator.userAgent.toLowerCase())}),v=h(function(){
            return document.head||document.getElementsByTagName("head")[0]}),g=null,b=0,x=[];e.exports=function(e,t){t=t||{},"undefined"==typeof t.singleton&&(t.singleton=m()),"undefined"==typeof t.insertAt&&(t.insertAt="bottom");var n=o(e);return r(n,t),function(e){
            for(var i=[],a=0;a<n.length;a++){
              var s=n[a],p=c[s.id];p.refs--,i.push(p)}
            if(e){
              var u=o(e);r(u,t)}
            for(var a=0;a<i.length;a++){
              var p=i[a];if(0===p.refs){
                for(var l=0;l<p.parts.length;l++)p.parts[l]();
                delete c[p.id]}}}};
      var y=function(){
        var e=[];return function(t,n){
          return e[t]=n,e.filter(Boolean).join("\n")}}()},
    function(e,t,n){
      var r=n(1);"string"==typeof r&&(r=[[e.id,r,""]]);n(3)(r,{});r.locals&&(e.exports=r.locals)}]);
</script>

2. Create a section, which will serve the purpose of your popup. Give the section a class ‘ml-popup‘.

ml-popup class

*Exit intent popups work on desktop devices only.
*When the popup is open, clicking anywhere else closes the popup.

Was this article helpful?

Can’t find what you need?

Let us help you!
Send us a message
We are using cookies for analytical purpose. Learn more.