Pricing
Go to app
User Name
Upgrade Help Center

LiveChat for Elementor

Ola Górska
5 min read
updated: Apr 7, 2025

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
You will be taken to the Plugins section of your WordPress admin panel. There, click on the Settings button available under the LiveChat Elementor plugin.
7
You’ll see the Thank you for choosing LiveChat! screen. Select Connect LiveChat to proceed.
8
Fill in your credentials and select Sign up to start a free 14 days LiveChat trial. If you already have a LiveChat account, select Log in instead, log in with your credentials and skip to step 11.
9
You’ll receive an email address verification code the email box that you used to sign up. Copy the code and paste it onto the confirmation screen.
10
Select Log in to finish the installation.
11
That’s it! A chat widget should now be visible on your website. Select View Traffic to see who is currently browsing it, Invite to add your teammates to your LiveChat account, or Customize to match your chat widget with your websites style!

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.

Download LiveChat desktop app for Windows or Mac, and enjoy your browsing with one less tab!
Download LiveChat desktop app for Windows or Mac, and enjoy your browsing with one less tab!

Customer’s cart detailsLink icon

LiveChat for Elementor plugin automatically provides you with your customers’ carts contents. They are displayed in the Details column - on the right side of the chat, under the Custom Variables tab.

There you can find data like:

- Total cart value

- Product names

- Total number of items in the cart

- Links to product pages

WooCommerce supportLink icon

If your WordPress has the WooCommerce plugin installed, you can get access to additional data under the WordPress icon located at the top of the Details column.

Select this icon to expand a cart view displaying key details, including:

- Total cart value

- Product names

- Product illustrations

- Unit prices

Use this information to immediately get a hang of your customers’ situations’ and close more deals faster!

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.

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.

Plugin settingsLink icon

LiveChat for Elementor offers additional options you can benefit from:

  • Hide chat widget for guest visitors lets you hide the chat widget for visitors that are not logged into your store.

    To find this option, go to your LiveChat app -> Select Apps -> LiveChat for WordPress -> Settings.

Arrows_pointing_out_the_way_to_the_WordPress_plugin_settings_in_the_LiveChat_app

There you can switch on/off the option to display a chat widget to logged-in users only.

Arrow_pointing_towards_the_toggle_switch_controlling_the_chat_widget_display_on_WordPress_website

  • 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. 

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.

Connect to a different LiveChat licenseLink icon

If for whatever reason you need to connect your LiveChat plugin with a different LiveChat license, e.g., you joined forces with another website, also using the LiveChat plugin, and you want to merge your support/sales team in one license, or you signed up for a new license rather than logged in your existing one by mistake, here are the steps to do it:

1
In the WordPress dashboard go to LiveChat. Click on Disconnect your account
2
Select Connect LiveChat. And proceed with the standard installation steps, starting from step 7.

All done! Log in and start chatting with your customers.

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 AI-driven features No credit card required

Still not convinced? Discover all LiveChat features

Discover Text products: