Embed messenger chat

[Kostas]

How to add messenger plugin to a single page app? The above code is a given from Facebook with the following message
"Insert this code snippet directly after the opening tag on each page you want the Chat Plugin to appear."

  <div id="fb-root"></div>
  <script>
    window.fbAsyncInit = function() {
      FB.init({
        xfbml            : true,
        version          : 'v10.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/el_GR/sdk/xfbml.customerchat.js';
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));</script>

  <!-- Your Chat Plugin code -->
  <div class="fb-customerchat"
    attribution="setup_tool"
    page_id="107721617827189">
  </div>

Can anyone help me? Thank you in advance.
Please note that we can only address JavaScript questions and issues in the context of Tumult Hype, so please attach a Hype document so others can dig into what you have so far.

[MarkHunte]

Not able to test this due to refused to display Content Security Policy directive: “frame-ancestors https://www.facebook.com/"
So I assume yours will be in order.

Which means I cannot adjust and check it actually working as I have invisoned it working

fb_hype.zip (13.1 KB)

[Kostas]

Thank you for your answer Mark. Can though send me instructions on where to place the code?The file you attach doesn't open with my Hype version. When I try to open it I get the following messege:
The document you are trying to open was created with a newer version of Hype and cannot be displayed.

[MarkHunte]

Are you not able to update ?

The code is in a hype function

A rect is place inside a group
And given the class anme and attributes shown.

The group is given the id shown

As I said not able to fully test this beyond getting the security error.

[Kostas]

I have the pro version but to be honest the last updates aren't offer me anything new for my use. Powerfull tool especially for science teachers check the link to see what the app can do
https://youtu.be/3U1OYGQietY, but I think the developers are focussing to web developers etc. So for the time being I am not going to. It will be much appreciate if you could give me instructions.

[MarkHunte]

I have. Above.

Updates are not just about new features they include bug fixes.
I assume then you mean you are on version 3 instead of version 4.
If so then the above way will not be a setup you can use

[MarkHunte]

Here is a Hype 3 version.

fb_hypeV3.hype.zip (12.1 KB)

[Kostas]

Yeap :). Tank you very much. I am on Hype Pro.

[MarkHunte]

@Kostas

Hype Pro.

Still not clear what version you are using ?.

If you mean Hype pro 4, then ignore the v3 example and follow the setup in the images above.

[Kostas]

Version 3.6.10 (601) Professional Edition.
It doesn't work though. :(.

[Kostas]

I am trying to add a messenger chat plugin to my scene so my students can send me questions without leaving the scene.

[MarkHunte]

@Kostas

It doesn't work though.

I have not used the chat API and at this stage I am not sure I can.

There may be much, much more your setup needs than just placing this on a scene.

You need to provide more detail on what errors you are getting.. what your setup is. Why you think you can do this. Is it a special account setup.
Are you testing on a server. ( Pretty sure testing from preview or local filelocation will fail )

The more info you provide means less going back and forth with my or someone else questions.
i.e try to give long answers rather than short ones...

[Kostas]

I undestand. I will come to the matter with more details. I think its more more complicated than I thought. Thank you very much for your answers.