How to Add Facebook Chat to a Google Sites Website

2023-02-14

Google power users looking to integrate and enhance their omnichannel communication experience can use the Facebook Chat feature directly on their Google Sites website so that customers can keep in touch in a way that is familiar to them. 

Today, that’s a critical element for consumers-- getting help their way. 

If your brand can’t deliver the right solutions, including offering live chat through Facebook’s Messenger platform and Chat plugin, your audience will go elsewhere. 

In this guide, we’ll provide you with a step-by-step guide on how you can integrate Facebook Chat on your website when it’s hosted by Google Sites so that you are always ready to deliver the true omnichannel, personalized experience your customer demands. (And if you just don’t have the time or energy for one more messaging tool, we’ll cover how our live chat agents at Smith.ai can handle it for you so that you can get back to business.)

There are over 4 billion social media users around the world. 

Of those, more than half prefer to use social media to contact a business. People feel more of a dedicated, personal connection and they often feel they get a better resolution to their issues when using social media. And now that Messenger is a totally separate app from Facebook, customers love when brands add it straight to their website. 

So, how can you do it? We’ll cover everything you need to know here. 

First, though, let’s talk about the modern age of customer service and take a look at the numbers behind omnichannel and social media communications. 

Social media and customer service: by the numbers 

  • 20 billion + messages are exchanged between consumers and businesses every single month on Messenger
  • 46% of all consumers surveyed reported preferring live chat to other means of contacting a business
  • Messenger and other live chat tools can increase engagement by more than 15 times compared to other means of communication
  • 35% of consumers preferred social media communication in 2019
  • That number is closer to 65% as of 2021

Today’s consumer is changing the customer service landscape. They're demanding brands that come to them and deliver solutions where they are for that personalized connection that they crave. Now that you understand that a little better, let’s take a look at how you can install the Facebook Chat plugin on your Google Sites webpage to keep your audience in contact. 

The Facebook Chat plugin

The highlights:

  • Google Sites integrates with Facebook Chat through the standard integration
  • The plugin ensures that chats transition between brand websites and the Messenger platform seamlessly
  • Features include availability scheduling, away messages, FAQs, and auto-replies
  • Guest Mode allows all users to connect with brands via Facebook Chat
  • Installation is as easy as modifying your Page settings and dropping in a line of code 

This open-source tool offers integrations for some specific hosts and website providers like WordPress and Wix, but it’s also got a general installation process for all websites that you can use if you’re hosting on a Google Sites page. 

Just log in to your Facebook Pages account on the computer that you’re using to set up the Chat plugin, and you’ll be ready to go. With a few tweaks to your Pages settings and a snippet of JavaScript code, your website will render a Messenger bubble that loads in the bottom right corner of the screen:


This plugin will work on almost all desktop browsers and mobile devices, except Internet Explorer. It will also not work with Messenger in-app browsers. However, it can automatically save and load recent chats and can sync everything between your Facebook inbox and Messenger app so that you can see your conversations no matter where you access them from. 

The installation process

There are two basic steps to this process: changing your settings and dropping the code. Facebook even walks users through the process at the Business Help Center. Of course, we’re going to cover it all right here to save you the extra step. 

There is not yet a dedicated Chat Plugin installation process for Google Sites pages just yet, but the basic installation process is straightforward enough. 

  1. Settings. First, you’ll need to navigate to your Facebook Page and find the “Settings” section. This will give you access to the rest of the settings that you need to modify. 
  2. Messaging. Then, find the “Messaging” link and click “Add Messenger to Your Website” to let Facebook know you want to integrate the Chat feature. 
  3. Get Started. Click “Get Started” and follow the prompts to get to the setup stages. 
  4. Set Up. Select a language in the setup section and change any other variables that you want. You can even go to the “Set Up Conversation” section and set auto-replies, FAQs, and more. 
  5. Copy JavaScript. Copy the code that you will need to put into the pages on your site where you want the Facebook Chat plugin to appear. 

*An IMPORTANT Note: Although the option is offered, Facebook and Smith.ai both recommend that you leave the location of the chat icon (lower right corner) alone in the settings. This is where users expect to find live chat buttons and moving it will only confuse them and make the feature less useful. 

Once you’ve got the line of code, you will need to take it and paste it into your website’s HTML editor, which Google Sites makes pretty simple. Just remember that you’ll have to use the code on every page where you want the chat icon to appear unless you get into the more complex developer options, but most people don’t bother with those. 

Developer options

Speaking of developer options, of course, we would be remiss not to at least touch on them. The first thing we’ll tell you is that Facebook has a great resource of its own designed specifically for developers who want to get into the more complex, customizable options of coding the Facebook Chat plugin into their website. 

For those who just want to grab the code that they are embedding to incorporate into their own HTML, it looks as follows:

<div class=”fb-customerchat” 

Page_id=”<PAGE_ID>”> 

</div>


Safelisting your domain may also be required. This is a simple process, though, thanks to Facebook having a setting for it. Simply go to your settings on your Facebook page and click on the “Advanced Messaging” tab. Then, click “Safelisted Domains” and put your website’s URL in the box and click “Save”. This will ensure that the chat icon shows up and the plugin works seamlessly because Facebook knows that your website has permission. 

