{"id":84,"date":"2017-02-21T05:15:14","date_gmt":"2017-02-21T13:15:14","guid":{"rendered":"https:\/\/hengreamaze.wordpress.com\/2017\/02\/21\/deep-customer-integration-for-bigcommerce\/"},"modified":"2023-08-31T05:27:27","modified_gmt":"2023-08-31T12:27:27","slug":"deep-customer-integration-for-bigcommerce","status":"publish","type":"post","link":"https:\/\/www.reamaze.com\/blog\/deep-customer-integration-for-bigcommerce\/","title":{"rendered":"Deep Customer Integration for BigCommerce"},"content":{"rendered":"

How to engage and wow customers using Reamaze!<\/strong><\/p>\n

Every once in a while we like to show off the amazing flexibility and deep integration capabilities of Reamaze with many of our partners. Today, we\u2019re going to show you a few ways you can deeply integrate customer data with customer conversations using our BigCommerce integration.<\/p>\n

Reamaze\u2019s deep customer integration will allow you to:<\/p>\n

    \n
  1. Enable customers to engage with you whenever they need assistance as they\u2019re browsing your store through real time messaging or live chat<\/a><\/li>\n
  2. Instantly access customer order information from BigCommerce<\/li>\n
  3. Add crucial customer data through custom attributes either manually or programmatically with the Reamaze API<\/a> and display the data for your customer service agents<\/li>\n
  4. Automate your customer service team using workflows<\/a> based on custom attributes or form fields.<\/li>\n<\/ol>\n


    \nGetting Started<\/strong><\/h2>\n

    You\u2019ll obviously need a BigCommerce account to get going. If you\u2019re already a store owner on the BigCommerce platform, you\u2019re already good to go!<\/p>\n

    \"\"<\/figure>\n

    Head on over to the \u201cApps\u201d section and click on \u201cMarketplace\u201d. Look for the Reamaze app<\/a> and \u201cConfirm\u201d to install the app to your BigCommerce dashboard.<\/p>\n

    \"\"<\/figure>\n

    If you already have a Reamaze account, go ahead and log in directly. If not, Reamaze will help create one for you based on your BigCommerce credentials. The first screen you\u2019ll see after logging in will be some simple instructions to get the default Reamaze Shoutbox<\/a> embedded onto your store.<\/p>\n

    \"\"<\/figure>\n

    Follow our instructions here<\/a> on how to edit your BigCommerce theme files. You\u2019ll need to access the base.html file for Stencil templates by making a copy of the theme you\u2019d like to use.<\/p>\n

    Once you have access to base.html, you\u2019ll want to paste the code provided to you in the step above above the <\/head> tag. See the highlighted section below for reference.<\/p>\n

    \"\"<\/figure>\n

    After you\u2019ve saved the changes, go ahead and apply the template for your store and take a sneak peak. You should see the default Reamaze Shoutbox now installed on your store front. The Shoutbox follows the customer as they\u2019re browsing your store and offers them easy access to help when they need it.<\/p>\n

    \"\"<\/figure>\n


    \nGetting Setup<\/strong><\/h2>\n

    We\u2019ll skip ahead a few step at this point and customize the Reamaze Shoutbox some more. You can watch a video tutorial on how to do that here<\/a> and here<\/a>. What we did was the following:<\/p>\n

      \n
    1. We changed the color, size, and welcome prompt of the Shoutbox trigger icon<\/li>\n
    2. We changed the color of the Shoutbox itself by going to the brand customization section in Reamaze<\/li>\n
    3. We added several custom form fields to collect more information from the customer. A dropdown menu will ask the customer which department they\u2019d like to reach. A checkbox will ask if the customer would like to be subscribed to the newsletter. A hidden field will track where the customer was when he\/she decided to reach out. We\u2019ll show you how these fields come into play later on.<\/li>\n<\/ol>\n
      \"\"<\/figure>\n

      Once you\u2019ve copied the new Shoutbox JavaScript code displayed above, you\u2019ll want to repeat the previous steps and replace the code above the <\/head> tag. See the highlighted section below for reference. Remember, you\u2019ll need to edit the template copy\u2019s base.html file.<\/p>\n

      \"\"<\/figure>\n

      You\u2019re almost ready to start testing! Before you do, let\u2019s make sure you have a record of a customer and a purchase under his\/her name. You can create a test order for a test customer. BigCommerce has a few tutorials on this here<\/a> and here<\/a>.<\/p>\n

      We\u2019ve created a manual order for a new customer named Chris Customer. He ordered an item called \u201cSchool Kicks\u201d at $50. We also see his name, email, address, order ID, payment information, and shipping information.<\/p>\n

      \"\"<\/figure>\n

      To start testing, go ahead and preview your store site with the new Shoutbox deployed. If done correctly, you\u2019ll see the new trigger, Shoutbox, and custom form fields.<\/p>\n

      We then pretend to be Chris and initiate a customer service request through the Shoutbox. This step is crucial because you need to make sure that the name and email of the customer matches the manual order you created within BigCommerce.<\/em> The data is synced using these two fields so make sure to double check!<\/p>\n

      When ready, feel free to submit the inquiry as the customer.<\/p>\n

      \"\"<\/figure>\n
      \"\"<\/figure>\n
      <\/figure>\n

      When you receive Chris\u2019 real time message as the customer service agent on the BigCommerce dashboard, you can instantly access Chris\u2019 most relevant information:<\/p>\n