Реализация плагина клиентского чата Facebook с ошибкой диспетчера тегов

Рабочий раствор

Нашел ответ на эта статья Simoa Hava

Проблема

Мы реализовали клиентский чат Facebook с помощью GTM. Хотя версия 2.11 работала нормально, версия 2.12 не работает, так как не позволяет мне добавить код ниже.

Рекомендации по внедрению

<!-- Load Facebook SDK for JavaScript -->
<div id = "fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = 'https://connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v2.12&autoLogAppEvents=1';
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

<!-- Your customer chat code -->
<div class = "fb-customerchat"
  page_id = "xxxxxxxxxxxxxx"
  theme_color = "#921710"
  logged_in_greeting = "Hi! Got any questions? Ask us anything, or get stuck in for more inspiration!"
  logged_out_greeting = "Hi! Got any questions? Ask us anything, or get stuck in for more inspiration!">
</div>

Я получаю ошибку

Invalid HTML, CSS or JavaScript found in template.

Предыдущий рабочий код:

    <script>
      window.fbAsyncInit = function() {
        FB.init({
          appId            : 'xxxxxxxxxxxxxx',
          autoLogAppEvents : true,
          xfbml            : true,
          version          : 'v2.11'
        });
      };

      (function(d, s, id){
         var js, fjs = d.getElementsByTagName(s)[0];
         if (d.getElementById(id)) {return;}
         js = d.createElement(s); js.id = id;
         js.src = "https://connect.facebook.net/en_US/sdk.js";
         fjs.parentNode.insertBefore(js, fjs);
       }(document, 'script', 'facebook-jssdk'));

  jQuery('body').append('<div class = "fb-customerchat" page_id = "xxxxxxxxxx" minimized = "false"> </div>');

    </script>

Обновленный код с jQuery - все еще показывает ошибку

<!-- Load Facebook SDK for JavaScript -->
<div id = "fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = 'https://connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v2.12&autoLogAppEvents=1';
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

<!-- Your customer chat code -->
jQuery('body').append('<div class = "fb-customerchat" page_id = "xxxxxxxxxxx" theme_color = "#921710" logged_in_greeting = "Hi! Got any questions? Ask us anything, or get stuck in for more inspiration!" logged_out_greeting = "Hi! Got any questions? Ask us anything, or get stuck in for more inspiration!"  minimized = "true"></div>');

Любая помощь будет высоко ценится :)

Так какой же код для v2.11 все еще работал?

CBroe 15.03.2018 15:20

@CBroe, похоже, не может отформатировать код, чтобы добавить его сюда в качестве комментария.

Charlie C 15.03.2018 16:02

Пожалуйста, укажите это в вопросе, который нельзя прочитать в комментариях.

CBroe 15.03.2018 16:04

@CBroe, прости, я сделал это сейчас. Благодарность

Charlie C 15.03.2018 16:07

Этот второй фрагмент кода загружает и инициализирует только SDK, плагин чата нигде не инициализируется.

CBroe 15.03.2018 16:10

@CBroe, вы правы, я забыл добавить часть jQuery в приведенный выше код. В старом коде нет тегов div, может ли это быть причиной ошибки в новой версии?

Charlie C 16.03.2018 14:21

Каким образом вы пытаетесь встроить это через GTM? Я полагаю, это должен быть тип «Пользовательский тег HTML».

CBroe 16.03.2018 14:33

Ага, вот что я использую. Ему не нравится часть «код чата вашего клиента», кажется, что если я просто добавлю скрипт, он отлично сохранится.

Charlie C 16.03.2018 14:44

Я думаю, это может быть из-за используемых там нестандартных атрибутов - если вы удалите что-либо, кроме атрибута класса из этого div, он все еще жалуется? (Конечно, тогда это больше не будет работать, попробуйте просто для отладки.)

CBroe 16.03.2018 14:51

Да, приведенный ниже код сохраняется без ошибок вместе с остальной частью кода <! - Код вашего чата клиента -> <div class = "fb-customerchat"> </div>

Charlie C 16.03.2018 15:02

Есть какие-нибудь советы о том, как изменить код, чтобы он сохранялся без ошибок?

Charlie C 19.03.2018 12:26

Что ж, если создание элемента с использованием jQuery работало раньше, я не понимаю, почему это не так ... поэтому создайте, попробуйте и создайте элемент таким же образом, но добавьте дополнительные атрибуты theme_color, logged_in_greeting и logged_out_greeting.

CBroe 19.03.2018 12:29

@CBroe Я изменил код, чтобы использовать jQuery, но все равно получаю сообщение об ошибке: / Я добавил код выше. Я сделал что-то не так?

Charlie C 20.03.2018 10:54

Нужно ли мне также помещать часть <div id = "fb-root"></div> в jQuery?

Charlie C 20.03.2018 10:55

Мне удалось заставить его работать с помощью этого решения: simoahava.com/analytics/…

Charlie C 20.03.2018 11:22

Спасибо за помощь @CBroe

Charlie C 20.03.2018 11:24
Почему Facebook остановился на PHP
Почему Facebook остановился на PHP
PHP имеет долгую историю с Facebook, и это был основной язык программирования, использовавшийся для создания сайта в первые годы его существования....
1
16
831
0

Другие вопросы по теме