Landing page campaigns

Connect an external landing page to an Appfront campaign

Sometimes it can be very worthwhile to trigger a gift from an external source. For example, if a customer fills out a survey, on the last page, it would be nice to lead the customer to a page where they can leave their details, and this would trigger a gift in their account.

This can be done with the Appfront landing page campaigns.

There are a few steps that need to be done in order to create a landing page campaign:

1. Creating the campaign in the Appfront dashboard by choosing Campaign Trigger: Landing Page Campaign Sign Up. You can choose any promotion for this campaign (coupon, points etc.). Once the campaign was created (after you saved it), you will be able to get the campaign ID from the URL:

2. Create a new group on the Appfront portal. Important- The group name must not contain a space! For example- Newcustomers.

3. Create a web page (any page in your website) which contains a form with the following fields: * Phone number and Email - these fields should be text fields available for the customer to fill. * Group name and Campaign ID (policyId) - copy them from the Appfront portal. * Name: the name of your business, all lower case with no spaces.

You may provide the details to the person who builds the landing page for further review:

signUpForCouponFromLandingPage

POST https://beengo.me/beengo/groupSignup/signUpForCouponFromLandingPage

Request Body

Name	Type	Description
policyId	string	The campaign Id taken from the URL of the Appfront portal
group	string	The name of the group as it appears in the Appfront portal
name	string	Your business name in lower case with no spaces
phonenumber	string	The phone number of the customer signing up
email	string	The email of the customer signing up

200

Successfull response:
{
    "url":"[redirect link to app]", 
    "cntCreated": 0 //0-1 number of created coupons
}

Errored response:
{
    "errCode":1,
    "errMsg": "Missing form details"
}

<script>
$(function() {
    $('form').submit(function(e) { 
        e.preventDefault(); 
        e.stopPropagation(); 
        var $form = $(this); 
        var wrap = $form.closest('div.w-form'); 
        var done = wrap.find('> .w-form-done'); 
        var fail = wrap.find('> .w-form-fail'); 
        $.ajax({ type: 'POST', 
url:'https://beengo.me/beengo/groupSignup/signUpForCouponFromLandingPage', 
                 dataType: 'json', 
                 data: $form.serialize(), 
                 success: function(responseData, textStatus, XMLHttpRequest) { 
                  if (responseData.errCode) { 
                      if (responseData.errCode == 2) {  
                          fail.find('div').text('Sorry, you can\'t sign up twice'); 
                          } 
                          fail.toggle(true);
                       } else {
                           window.location.href = "http://[EDIT HERE]"; //link to app/online ordering refresh
                       }
                   },
                   error: function(responseData, textStatus, XMLHttpRequest) {
                      // Show fail div
                      fail.toggle(true);
		    }
                });
            }
    });
});
</script>

New Location Opening Landing Page

In other cases, for example: a new store opening, you may want to enable customers to actually sign up to a group and register themselves on the platform as "registered users" who will be able to receive marketing by email and text messaging. In order to do this, you will need to mark the campaign as "Consideer signup as a registered customer":

For this option to work, you will need to create a recaptcha in your Google account: https://developers.google.com/recaptcha/intro

and set the required fields in the campaign: Recaptcha Key, Recaptcha Site Key and Recaptcha Projecct Id (as shown in the image above).

Once these fields have been set, you can add them to the request sent to the server in the following way:

$(function() {
  $('form').submit(function(e) {
  	e.preventDefault();
    e.stopPropagation();
    var $form = $(this);
    var wrap = $form.closest('div.w-form');
    var done = wrap.find('> .w-form-done');
    var fail = wrap.find('> .w-form-fail');
    grecaptcha.enterprise.ready(async () => {
      const token = await grecaptcha.enterprise.execute('*****RECAPTCHA SITE KEY*****', {action: 'LOGIN'});
      $form.append('<input type="hidden" name="recaptchaToken" value="' + token + '">');
      $.ajax({
            type: 'POST',
            url:'https://beengo.me/beengo/groupSignup/signUpForCouponExternalResourceWithoutValidation',
            dataType: 'json',
            data: $form.serialize(),
            success: function(responseData, textStatus, XMLHttpRequest) {
              if (responseData.errCode) {
                if (responseData.errCode == 2) {
                  fail.find('div').text('Sorry, you can\'t sign up twice');
                }
                // Show fail div
                fail.toggle(true);
              } else {
                // Redirect to success page
                window.location.href = "*****URL FOR ONLINE ORDERING*****";
              }
            },
            error: function(responseData, textStatus, XMLHttpRequest) {
              // Show fail div
              fail.toggle(true);
        }
        });
    });
    
  });
});

To get the params you will need for recaptcha campaign and index file - please find links below:

API KEY: https://console.cloud.google.com/apis/credentials

SITE KEY: https://console.cloud.google.com/security/recaptcha

PROJECT ID: https://console.cloud.google.com/iam-admin/settings

Please find a template for both types of landing pages in the zip file:

107KB

landingPage.zip

archive