What You Need:

 

Summary

Learn how to create a popup window to encourage shoppers to sign up for your email, and reward them with a coupon to use online. In this example, the popup window will display on the home page to all shoppers, offering them a 10% coupon on their next purchase for signing up for emails.

  1. Examples
  2. Configure Pop-Up+ for NRO
  3. Configure the Promo Code
  4. Configure the Email in Customer Connect
  5. Notes
  6. Using Constant Contact

 

Examples

Example of a popup window with Customer Connect signup form:

ccpop

 

 

Example of welcome email with promo code that the shopper receives after signing up for your email list:

 

Configure Pop-Up+ for NRO

In this section, you'll create the content for the pop-up window to display on the home page:

  1. In NRO, select CMS / Popup Management to create a new popup window.
  2. On the General tab, choose to display the popup only on your home page, and only 3 times per customer. Note that views are dependant on browser cookies, so if a shopper clears their cookies or views your site from another computer, then they would see the popup again regardless of settings here.
  3. In Customer Connect, select Manage / Subscribe Options and click the button entitled 'Click Here for HTML Form Code'.
  4. In NRO, paste this form code into the Content tab of the new popup window, and modify as you see fit. This form code contains your unique merchant ID. While much of the code can be edited to meet your needs, it's important to keep the merchant ID (shown in blue in the sample code below).
  5. Sample Code:
    <div style="text-align: center;">
    <p><img src="/media/NCR/celebrity/banner1.jpg" alt="Sign Up &amp; Save" /> </p>

    <br />
    <p><span style="font-weight: bold; font-size: 16px;">Newsletter Sign Up</span></p>
    <p>Sign up for our email newsletter to stay in-the-know about all of our sales and in-store events</p>
    <p>&nbsp;</p>
    <!-- START NCR CUSTOMER CONNECT FORM --><form id="radCCSubscribe" action="https://www.radiantretailapps.com/CustomerConnect/OptIn.aspx" method="post" target="_blank"><input id="email" class="footer .footer-subscribe .subscribe-input" style="width: 150px; vertical-align: top;" onfocus="value=&quot;&quot;" type="text" name="email" value="enter your email" /><button class="button" title="Subscribe" type="submit"><span style="padding: 2px 20px;">Sign Up</span></button><input id="a" type="hidden" name="a" value="???????????????????" /></form><!-- END NCR CUSTOMER CONNECT FORM -->
    </div>

 

Configure the Promo Code

In this section, you'll create a promo code that gives the shopper 10% of their next purchase:

  1.  In NRO, select Promotions / Shopping Cart Price Rules and create a new price rule.
  2. On the Rule Information tab, specify a coupon code to use (for example EMAILWEB), and only allow it to be used once per customer. Also include the specific customer categories that would be able to use this promo code. It's usually best to exclude the 'Not Logged In' customer groups, so that shoppers can only use the promo code if they're logged in to their account on your storefront.

  3. Because the promo code can only be used when shoppers are logged in, consider tweaking cart messages using the Inline Translation features to improve the usability. For example, on the cart page, you could change the label to "Enter your coupon code if you have one.<br /><strong>Please <a href='/customer/account/login/'>log in</a> first.</strong>". You may also want to include similar messaging within the email itself encouraging shoppers to log in first.
  4. On the Actions tab,choose the discount amount, and in most cases you want to prevent additional rules from applying (to prevent shoppers from using multiple discounts at the same time).

 

Configure the Email in Customer Connect

In this section, you'll create and schedule the email including the promo code that gives the shopper 10% of their next purchase:

  1. In Customer Connect, create a new campaign and email to send to all new signups.
  2. On Step 2, enter the promo code you defined in NRO, for example EMAILWEB. Entering the promo code here is only necessary if you plan to use the ##CPOnlinePromoCode## variable to dynamically reference the promo code in the email. Note that CPOnline is our legacy ecommerce platform. Although the wording is specific to CPOnline, the functionality works the same for NRO too — Customer Connect will dynamically insert the promo code into the ##CPOnlinePromoCode## variable, regardless of the source.

  3. On Step 4, choose the New Opt Ins segment. New opt-ins include anyone who joined your email list within the past 3 days.


  4. On Step 8, schedule the email to be sent each night at a specific time, with no end date.


  5. On Step 8, choose to send this email no more than one time to each recipient.

 

Notes

  • If you are using the responsive theme with Pop-Up+ for NRO:
    • Recommended maximum width of the popup content is 290px wide (or more only if you are strongly skilled in responsive css design)
    • Due to a layering issue, you may see the cart icon on top of the modal pop-up window, instead of behind it. To alter the layering, you'll need to attach a static block via a widget to the Page Header of All Pages (or just the home page if that's the only place you're using a pop-up window).

      <!-- ADJUST CART ICON LAYERING -->
      <script>

          jQuery(document).ready(function($){

             $('.wrapper').append($('#aw_popup_wraper'));

             $('.wrapper').append($('#aw_popup_window'));

          });

      </script>

  • Emails are sent each night at a scheduled time, therefore the shopper will not recieve the email with the promo code instantly. It may take up to 24 hours for the shopper to receive the email, due to travel time to pass data first from NRO to Counterpoint, and then from Counterpoint to Customer Connect.
  • The email with the promo code will be sent when a shopper opts-in to your email list from your website, even if the email is already on your list from Counterpoint. The promo code itself should be limited to one use per customer (and only people with existing accounts, so Guest shoppers can’t use it).

 

Notes on Using Constant Contact or other email marketing tools

Although this article describes how to use Pop-Up+ with Customer Connect, similar concepts could be used with other third-party email marketing services, such as Constant Contact. Note that NCR can only offer LIMITED assistance with third-party email marketing tools, and it may require advanced skills to set it up.

Basic steps for embedding a Constant Contact signup form in a popup window:

  1. Log into your Constant Contact account and select List Growth Tools
  2. Create a new signup form, or embed an existing form by selecting Actions / Embed Codeconstant contact
  3. Copy the embed code and paste into a new page in NRO (CMS / Pages) named email-signup
  4. Edit the page contents as desired (the contents of this page will ultimately display in the popup window)
  5. For best results, on the Design tab of this email-signup page, change the Layout to Empty which will suppress the standard header, footer, and all default page elements on this page (so ultimately the site header, etc. won't display in the popup window).
  6. Create a new pop-up window as described above
  7. In the popup content area, use an HTML iframe reference similar to the following, where the iframe source references your site URL and the new page you created in step 3; CSS added for responsive breakpoints but can be adjusted as necessary:
    <div style="width:100%; max-width:450px; height:350px; position:relative;">
      <iframe src="http://www.YOURSITE.com/email-signup" width="100%" max-width:450px; height="350" frameborder="0" style="position:absolute; top:0px; left:0px;"></iframe>
    </div>
    <style>

    @media screen and (max-width: 480px) {
      #aw_popup_window {
        width:100% !important;
        left:0px !important;
       margin-left:0px !important;
       padding:0px;
      }
    }
    .main {
    position:relative;
    z-index:600;
    }

      #aw_popup_header {
        position:relative;
        z-index:400;
      }
      #aw_popup_window {
        background:transparent;
        border:none;
      }
      iframe:focus {
          outline: none;
      }

      iframe[seamless] {
          display: block;
      }
    </style>
  8. more here

For more information on embedding a Constant Contact email signup form on your site, see Embeddable Signup Forms and How To Modify Embed Code in Constant Contact's Help Center