How to: Automatically start a chat with a certain department when clicking a custom element or button

by August 30, 2017 Leave your thoughts

 

In order to achieve the above, first the chat needs to be “hidden”, and then code needs to be created to show and open the chat box, dynamically select the department you want and then automatically start a chat.

 

Hiding the chat box

Go to Live Chat -> Settings -> Chat Box (tab) -> then change “Chat delay (seconds):” to something like 9999 (maximum – 2.7 hours). This will hide the chat box (but still keep it around) until you are ready to call it later with jQuery.

 

The code

Open wp-live-chat-support/js/wplc_u.js and just below

jQuery(document).ready(function() {

add the following:

jQuery("body").on("click", ".widget-title", function() {
/**
* Set this to "none" so the animation is overridden and the circle appears immediately
*/
jQuery("#wp-live-chat").attr('wplc_animation', 'none')


/**
* Force the animation to start
*/
wplc_cbox_animation();

/**
* Open the chat box
*/
open_chat(0);

/**
* Choose the department we want
*
* Changing the value of '2' here will change the department. View your /wp-admin/admin.php?page=wplc-pro-departments page to get the list of IDs used (first column on the page)
*/
jQuery("#wplc_user_selected_department").val('2');


/**
* Immediately start the chat (give the dropdown 200ms to change)
*/
setTimeout(function() {
jQuery("#wplc_start_chat_btn").click();
}, 200);

});

Change

.widget-title

to the element of your choice. In your case it could be a button, link or image. Find the ID or class name of that image and modify the code to suit it.

Change

'2'

to the department ID you want the chat to be directed to.

 

 

Leave a Reply

Your email address will not be published. Required fields are marked *

15 + = 16

This site uses Akismet to reduce spam. Learn how your comment data is processed.