Acquire
  • Home link-arrow
  • Widget link-arrow
  • Customizing the Appearance of Your Chat Widget

Customizing the Appearance of Your Chat Widget


Your Chat Widget may be one of the first interactions a visitor has with your brand. Give them a consistent experience by customizing your widget to reflect your brand’s colors, images, and personality.

In this article:

  • Changing Widget Appearance
  • Selecting Launcher Appearance 
  • Choosing Colors
  • Choosing Position 

Changing Widget Appearance

Turn your widget into a true reflection of your brand. Head to Settings > Messenger Setup > Chat Widget to get started.
In the Appearance tab, choose a launcher icon, primary color, text color, and widget position. Any changes will update in the Widget preview. Press Save Settings to update on your site.

d9N3LvMWalOu1H-mOdkaoWS-k7rPyebcA5RA5jPKIcunMEGTjEIjTcsOb6cLh_2T13zHMA_tUywC7tDEUDcGNviVNUSX2su3SdMjXrCqaY7y8RfIMtKGcSJgLH1qn7qeuGZoN29e

Selecting Launcher Appearance 

Visitors access the widget through the launcher. Make your launcher as visible or discreet as you need it to be.

Regular 

Let your visitor know you’re ready to chat with a catchy message and graphic.


Tpaz9KA6_a_GupA_kTGabhtd1lW0QMpmd5WJT-AbR1JDipzLOJnmlcWSVlOQRQjomKcfyqYsfNtxEnFNGDrVdtbOpytUgZmtFKut94sER4N4ulOlhrPWMuccMye181HEw3O5bDyG

Circle 

Don’t have much space to spare? Use the more subtle, circle launcher. 


DxzDGcNMf1j7K69pcawRmSUtKQvMbEkg1yFp4PamekD-oOzXK4wk8hZZ6hcNxw8oNAs7vPgBFBHwJ6gADPMuHG0Wctx3SJqHPb-OcmJcVc7_REr4cTdZ20qTQS8RgwXdYnHOLshj

Tab 

Use the Tab option to let visitors know they can get in touch via video, voice, or chat. 


IY1J__08htNOvY25MbiSqn-yk4hg7x-8xbRe3QyMOJXQYiNda51hZDKhXlQZPyzQ0zc2qKfo5OgZRfattq9-v7ds0wRfaP-ErkyTBu7f1SoPpj5woz8M4U7HM_Sj3aTaaWAnGx7j

Custom Launcher Icon

Have a brand logo or custom graphic you’d rather use? Custom Launcher lets you choose any picture you want. Upload a jpeg, png, or even a gif. The best part? Your image automatically resizes to fit the circle launcher, so no heavy editing required.

Choosing Colors

Create a branded look by customizing your widget’s color. Primary Color changes your launcher and widget’s background color. Color Scheme changes your launcher and widget’s text. Type in a Hex color code or select a color from the palette.

Tip: Use a dark Primary Color with white, or a light Primary Color with black, to make your messages pop!

Choosing Position 

Choose the position that makes the most sense for your website. All widgets start at the bottom right (0,0).

Got lots of text images on one side of your site? Set your widget’s Alignment to the left or right as needed (measured in pixels).

You can also choose how far left or right with Side Spacing.

Move your widget up with Bottom Spacing.

Click Save Settings when you’ve finished making any changes.

Want more flexibility? Style the widget with Custom CSS by heading to Settings > Messenger Setup > Advanced Settings.


1 Comments

created-by

Calvin

Date :

Hey Guys — We currently use acquire for our website and love it! However, I'm looking for a way to remove the widget from specific pages on our site. How can we make this possible? Thanks! — Calvin


default-user

Related Articles