Overview

Before you start engaging your customers via SMS (and MMS), you need to gain their permission to contact them on their phones. To collect phone numbers, set up a web modal that allows your shoppers to enter their phone numbers and opt-in for your SMS communications.

Set up a Web Modal for SMS Opt-in

You can either add a phone number field to an existing form in a web modal or create a brand new modal and form for phone number collection.

In the example below, you'll see how to set up a Zaius web modal for phone number collection from scratch.

Step 1: Create a New Web Modal

Create a new web campaign and add a web modal as your first touchpoint.

Under Targets, define which website visitors will see your web modal.

Screen_Shot_2020-04-02_at_1.27.19_PM.png

Step 2: Set up Opt-in Form

Design the layout of your web modal. You’ll need to have the following elements from under the Forms section for data collection to work:

Two text boxes: One for email, the other for phone number collection
Checkbox
Submit button

Step 3: Configure Opt-in Fields

Email Address Field

Switch to the Details tab. Under Text Box Actions, select Email as the Field. This will automatically make the field required.

Screen_Shot_2020-04-01_at_5.18.18_PM.png

Phone Number Field with Country Code Selector

For the second text box, select Phone as the Field. When you assign a field to collect phone numbers, you will see additional options under Text Box Actions. By default, Show Country Code and Enable Country Code Selection are enabled, and the United States is selected as the Default Country Code. We recommend you leave the country code selector enabled because it helps your visitors tremendously with proper phone number formatting and eliminates confusion.

Finally, make sure the field is Required.

Screen_Shot_2020-07-20_at_11.09.47_AM.png

Checkbox

Edit and style the label by the checkbox. Under Details, pick Opt-in as the Action for the checkbox and make it required. This will ensure that your visitors are properly opted-in to receive email and SMS communications from you.

Screen_Shot_2020-07-20_at_11.13.10_AM.png

Submit Button

Under Details, select Confirmation Design as the follow-up action to your button, so you’re not interrupting your visitor’s journey on your site.

Screen_Shot_2020-07-20_at_11.14.35_AM.png

Step 4: Preview Web Modal

To preview your web modal, open up the Triggers section and check the box for Display immediately when the page loads.

Screen_Shot_2020-03-24_at_3.50.23_PM.png

Now, click the Preview button, then enter the webpage URL where you’d like to see the web modal. Click Generate Preview.

Screen_Shot_2020-07-20_at_11.17.06_AM.png

Step 5: Create a Confirmation Message

As a best practice, you should also create an SMS campaign that will send a confirmation message to your new SMS subscribers. We recommend that you launch this campaign before you make you web modal live.