Created
November 21, 2022 01:30
-
-
Save cliffordp/927a92f2f2db962673d1deef48a31a0f to your computer and use it in GitHub Desktop.
High Level Chat Widget: anything with specified class can open the chat widget -- Demo: https://share.getcloudapp.com/d5uylPyE
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// This snippet: https://gist.github.com/cliffordp/927a92f2f2db962673d1deef48a31a0f | |
jQuery(document).ready( function($) { | |
// Hide until Chat Widget loads to prevent ineffective clicks. | |
$( ".open-chat-widget" ).hide(); | |
$(window).one( "LC_chatWidgetLoaded", function() { | |
const chatWidget = window.leadConnector.chatWidget; | |
// Show once Chat Widget is loaded. | |
$(".open-chat-widget").show(); | |
// Open Chat Widget once clicked. Works on menu item, button, link, etc. | |
$(".open-chat-widget").click( function(e){ | |
chatWidget.openWidget(); | |
e.preventDefault(e); | |
}); | |
}); | |
}); |
Alternatively, if you don't need jQuery for anything else, just convert the code above to vanilla JS (i.e. don't rely on jQuery)
WARNING: I haven't reviewed or attempted to use either of these, but you might want to before adding jQuery to your site.
ChatGPT came up with this conversion:
document.addEventListener("DOMContentLoaded", function() {
// Hide until Chat Widget loads to prevent ineffective clicks.
var openChatWidget = document.querySelectorAll(".open-chat-widget");
openChatWidget.forEach(function(widget) {
widget.style.display = "none";
});
function chatWidgetLoaded() {
var chatWidget = window.leadConnector.chatWidget;
// Show once Chat Widget is loaded.
openChatWidget.forEach(function(widget) {
widget.style.display = "block";
});
// Open Chat Widget once clicked. Works on menu item, button, link, etc.
openChatWidget.forEach(function(widget) {
widget.addEventListener("click", function(e) {
chatWidget.openWidget();
e.preventDefault();
});
});
}
// Listen for the "LC_chatWidgetLoaded" event only once
window.addEventListener("LC_chatWidgetLoaded", chatWidgetLoaded, { once: true });
});
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
If you need to add jQuery, such as to get this code snippet working on a GHL site/funnel:
<head>
or<body>
async
ordefer
, and, if you're a dev, reference https://idiallo.com/javascript/async-jquery for more goodies