ВордПресс: Коришћење јКуери-а за отварање прозора ЛивеЦхат-а кликом на везу или дугме користећи Елементор

Коришћење јКуерија за отварање прозора ЛивеЦхат-а кликом на везу или дугме користећи Елементор

Један од наших клијената има Елементор, једна од најробуснијих платформи за прављење страница за ВордПресс. Помагали смо им да очисте своје напоре за улазни маркетинг током последњих неколико месеци, минимизирајући прилагођавања која су применили и омогућавајући бољу комуникацију система – укључујући и аналитику.

Купац има Уживо ћаскање, фантастичан сервис за ћаскање који има робусну интеграцију Гоогле аналитике за сваки корак процеса ћаскања. ЛивеЦхат има веома добар АПИ за његову интеграцију у вашу веб локацију, укључујући могућност отварања прозора за ћаскање користећи онЦлицк догађај у сидреној ознаци. Ево како то изгледа:

<a href="#" onclick="parent.LC_API.open_chat_window();return false;">Chat Now!</a>

Ово је згодно ако имате могућност да измените основни код или додате прилагођени ХТМЛ. Витх Елементор, међутим, платформа је закључана из безбедносних разлога тако да не можете да додате догађај онЦлицк на било који објекат. Ако имате тај прилагођени догађај онЦлицк додат у ваш код, нећете добити никакву врсту грешке... али ћете видети да је код уклоњен из излаза.

Коришћење јКуери слушаоца

Једно ограничење онЦлицк методологије је да бисте морали да уредите сваки појединачни линк на вашој веб локацији и додате тај код. Алтернативна методологија је укључивање скрипте на страницу која слуша за одређени клик на вашу страницу и она извршава код за вас. Ово се може урадити тражењем било ког сидрена ознака са одређеним ЦСС класа. У овом случају, означавамо сидрену ознаку са класом именованом опенцхат.

У подножју сајта, само додајем прилагођено ХТМЛ поље са потребном скриптом:

<script>
document.addEventListener("DOMContentLoaded", function(event) {
  jQuery('.openchat a').click(function(){
    parent.LC_API.open_chat_window();return false;
  });
});
</script>

Сада, та скрипта је широм сајта, тако да без обзира на страницу, ако имам класу опенцхат на који се кликне, отвориће се прозор за ћаскање. За објекат Елементор, само смо поставили везу на # и класу као опенцхат.

елементор линк

елементор класе напредних подешавања

Наравно, код се може побољшати или се може користити за било коју другу врсту догађаја, као што је а Догађај Гоогле аналитике. Наравно, ЛивеЦхат има изванредну интеграцију са Гоогле аналитиком која додаје ове догађаје, али ја то укључујем у наставку само као пример:

<script>
document.addEventListener("DOMContentLoaded", function(event) {
  jQuery('.openchat a').click(function(){
    parent.LC_API.open_chat_window();return false;
    gtag('event', 'Click', { 'event_category': 'Chat', 'event_action':'Open','event_label':'LiveChat' });
  });
});
</script>

Прављење сајта помоћу Елементора је прилично једноставно и топло препоручујем платформу. Постоји сјајна заједница, тона ресурса и доста Елементор додатака који побољшавају могућности.

Започните са Елементор-ом Започните са ЛивеЦхат-ом

Откривање података: Користим партнерске везе за Елементор Уживо ћаскање у овом чланку. Сајт на коме смо развили решење је а Произвођач врућих кадица у централној Индијани.