Build and install a chat widget on a Shopify store

What you'll need

  • An installed Shopify store integration

Step one: Create a new chat widget

Make sure you are in the Customer Service section of your workspace before you start.

You can check this by clicking the workspace name in the top left-hand corner of your screen and selecting Customer Service.

  1. Go to Preferences > Chat widgets.

  2. Click Create new chat widget.

  3. Name your chat widget.

  4. Select the Default Language from the drop-down.

  5. Click Ecommerce platforms.

  6. Select your Shopify store from the drop-down.

  7. Click Create new chat widget.

Step two: Style your chat widget

  1. Add styling, branding, display rules, and additional channels to your chat widget.

Branding

In the Branding section, you can configure the following:

  • Brand color

  • Organization logo

  • Dark mode organization logo

  • Font

  • Background type

  • Desktop and mobile display

Targeting and behavior

In the Targeting and behavior section, you can configure the following:

  • Allowed domains

  • Specific page paths

  • Country visibility

Content

In the Content section, you can configure the following:

  • Logo display

  • Header title

  • Header description

  • Footer display

  • Disclosure

  • Launch text and placement

Blocks

In the Blocks section, you can configure the following:

  • Add additional channel buttons

  1. Click Publish.

Step three: Enable your chat widget on your Shopify store

  1. Go to Manage integrations.

  2. Find your Shopify store.

  3. In the Config tab, click Enable sign-up forms. You'll be sent to Shopify.

  4. In the App embeds panel, switch the Bird CRM toggle to off then on. There should be a message at the bottom of your screen that says 'Bird CRM: Marketing activated'.

  5. The chat widget launcher should now be visible in the bottom right-hand side of your store preview in Shopify.

  6. Click Save in the top right-hand corner.

  7. Open your store. The chat widget should be visible.

Last updated

#490: Add Entra ID SCIM settings

Change request updated