Home / eCommerce / pop-up na ‘nu kopen’
Duplicate Snippet

Embed Snippet on Your Site

pop-up na ‘nu kopen’

Nu kopen button laat pop-up zien en geeft link naar winkelmandje

Code Preview
php
<?php
add_action('wp_footer', function () {
    ?>
    <script>
    document.addEventListener('click', function (e) {
      if (e.target.matches('a.add_to_cart_button')) {
        setTimeout(function () {
          showCartPopup();
        }, 500);
      }
    });
    function showCartPopup() {
      // voorkom dubbele popups
      if (document.getElementById('cart-popup')) return;
      const popup = document.createElement('div');
      popup.innerHTML = `
        <div id="cart-popup" style="
          position: fixed;
          top: 20%;
          left: 50%;
          transform: translateX(-50%);
          background: white;
          border: 2px solid #444;
          padding: 20px;
          z-index: 9999;
          text-align: center;
          box-shadow: 0 0 20px rgba(0,0,0,0.3);
          font-family: sans-serif;
          max-width: 300px;
        ">
          ✅ De cursus is toegevoegd aan je winkelmandje!<br><br>
          <a href="/winkelmand" style="background: #444; color: white; padding: 10px 15px; text-decoration: none; border-radius: 4px;">👉 Ga naar winkelmand</a><br><br>
          <button onclick="document.getElementById('cart-popup').remove()" style="margin-top:10px;">✖ Sluiten</button>
        </div>
      `;
      document.body.appendChild(popup);
    }
    </script>
    <?php
});

Comments

Add a Comment