How to add live chat to WordPress

Before you start

You need a free Quarito account with your website added. Create one if you haven't yet: it takes a minute and there's no card to enter.

Then copy your install code from Administration › Chat Widget › Install. It's one line that looks like this, with your own site's ID in it:

<script src="https://chat.quarito.com/l/YOUR-SITE-ID.js" async></script>

• On WordPress.com, installing plugins needs a plan that allows them. Self-hosted WordPress (WordPress.org) has no limit.
• Use it exactly as it is. Don't change the address or download the file: the chat updates itself from there.
• You only paste it once. Colours, messages and everything else change from the dashboard and reach your site within about a minute.

Add the code with a free plugin (easiest)

A footer-code plugin keeps the code safe when your theme updates, and you never touch a theme file. This guide uses WPCode, which is free; any plugin with a footer box works the same way.

1. In your WordPress admin, go to Plugins › Add New Plugin, search for WPCode, then Install Now and Activate.
2. Open Code Snippets › Header & Footer in the admin menu.
3. Paste your install code into the Footer box.
4. Choose Save Changes.

That's it: every page of your site now has the chat. You don't need a separate "Quarito plugin".

Or add it to your theme

Comfortable with theme files? Use a child theme, so a theme update doesn't wipe the code out, and add this to its functions.php:

// The Quarito live chat, at the bottom of every page
add_action( 'wp_footer', function () {
    echo '<script src="https://chat.quarito.com/l/YOUR-SITE-ID.js" async></script>';
} );

Or paste the code just above </body> in the child theme's footer.php. More on this in the PHP guide.

The chat on some pages only

Keep the code in the footer of every page, then list the pages that shouldn't show the chat under Chat Widget › Behavior › Pages without the chat, for example /thank-you or /members/*. Your WordPress admin pages never show it: the footer code only runs on your public site.

If the chat doesn't show on WordPress

• A caching plugin serves the old page. Clear the cache in WP Rocket, W3 Total Cache, LiteSpeed Cache or whichever you use, and in your host's cache or CDN.
• A speed plugin delays or combines scripts. Exclude the chat's address (chat.quarito.com) from "delay JavaScript" and "combine JavaScript" settings.
• Your theme doesn't call wp_footer(). Almost every theme does; if yours doesn't, paste the code into its footer.php instead.
• A security plugin adds a Content Security Policy. See sites with a Content Security Policy.

Check that it works

1. Open your site in a private (incognito) window, so you see it the way a visitor does.
2. Look for the chat button in the bottom corner of the page, then send yourself a test message.
3. In the dashboard, the message appears in your Inbox as it arrives. Reply, and watch the answer reach the website.

You can also choose check the installation on the Install tab of Administration › Chat Widget: we load your home page and look for your code. No button? Go through when the chat doesn't show.

Set up the rest

The chat is on your WordPress site. A few minutes in the dashboard makes it yours:

• Customize the chat: your colour, logo, chat button and welcome message.
• Set your office hours, so visitors know when you'll answer.
• Save replies to the questions you hear most.
• Invite your team to answer chats with you.