LiveChat for Elementor

Ola Górska
4 min read
updated: Nov 26, 2021

Elementor is a drag and drop website builder for WordPress. It consists of ready to use widgets that you can add to your site’s theme. It is as seamless as it sounds!

Install LiveChat for Elementor to load a chat window, contact buttons, and quality badges on your website.

Plugin installationLink icon

Follow the instructions below to install LiveChat’s widgets on your Elementor website.

LiveChat works with both free and pro Elementor plugins. Make sure to install one of them before proceeding with LiveChat for Elementor integration.
LiveChat works with both free and pro Elementor plugins. Make sure to install one of them before proceeding with LiveChat for Elementor integration.
1
Go to the Plugins section in your WordPress Dashboard.
2
Select the Add New button.
3
Type Plugin for Elementor – LiveChat in the Search Tool available on the right.
4
In the Search Results, you will find the LiveChat Plugin for Elementor. Select Install Now to proceed.
5
After the installation, click on the Activate button.
6
If you don’t have a LiveChat account yet, enter your email address, name and select Sign up.
7
If you have a LiveChat account already, click on the Login link at the bottom of the form and log in to your LiveChat account.
8
Now, LiveChat has been added to your website. If you have just signed up for a LiveChat account, check your inbox for an email containing a link that allows you to set up a password for your LiveChat account.

The installation is now complete and the chat window should automatically show up on your website. You can now add Quality Badge and Contact Buttons on your pages.

Quality Badge and Contact ButtonLink icon

After the plugin installation is complete, you will get access to two widgets in the Elementor menu on your pages preview. 

The Quality Badge widget displays your customer support rating and links to an online certificate. It is a great way to show the quality of support you provide on your website.

After installing the quality badge, you may see a default banner presenting no specific data. No worries, it will start showing your scores as soon as you have at least 10 rated chats and 70% satisfaction rating in the preceding month. Check your chat satisfaction report to find out your score.
After installing the quality badge, you may see a default banner presenting no specific data. No worries, it will start showing your scores as soon as you have at least 10 rated chats and 70% satisfaction rating in the preceding month. Check your chat satisfaction report to find out your score.

The Contact Button widget adds an action button to your store that pops up a chat window. Add it to the header or footer of your pages to offer more ways for customers to reach you.

1
Preview a page that you want to modify.
2
Select Edit with Elementor.
3
Scroll down the elements menu.
4
You will find a LiveChat tab that includes Quality Badge and Contact Button widgets.
5
Drag and drop them in places where you want to display them on your page.
6
Click on a widget to display available customization options on elementor menu.
7
Customize your widgets to fit your needs.
8
Select the Publish button to make the changes visible in your store.

That’s it! The new widgets are now added to your page.

WooCommerce support Link icon

If you’re using WooCommerce, LiveChat for Elementor will detect it and add new functionalities to your chat. You’ll be able to see the cart and last order details directly in the LiveChat app.

1
Enter an ongoing chat.
2
Scroll down the details column on the right side of the screen.
3
There you will find the cart and order information.

Plugin settingsLink icon

LiveChat for Elementor offers additional options you can benefit from:

  • Visitor tracking allows you to see last order details, shipping address, total value, product details, and products count in the LiveChat app. The data is visible in chats, on the right side Details column. 
  • Hide chat widget for guest visitors lets you hide the chat widget for visitors that are not logged into your store.

Additionally, you can select Mobile widget settings to manage the visibility of the chat widget when customers visit your website on mobile devices. This is done in the LiveChat agent app.

You can also disconnect your current LiveChat license from your website by selecting Disconnect at the bottom of the page.

1
To edit these settings, click on the LiveChat button in your WordPress Dashboard and go to Settings.
2
Toggle the options on or off, and we will automatically apply those changes for you.

With LiveChat for Elementor, your website is now ready to serve quality support. If you have any questions regarding the integration or LiveChat products in general, don’t hesitate to contact our support team.

Was this article helpful?

Got it!

Thanks for your feedback.

Thank you!

We’re happy to help.

Start using LiveChat now!

Free 14-day trial Team plan features No credit card required

Still not convinced? Discover all LiveChat features

Discover our other products