1. Accéder au thème Shopify

    Screenshot 2024-09-04 at 17.29.28.png

  2. Trouver le fichier d’une page produit

  3. Ajouter le code pour collecter le numéro

<input
  class=""
  type="text"
  id="phone-number"
  name="phone-number"
  placeholder="Numéro de téléphone"
>
<button
  type="button"
  id="whatsapp-button"
  style="display:block;width:100%;font-size:16px;font-weight:700;margin-top:10px;line-height:21px;"
  class="bttn"
  disabled
>
  Recevoir une alerte sur WhatsApp
</button>
  1. Puis ajouter le code qui transmet cette information à Simio
<!-- SIMIO BACK IN STOCK -->
<script>
    const phoneNumberInput = document.getElementById('phone-number');
    const whatsappButton = document.getElementById('whatsapp-button');

    function handleWhatsAppAlert() {
        whatsappButton.disabled = true;
        whatsappButton.textContent = 'Inscription en cours...';

        const phoneNumber = phoneNumberInput.value.trim();
        const customerId = "{{à demander au support}}";

        if (phoneNumber.length > 8) {
          whatsappButton.disabled = true;
          whatsappButton.textContent = 'Inscription en cours...';

          fetch('<https://app.getsimio.com/backinstock/subscribe>', {
              method: 'POST',
              headers: {
                  'Content-Type': 'application/json'
              },
              body: JSON.stringify({
                  phoneNumber: phoneNumber,
                  customerId: customerId,
                  variantId: {{ product.selected_or_first_available_variant.id }},
              })
          })
          .then(response => {
              if (response.ok) {
                  return response.text();
              }
              throw new Error('Erreur lors de la requête.');
          })
          .then(data => {
              whatsappButton.textContent = "C'est noté, on vous préviendra dès son retour !";
          })
          .catch(error => {
              console.error(error);
              whatsappButton.textContent = "Une erreur s'est produite";
          });
      }
  }

    phoneNumberInput.addEventListener('input', function() {
        if (phoneNumberInput.value.trim().length > 8) {
            whatsappButton.textContent = "Recevoir une alerte sur WhatsApp";
            whatsappButton.removeAttribute('disabled');
        } else {
            whatsappButton.setAttribute('disabled', 'true');
        }
    });

    whatsappButton.addEventListener('click', handleWhatsAppAlert);
</script>

<!-- --------- -->
  1. Ajuster le style à votre site