離脱ポップアップ無料配布中！｜たうビーのアフィリで脱サラ！

たうビー

まず、下のコードをコピーしたら、ワードプレスのフッターウィジェットにカスタムhtmlを入れて、そこにペーストして保存してください。

        HTML Source Code
        
    

        <script>
(function(){
  "use strict";

  // ========= ここだけ編集 =========
  var DISABLE_ON_URL_CONTAINS = "/popup";           // この文字を含むURLでは無効
  var STORAGE_KEY = "exit_popup_empty_shell_v1";   // リセットしたい時は変更
  var SHOW_ONCE = true;                            // 1セッション1回
  var DISABLE_ON_MOBILE = true;                    // モバイル無効
  var TEMPLATE_ID = "exitPopupContentTemplate";    // 中身HTMLの置き場ID
  // ===============================

  // 配布ページでは停止
  try{
    if (DISABLE_ON_URL_CONTAINS && location.href.indexOf(DISABLE_ON_URL_CONTAINS) !== -1) return;
  }catch(e){}

  // モバイル無効
  if (DISABLE_ON_MOBILE && /Mobi|Android|iPhone|iPad|iPod/i.test(navigator.userAgent)) return;

  // 1回だけ判定
  if (SHOW_ONCE){
    try{ if (sessionStorage.getItem(STORAGE_KEY) === "1") return; }catch(e){}
  }

  // --- 空っぽの箱だけ作る ---
  var overlay = document.createElement("div");
  overlay.style.cssText =
    "display:none;position:fixed;inset:0;z-index:999999;background:rgba(0,0,0,.55);" +
    "align-items:center;justify-content:center;padding:16px;box-sizing:border-box;";

  var box = document.createElement("div");
  box.style.cssText =
    "position:relative;max-width:560px;width:100%;background:#fff;border-radius:14px;" +
    "box-shadow:0 12px 40px rgba(0,0,0,.25);padding:16px 18px 18px;" +
    "font-family:system-ui,-apple-system,'Segoe UI',Roboto,'Noto Sans JP',sans-serif;";

  var closeBtn = document.createElement("div");
  closeBtn.textContent = "×";
  closeBtn.style.cssText =
    "position:absolute;top:10px;right:12px;cursor:pointer;font-size:22px;" +
    "line-height:1;color:#666;user-select:none;";

  var content = document.createElement("div");
  content.style.cssText = "margin-top:18px;";

  box.appendChild(closeBtn);
  box.appendChild(content);
  overlay.appendChild(box);
  document.body.appendChild(overlay);

  // 閉じる
  function hide(){
    overlay.style.display = "none";
  }

  // テンプレHTMLを読み込む（無いなら false）
  function fillFromTemplate(){
    var tpl = document.getElementById(TEMPLATE_ID);
    if(!tpl) return false;
    content.innerHTML = tpl.innerHTML;
    return true;
  }

  // 表示
  function show(){
    // ★テンプレが無いページでは出さない
    if (!fillFromTemplate()) return;

    if (SHOW_ONCE){
      try{ sessionStorage.setItem(STORAGE_KEY, "1"); }catch(e){}
    }
    overlay.style.display = "flex";
  }

  // 閉じる操作
  overlay.addEventListener("click", function(e){
    if (e.target === overlay) hide();
  });
  closeBtn.addEventListener("click", hide);
  document.addEventListener("keydown", function(e){
    if (e.key === "Escape") hide();
  });

  // 誤爆防止：少し動いたら有効化
  var armed = false;
  function arm(){ armed = true; window.removeEventListener("mousemove", arm); }
  window.addEventListener("mousemove", arm, { passive:true });

  // Exit intent
  document.addEventListener("mouseout", function(e){
    if(!armed) return;
    var to = e.relatedTarget || e.toElement;
    if(to) return;
    if(typeof e.clientY === "number" && e.clientY <= 0) show();
  }, { passive:true });

  // 手動起動（必要なら）
  window.startExitPopup = show;

})();
</script>

    

たうビー

次に、下のコードをコピーして、内容をお好みで修正したあと、表示させたいページに貼り付けてください。

        HTML Source Code
        
    

        <!-- ポップアップの中身（ここをHTMLだけで自由に編集） -->
<div id="exitPopupContentTemplate" style="display:none;">
  <!-- ===============================
    ここから下に、自由にHTMLを書いてOK
    例：見出し、画像、ボタン、フォームなど全部OK
  =============================== -->

  <!-- 例（消してOK）
  <h2>ここにタイトル</h2>
  <p>ここに本文</p>
  <a href="https://example.com" target="_blank" rel="noopener">ボタン</a>
  -->
</div>

    

たうビー

詳細マニュアルもございます。必要ならば下のフォームからご請求ください！