Here’s what it looks like in the settings:


Other features, templates, and tools

The Facebook Chat plugin functions similarly to the Messenger platform, including all of the rich media features and tools. You can use it to share audio and video messages, text and images, and even GIFs. Users who log in can send attachments and share files, and everyone can share links through the integrated Chat feature. 

It also includes quick replies for email, phone, and text, and URL and postback buttons to make it easy for people to stay connected and for your team to handle their communications most effectively. 

You’ll even enjoy access to the Facebook “Insights” tab, which offers a list of reports and analytics surrounding your Page, including your messaging statistics, which are kept under their own tab for easy review. 

If you use the attributes and other in-depth features from the Developer Options section, you’ll be able to customize a lot more of your chat plugin than you can with the straightforward setup. Be careful not to customize the wrong things, though, and to give your audience the solutions that are most effective and efficient for them, first and foremost. 

This means that yes, you must implement a Facebook Chat feature on your website because today’s customer demands it. It also means that you need to make the most of the tool to enhance your omnichannel presence and solidify your brand reputation. One way to do that is to offer Facebook Chat to all customers. Meet Guest Mode. 

Guest Mode 101: giving your audience options

Guest Mode is a new feature that was designed and launched in 2020 to go with the rising instance of Facebook Chat plugins being installed directly on business websites. Facebook realized, thanks to the brands, that consumers needed a way to contact through Messenger even without a Facebook profile or Messenger account

So, Guest Mode was created. This allows users to connect with brands without logging in and will save chat transcripts for them for up to 24 hours at a time, or until the user manually terminates the chat. Users without a Messenger account or Facebook profile will be given temporary access to the chat feature so that they can reach out conveniently. 

Users will be required to log in for certain things, such as to send attachments or to get a reply from a business that has an “away” status set. If someone chooses to continue in the app rather than on your website, they will also be prompted to log in. 

Essentially, this empowers every customer to reach your brand quickly, familiarly, and in a format that is user-friendly no matter the experience level. Plus, from a business perspective, it’s simple to integrate and takes just seconds to get it launched on your Google Sites webpage. 

Five quickfire reasons you need the Facebook Chat integration

If you’re still not sure that this integration could benefit you (never mind the fact that at this point, it is necessary for brands who want to thrive in the future of omnichannel service), here are five rapid-fire reasons that this integration will revolutionize things for your business and your audience alike. 

  1. Messenger is familiar. Even those who don’t use it will see that it functions much like a basic chat app and isn’t difficult to learn. 
  2. The Chat integration for your website saves time and saves people the hassle of taking another step to track you down and communicate their needs. 
  3. Facebook Chat provides a totally free solution to get live chat on your website. 
  4. You can create personalized connections with every customer by meeting them on social media, where they are most comfortable. 
  5. The Facebook Chat tool features rich media integrations for audio, video, file sharing, and other content. 

If you’re looking for a way to make it simple for people to contact you, this could be just what you need. It’s a tool that billions of people already use and it’s ready to integrate with just a few simple steps. Google Sites pages will be that much more dynamic with the Facebook Chat plugin integrated and ready to use. 

This may mean that you’re getting a higher volume of requests and messages from your audience, of course, and that’s not something to overlook. Fortunately, you’re not on your own. 

Skip the interruptions and let Smith.ai handle it

You’re busy, and you already have so much to get done in a day. Do you really need one more messaging tool to distract you from your business? Sure, your customers need attention, but no law says it has to be yours. In fact, wouldn’t it be better to rely on the dedicated live chat agents to handle your website chats and other 24/7 support solutions?

When you choose Smith.ai, you get a more comprehensive solution for live chat that covers website chats, SMS texts, and so much more. We even include the software and the staff of dedicated 24/7 agents for a complete package of live answering solutions in both English and Spanish. We’ll field each message on your behalf and connect with your website or e-commerce platform easily. 

We have a team of virtual receptionists that can handle fielding questions and concerns, as well as providing assistance for payments, intake, lead screening, scheduling, and so much more. You can even get straight to the point and ask how we can act as the face of your brand for all your customer service needs. 

Learn more when you schedule a free consultation to discuss how our live chat agents can improve your Facebook chats and other communications to take your brand to the next level. You can also reach us at hello@smith.ai or by calling (650) 727-6484.

Update 10/20/21: The installation process worked when originally published but we found users having issues with the social media integrations on Google Sites pages. After further research, we found many people that were having trouble. According to Google Help pages, we found threads of people having the same issues. One user said “Embed Code Facebook Messenger Doesn't Work” while another asked “Why Does Facebook Customer Chat Plugin Not Work On Google Sites?” Many third-party developers have their own apps, powr.io and elfsight to name a few, that help circumvent the installation issues. FACEBOOK for Developers has a Chat Plugin article we found to have the most information.

Tags:
Business Education
Written by Samir Sampat

Samir Sampat is a Marketing Manager with Smith.ai. He has experience working with businesses of all sizes focusing on marketing, communications, and business development.

Take the faster path to growth.
Get Smith.ai today.

Affordable plans for every budget.

Take the faster path to growth.
Get Smith.ai today.

Affordable plans for every budget.