Setting up the Direct Add Image Tag and Adding It to Your Site

Once you have a clear understanding of how the Direct Add URL works, you can begin generating a Direct Add image tag to use on your site.

Procedure

  1. Go to Settings > Platform Settings > Data Exchange.
  2. Check the Enable Direct Add for adding new contacts box.
  3. Optional: Select a status from the Add contacts with the following status pull-down to give contacts that are added via Direct Add (or existing contacts that are updated via Direct Add) one of the following statuses:
    • Onboarding: Contacts with a status of Onboarding are new contacts who are waiting to be sent their first marketing email from you. Once they are sent their first marketing email from you, they will enter the automated onboarding process. After they complete the automated onboarding process, their status is switched to Active.
      Note: Existing Active contacts retain the status of Active.
    • Unconfirmed: Contacts with a status of Unconfirmed have not yet agreed to receive marketing emails from you. Remember, one of our policies is that contacts must agree to receive marketing emails from you in order for you to send to them.
      Note: Unconfirmed contacts must complete a Subscription Confirmation Webform for their status to change to Active.
    • Transactional: Contacts with a status of Transactional can only be sent transactional emails. A transactional email facilitates an agreed-upon transaction, or updates a customer in an existing business relationship. The primary purpose of the email must be transactional in both the subject line and body. It is permissible to mix in a marketing message/offer in the body. But if a marketing message/offer is added it cannot be the primary purpose of the email and must be included after the transactional content. The marketing portion can be up to 50% of the message as long as it is below the transactional content in the message. Examples of transactional emails include order confirmations, shipping notices, changes in account status, etc. Transactional emails are exempt from CAN-SPAM compliance in the US, but we suggest that all transactional emails adhere to our suggested best practices. For more information on Transactional Emails, see Transactional Emails.

    This setting only applies to contacts being added via Direct Add with the generated URL and does not apply to contacts being added to the application by other means (manual creation, import, etc.).

    For more information on contact status, see Contact Status.

  4. Optional: Check the Send a welcome message box to send a welcome message. If you choose to send a welcome message, you will need to do the following:
    1. Select when to have the welcome message sent using the pull-down menu. You can select:
      • Only when the contact being added is new.
      • Every time the direct add URL is used.
    2. Click Pick.
    3. Click in the row associated with the message you want to use as the welcome message.
      Note: If you chose to add contacts with a status of unconfirmed, the message you choose to send will need to have been approved for transactional sending. For more information on getting an email message approved for transactional sending, see Request Transactional Message Approval.
    4. Click Select.
    5. Add a from name in the From Name text box.
    6. Add a from address in the From Address text box.
  5. Optional: Check the Create Tracking Cookie box.
    Checking this box will ensure that each time a contact is added using Direct Add, a cookie gets created for that contact. The cookie is used to identify the contact for the purpose of associating actions with them, such as placing orders or using direct update.
  6. Copy the generated Direct Add img tag and add it to a page on your site.

    The settings you selected above are used to dynamically generate a Direct Add img tag that you can copy and use on your site. The settings you select will not be saved when you leave the Data Exchange page.

    Warning: If you are using a private domain and also use https, you need to set the start of your src value to be https://app.bronto.com:
    • Change the URL in the Direct Add img tag src attribute to use https.
    • Change the domain in the Direct Add img tag src attribute to app.bronto.com.
  7. Add any field, keyword, and list parameters to the URL that you want to pass back to the application.

    The email parameter is included on the Direct Add URL by default.

    For more information on adding field data to the Direct Add URL, see Adding Field Data to the Direct Add URL.

    For more information on adding list data to the Direct Add URL, see Adding Contacts to Lists When Using Direct Add.

    For more information on adding mobile number and SMS keyword data to the Direct Add URL, see Adding Contacts to SMS Keywords When Using Direct Add.

  8. Add values to the email, field, keyword, and list parameters.
    There are a number of ways you can accomplish this, with the most common being using JavaScript. The example below is of a form that a user can fill out and be added to Bronto using the Direct Add URL. The page contains JavaScript that populates the Direct Add URL with the appropriate data. You may need to scroll to the right to see the entire code example below:
    <!DOCTYPE html>
    <html lang="en">
      <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <meta charset="utf-8">
        <title>New Contact Form</title>
      </head>
      <body>
        <div class="container">
    
        <div class="container">
          <div class="row">
            <div class="span12">
              <h1 class="text-center">Email Sign Up</h1><br />
        <form class="form-horizontal" onsubmit="directAdd()">
          <div class="form-group">
            <label for="first_name" class="control-label col-xs-4">First Name</label>
            <div class="col-xs-8">
              <div class="input-group">
                <div class="input-group-addon">
                  <i class="fa fa-address-card"></i>
                </div>
                <input id="firstname" name="first_name" type="text" class="form-control">
              </div>
            </div>
          </div>
          <div class="form-group">
            <label for="last_name" class="control-label col-xs-4">Last Name</label>
            <div class="col-xs-8">
              <div class="input-group">
                <div class="input-group-addon">
                  <i class="fa fa-address-card"></i>
                </div>
                <input id="lastname" name="last_name" type="text" class="form-control">
              </div>
            </div>
          </div>
          <div class="form-group">
            <label for="email" class="control-label col-xs-4">Email</label>
            <div class="col-xs-8">
              <div class="input-group">
                <div class="input-group-addon">
                  <i class="fa fa-address-card"></i>
                </div>
                <input id="email" name="email" type="text" class="form-control" required="required">
              </div>
            </div>
          </div>
          <div class="form-group">
            <label for="checkbox" class="control-label col-xs-4"></label>
            <div class="col-xs-8">
              <label class="checkbox-inline">
                <input type="checkbox" name="checkbox" value="1" id="msgpref">
                      I want to hear about special offers and promotions. See our <a href="#">Privacy Policy</a> and <a href="#">Terms of Service</a>.  
              </label>
            </div>
          </div>
          <div class="form-group row">
            <div class="col-xs-offset-4 col-xs-8">
              <button name="submit" type="submit" class="btn btn-primary">Sign Up</button>
            </div>
          </div>
        </form>
      </body>
      <script type="text/javascript">
      function directAdd() {
        var firstname = document.getElementById('firstname').value;
        var lastname = document.getElementById('lastname').value;
        var email = document.getElementById('email').value;
        var msgpref = document.getElementById('msgpref').value;
        document.writeln('<img src="http://public_domain/public/?q=direct_add&fn=Public_DirectAddForm&id=UNIQUEID&email='+email+'&field1=firstname,set,'+firstname+'&field2=lastname,set,'+lastname+'&field3=msgpref,set,'+msgpref+'&list4=33333ec000000000000000000000003f3comment=WebSignUp" width="0" height="0" border="0"/>');
    }
       </script>
    </div>
    </div>
    </div>
    </div>
    </html>