Live Chat Bubble

1. Turn it on

One tiny switch lets you turn on and off bubble chat.

πŸ‘ Let's toggle it on to explore a wide range of options available for you to display your Facebook chat in your Shopify store.

2. Design

Your chat widget does not match your theme color? Don't worry. PingMe can take care of that.

πŸ‘ Or enjoy out chat template here!

  • Go to "Facebook Messenger" section -> "Design" tab.

You can easily change the icon, color, position and message of your bubble chat with real-time preview. Let's see what you can do:

Language

A large number of languages are supported in the app to display text on the message box

Customize tab

One set of chat icons for you to pick

Widget position

Adjust the horizontal position of the chat

Margin bottom

Adjust the vertical position of the chat

Greeting message

Pop-up message box.

Color, style, size

Set up bubble chat style blended with your store

Auto display of the welcome message box

Auto display of the welcome message will avoid the issue of double clicking on the chat icon from Facebook default settings

Custom CSS

Customize button, color, text… by adding CSS code

Here are some identified classes for you:

  • Button: .otFacbookChat .ot-fb-logo.facebook-chat-button

  • Message box: As the Message box is loaded directly from Facebook to an iframe, you can not add CSS to Message box. You can only customize with .otFacbookChat .fb-customerchat.fb_invisible_flow.fb_iframe_widget iframe

Mobile chat type

Select either live chat or redirect to the Messenger page

  • Live chat: Users chat and stay on your store

  • Redirect to Messenger: Users will be redirected to Messenger on their devices

  • And tada! You've got your chat with your style!

3. Behavior

With "Behavior" tab, you can:

  • Set time to show chat bubble

  • Select a specific working dates & time and timezone to show the chat in your store

  • Select a device to show the chat icon

  • Select specific pages to show the chat bubble (for example: most popular product page)

PingMe help: Don't hesitate to contact our support through live chat! We will consult about color setting so you can get the style you want.

Last updated