Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Facebook messenger button


KarlSimon

Question

Site URL: https://owlhealings.com/

Hi there, 

On my website I am using Weglot translation service which is working great! 

However when I want to also add the Facebook Messenger button it doesn't show up, even though I chose through facebook settings to have their button on the left side and weglot is on the right hand side....

Does anyone here know how I can, in a simple way, have both of the buttons at once?. 

These are the codes I am using atm (they are both just copied and pasted from the website I want to add):

For weglot: 

<link rel="alternate" hreflang="sv" href="https://owlhealings.com">
<link rel="alternate" hreflang="en" href="https://en.owlhealings.com">
<script type="text/javascript" src="https://cdn.weglot.com/weglot.min.js"></script>
<script>
    Weglot.initialize({
        api_key: 'wg_1ba15574215e959596390c470190fc268'
    });
</script>

For Facebook:

<!-- Messenger Chat plugin Code -->
    <div id="fb-root"></div>

    <!-- Your Chat plugin code -->
    <div id="fb-customer-chat" class="fb-customerchat">
    </div>

    <script>
      var chatbox = document.getElementById('fb-customer-chat');
      chatbox.setAttribute("page_id", "378693042833123");
      chatbox.setAttribute("attribution", "biz_inbox");

      window.fbAsyncInit = function() {
        FB.init({
          xfbml            : true,
          version          : 'v11.0'
        });
      };

      (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/sv_SE/sdk/xfbml.customerchat.js';
        fjs.parentNode.insertBefore(js, fjs);
      }(document, 'script', 'facebook-jssdk'));
    </script>

EDIT: I want to add as well that I have the WeGlot code in the area called "header" and the Favebook code in the area called "footer" in "code injection". 

Grateful for help.

Much love, Karl-Simon

Edited by KarlSimon
forgot to mention something
Link to comment

6 answers to this question

Recommended Posts

  • 1

Have you solved this yet? Try this free tool to add FB chat. 

If it still doesn't work, let me know. We will try testing it again on demo site.

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0

Hello karlsimon,

You can try this code

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

      (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 = "//connect.facebook.net/en_US/sdk.js";
        fjs.parentNode.insertBefore(js, fjs);
      }(document, 'script', 'facebook-jssdk'));
    </script>

    <div class="fb-messengermessageus"
         messenger_app_id="95100348886"
         page_id="XYZ"
         color="blue"
         size="large">
    </div>

Link to comment
  • 0

Thank you Tuanphan

Your tool did work, thank you for that. However I would love it if I could get the facebook plugin working as it would provide me the choices for people to ask their first question... Perhaps I just can't have 2 plugins on the same page, ie weglot and fb messenger... When I removed the weglot, the facebook code works....

If you can think of any other solutions I would be super grateful bur for now I will use your tool, thank you again!

 

look at picture for what I mean with "the first questions"

Screenshot 2021-09-15 14.19.20.png

Edited by KarlSimon
Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...