How to Add Live Chat on Your WordPress Website

Add live chat to wordpress website

“I want to add live chat to my WordPress website, but don’t know how to begin.”

Trust us when we say that adding that little live chat project on your WordPress website is easy and hardly takes a few minutes to take it live.

But if you’re still having second thoughts on the “easy” part, then we’ve got your back.

We’ve curated a quick guide that will help you add a WordPress chat plugin in no time. This guide will cover other useful aspects of installation and its importance. Here’s a quick overview

Why Use Live Chat on Your WordPress Website?

Adding a live chat app for WordPress can help a business gain multiple benefits. These benefits range from gaining a competitive edge in the market to understanding growing customer expectations. However, there’s more to adding WordPress chatbox.

  • You get to chat with your WordPress website visitors in real time and customize their journey with your online business efficiently.
  • Helps your business to capture leads in real time and make sure they don’t slip through cracks with pre-chat form and chatbot features.
  • Tracks how well you’re managing incoming customer support queries and even monitors individual operator performance.
  • Enables your business to offer support anytime, anywhere to visitors looking for an answer.
  • Allows you to track visitors in real time and understand what they came looking for. This is helpful, especially when you would like to customize their journey with your brand.

Other than these benefits, your business website engages more visitors and improves the possibilities of converting them as customers. These reasons are more than enough for a business to add a live chat on their WordPress website. So, let’s take a look at how you can install one step-by-step.

How to Add Live Chat to WordPress Website [Step-by-Step]

Step 1: Start by clicking on “Plugins” in your WordPress Dashboard.

Clicking on plugins section in your WordPress

Step 2: Next, click on the “Add New” button.

Click on add new button in WordPress plugins

Step 3: Type “ProProfs Chat” in the search box available in the top right corner of the screen. Click on “Install Now” once you see the option “ProProfs Chat – Live Chat Plugin for WordPress Website”.

Install ProProfs chat for WordPress

Step 4: Next, click on the “Activate” button to start the plugin installation process.

Activate live chat for WordPress to proceed

Step 5: Once activated, you will be redirected to the plugins section. Now, click on the “Settings” button under your ProProfs Chat plugin.

Click on settings of live chat Plugin

Step 6: You will be asked to add your ProProfs Chat login credentials to proceed with the setup process.

If you don’t have a ProProfs Chat account, you can sign up here for free.

Add your ProProfs Chat login credentials to WordPress

Step 7: Once the credentials are added, you will complete the plugin installation process on your WordPress website.

What’s more, you can also access your ProProfs Chat dashboard from here.

Successfully complete the wordpress plugin installation

How to Enable Live Chat Plugin on Your WordPress Website?

While the live chat plugin has successfully been installed on your WordPress website, you still need to enable this plugin for it to appear on your website.

Here’s what you need to do.

Step 1: Click on the “Go to Dashboard” button.

It will redirect you to our ProProfs Chat Dashboard that looks like this:

ProProfs Chat dashboard

Step 2: Next, you will come across the “Launch Chat” option in the main navigation. Click on it to enable a live chat plugin on your website.

Click on launch chat to enable live chat

This button will show a green light that indicates the chat widget will now appear on your website.

That’s pretty much it.

You can also customize the chat windows as per your requirements. You can change logos with help of logo maker, fonts, and chat window themes easily. You can also use different chat windows for different pages of your website. Remember, ready-made chat templates are also available, therefore relieving you of any technical work.

But if you’d still like to see how you can customize your chat widget manually, then scroll down to our next section.

Read More: Best Live Chat Plugins for WordPress in 2022

How to Customize the Appearance of Live Chat Widget on WordPress website?

Customizing live chat widget is as easy as enabling it on your website. Here’s how you can customize its appearance and match it as per your website’s theme.

Step 1: On your ProProfs Live Chat dashboard, click “Settings”.

click on settings of live chat plugin

Step 2: By default, you will be directed to the “Theme” window where you can change and test and try various theme settings on this screen such as Style, Icon, Color, Avatar, Name, and Logo.

Try and test customization setting

We’ve explained each of these settings for the chat window below. 

Style: Choose how you want the chat icon to look on your WordPress website. You get options like project and Bar to choose from.

Look how chat icon will look on your website

Icon: You’ll get to see the following options if you’ve selected project as the style of the icon. 

Under project style you can see various other chat icons

*In case you’ve chosen Bar, the above Icon setting options will become unavailable.

Color: Choose the color for your chat project or Bar. You can even add the custom color code rather than choosing from existing color options.

Select the color for your live chat tools

Avatar and Name: You can set an avatar image and a display name for each operator.

Set avatar image and display name properly

Logo: Add and show your company logo in the chat widget with this option. 

*Please note that the recommended size is 350 x 200 pixels.

You can even click on the +Advanced button to customize the visitor chat window even further.

customize visitor chat window

When you reach the Advanced section, it will offer you the option to customize the Visitor Text Color, Operator Text Color, Chatbox Position, Chatbox Size, and more

What’s more, it shows its users the real-time preview of these changes on the right, as shown in the screenshot below.

Real time preview of live chat tool

You also get the option to customize the CSS of the chat widget. It helps you make changes to the Color and Text Color options. CSS (Cascading Style Sheet) Customization gives you the freedom to customize chat widget aspects such as the dimension of the chat window, dialogue boxes, bar, and even the avatar box. 

Customize the CSS of the chat widget

In the end, click Save when you’re done making changes.

That’s all it takes to customize your chat widget.

Now, let’s see how ProProfs Chat would appear on your WordPress website:ProProfs chat would appear on your WordPress website

Simplify Support on Your WordPress Website with Live Chat Plugin

Adding ProProfs Live Chat plugin to your WordPress website doesn’t require any technical expertise. You can either do it yourself or hand over the job to your developer. Still, the process hardly takes any time, and you will be ready to offer real-time instant support to your visitors.

Hope you found this guide helpful. In case you have queries, you can reach out to us anytime here.

Share this article on

Do you want a free Live Chat software?

We have the #1 Online Live Chat Software for instant customer support 24x7

About the author

Jared is a customer support expert. He has been published in CrazyEgg, CoSchedule, and CXL. As a customer support executive at ProProfs, he has been instrumental in developing a complete customer support system that more than doubled customer satisfaction. You can connect and engage with Jared on Twitter, Facebook, and LinkedIn