Triggering Attentive Forms on Mobile From a Digioh Form

Attentive offers OTP (one-time password) functionality for their opt-in forms and Digioh customers often like to have the Attentive form display on mobile for the SMS opt-in step as OTP creates a better customer experience when opting in on mobile. This document will teach you how to trigger an Attentive form after the email step of a Digioh form fires. Please note that this is only triggering the Attentive form on mobile and the SMS step will remain on the Digioh form for Desktop.

The final workflow is:
Desktop: Digioh email collection page, Digioh SMS collection page, Digioh Thank You page
Mobile: Digioh email collection page, trigger Attentive SMS collection form, Attentive thank you page

One important piece to understand is that this means the Attentive form will not trigger if the email is known since the email form would have conditions excluding it from known subscribers. There is no way to trigger the SMS step without the email step first.

In order to properly trigger the Attentive form, you need 3 things:

1) The Attentive form ID, sometimes called the creative ID.
2) This guide from Attentive.
3) If any other platform was previously triggering an Attentive form, that setup needs to be deleted/turned off in Attentive AND any code on the site from that previous platform needs to be removed to avoid code conflicts.

To configure a Digioh Campaign to fire an Attentive form, do the following:

1. On the mobile breakpoint’s email collection page, set the Form’s After Submit Action to close the box
2. Add a new JS Snippet with an event trigger of “After Submit” and paste the following snippet:
   

   if (api.isMobile()) {
   (function openAttentiveWhenReady(retryCount = 0) {
   const MAX_RETRIES = 20; // 20 × 150 ms ≈ 3 seconds
   const ATTENTIVE_ID = 295448; // the creative you want to show
   // NOTE: access parent window, not iframe window
   const attn = window.parent && window.parent.__attentive;
   if (attn && typeof attn.trigger === 'function') {
   window.parent.__attentive.trigger("true");
   //attn.trigger(null, null, x.email, ATTENTIVE_ID); // open the pop-up
   window.parent.scrollTo(0, 0);
   return;
   }
   if (retryCount < MAX_RETRIES) {
   setTimeout(() => openAttentiveWhenReady(retryCount + 1), 150);
   } else {
   console.error('Attentive not available after waiting ~3 s');
   }
   })();
   }

   
   Please Note: If your campaign is more than an email and SMS collection, you may need to add additional logic to ensure the Attentive popup only fires after the email collection page.