Before you can launch Order Confirmed and Order Shipped transactional journeys, you’ll first need to build a draft transactional journey and configure your Shopify site.

On this page

Create and submit your first transactional journey for approval

Before you configure your Shopify integration to work with transactional journeys, build your first transactional journey. Once built, you’ll be able to complete the Shopify configuration.
Note: If you use the templated copy, your journey can be activated immediately.

Enable Ingest Transactional Events in Shopify Plus

Once you’ve enabled the Shopify integration, next enable Shopify to ingest transactional events. Once enabled, Attentive can see transactional events, like completing a purchase, and send transactional messages to subscribers.

Connect Attentive to your Shopify account. You can learn how to here: Shopify integration setup guide.

To enable ingest transactional events:

  1. Navigate to the integration setup page and click the Manage tab.
  2. Click Shopify.
  3. Click the three dots next to the Shopify title and select Edit.
  4. Enable Ingest Transactional Events, and click Update integration in the lower-right corner.

Create transactional sign-up unit

You can only send transactional messages regarding order updates to customers who have opted in to receive them.

If you have already added a Shopify marketing sign-up unit to your checkout page, you can create a Shopify transactional sign-up unit using the Attentive platform by following the steps in this topic. (If not, please continue to work with your client strategy manager to set up your transactional sign-up unit.)

  1. Starting on the Subscribers tab, click + Create sign-up flow.create_sign_up_flow.png
    The Create sign-up flow page displays.
  2. Name the unit.
  3. Choose the Integrations touchpoint.
  4. Select the Shopify Transactional template.
  5. Click Continue.
    create_sign_up_flow1.png
    The Design tab displays.
  6. Review the pre-filled Header and Subcopy text, and make any desired changes.
  7. Click Continue.
    Note: If you haven’t yet set up a transactional journey, a warning displays on the Review & get code tab.
  8. Click each Copy button to copy the code snippets you will need to set up the opt-in unit on your Shopify site. Then paste each one in Shopify. (See Add and set up the opt-in unit in Shopify.)
  9. Click Done.

Add and set up the opt-in unit in Shopify Plus

Once you have the Attentive checkout code (either copied from the transactional sign-up unit you created on the Attentive platform or provided by your client strategy manager), you need to add the code to your opt-in unit in Shopify Plus. 

To add the opt-in checkbox to your Shopify site, you’ll need to update your site with custom code provided by your CSM. If you haven’t yet, reach out to your CSM.


Install the transactional opt-in unit:

  1. Sign in to your myshopify.com account.
  2. Click Online Store from the left sidebar.
    jshop-left-sidebar.png
  3. Click Action on your theme and select Duplicate.
  4. From the Theme Library, click the Actions dropdown for your duplicated theme, and then select Edit Code.
    jshop-edit-code.png
  5. Under Layout, check to see if checkout.liquid exists.
    jshop-layout-liquid.png
    If it does, click it and go to step 6. If you don't see checkout.liquid:
    1. Click Add new layout. Create a new layout form opens.
    2. Select Checkout, and click Create layout.
      jshop-add-layout-checkout.png
      Note: If you don't see checkout as an option, contact your Shopify representative to have it enabled.
  6. Locate the <head> tag. You can typically find this on line 3 or near the beginning of the code.
  7. Copy the Javascript and CSS code snippets your CSM provided and paste it at the end of the <head> section. It should be the very last code before the </head> section.
  8. Locate the <body> section, and paste the HTML for the opt-in unit immediately after

    <div class="main__content"> { content_for_layout }



    And before the closing </div> tag.

    Note: If you have a previous checkbox on your Shopify page, then paste the HTML below the marketing checkbox.
  9. Click Save.
  10. Click Online Store from the left sidebar.
  11. In the Theme Library section, click the Actions dropdown of the theme you duplicated earlier, and click Preview.
    jshop-preview.png
  12. Confirm that the checkbox appears correctly on your checkout screen. If your preview mode supports placing orders, you can also place an order with your phone number and the box checked to text the transactional message.
  13. After coordinating with your CSM, click Publish on the theme in the Theme Library to launch your transactional opt-in unit.

When you publish new themes, ensure that checkout.liquid has been added with the correct script and configuration. Also, take note of any other changes that may go live when you publish from the Theme Library.

Once added, the opt-in checkbox appears on your Shopify checkout page:

jshop-checkbox.png

Disable existing Shopify native SMS alerts

If you want to use Attentive to send transactional messages, you should disable any transactional messages that Shopify itself sends. Otherwise, your customers could receive two or more messages and will create a confusing experience. To disable native Shopify alerts:

  1. From your Shopify site, go to Settings > Checkout.
  2. Scroll to Customer contact, and uncheck the first option in To receive shipping updates.
    jstore-customer-contact.png
    Shopify will no longer send transactional messages to your customers.
  3. Save your changes.