Jump to content
Krystian Podemski

[FREE] Messenger chat for your PrestaShop store

Recommended Posts

Hello everyone,

as Facebook just released their "chat plugin" based on Messenger i've created a simple free module which allows you to implement it into your PrestaShop store

Module should work just fine both on PrestaShop 1.7 and PrestaShop 1.6

The module and its source code is on GitHub:

https://github.com/kpodemski/phfbchat

  • Like 1
  • Thanks 3

Share this post


Link to post
Share on other sites

Hi Krystian.

How set App ID in Facebook Messenger Chat Plugin?

Thanks in advance.

Share this post


Link to post
Share on other sites

Hey GDD, just install and configure module, you need to create an APP on facebook developers site, instruction is in a link available on the configuration page

  • Like 1

Share this post


Link to post
Share on other sites

Thanks! I have been looking for this free module for months. Finally, using your module and it's working. I am using Prestashop 1.7.3.1.

Share this post


Link to post
Share on other sites
7 hours ago, Interlink said:

I have done all steps but still not working on my site please help!!!

 

The AP ID is located at the top of the page while trying to setup an APP, by mistake I copied at first the token (middle page).

Edited by Endri (see edit history)

Share this post


Link to post
Share on other sites
Le 6/2/2018 à 6:34 PM, Greg a dit :

Hi

Not working on 1.7.3.3. Nothing is displayed :/

worked fine on presta 1.7.3.3 + custom theme (pixel module is enabled)

Share this post


Link to post
Share on other sites

Hello, please if you can tell me where to enter in the source code of prestashop the code generated by facebook.

<!-- 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/ro_RO/sdk/xfbml.customerchat.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"
  attribution=setup_tool
  page_id="376296163454514"
  theme_color="#0084ff"
  logged_in_greeting="Hello"
  logged_out_greeting="Hello">
</div>

Share this post


Link to post
Share on other sites

in the facebook developer account it asks for a callback url in the webhook for the messenger app to be able to work. any help?

Share this post


Link to post
Share on other sites

Is there a way to edit the custom message and to have it popped-up? Currently, it does not pop-up the message that "Hi, how can we help you" on the bubble. Still, you need to click the FB button first. I know on the FB Settings we can customize the color of the button and add the custom message, can we do that here or where can we paste the html code? Thanks!

Share this post


Link to post
Share on other sites

in the facebook developer account it asks for a callback url in the webhook for the messenger app to be able to work. any help?

Share this post


Link to post
Share on other sites

Hi! Thanks for great module.

It works at my store 1.6.1.12 but only on main page!

On category pages,product pages etc messenger bubble doesn't pop up....

How can I repair this ?

Share this post


Link to post
Share on other sites
On 22/8/2018 at 11:26 AM, nasblack said:

in the facebook developer account it asks for a callback url in the webhook for the messenger app to be able to work. any help?

you solved?

Share this post


Link to post
Share on other sites
On 10/1/2018 at 3:33 PM, Krystian Podemski said:

Hello everyone,

as Facebook just released their "chat plugin" based on Messenger i've created a simple free module which allows you to implement it into your PrestaShop store

Module should work just fine both on PrestaShop 1.7 and PrestaShop 1.6

The module and its source code is on GitHub:

https://github.com/kpodemski/phfbchat

Thank you for great module! But i have a trouble with it! If i visit the website with computer, everything is ok. But if i visit it on the phone, the messenger button doesn't appear...

Why?

 

Thank you!

Share this post


Link to post
Share on other sites
On 11/21/2018 at 8:11 AM, Krystian Podemski said:

Module has been updated to v1.1.0, new version covers some additional options for plugin and replace SDK URL to the newest one provided by Facebook.

More information and link to download, here: https://github.com/kpodemski/phfbchat

 

Hi, I installed module, and I dont have any files, module installed but he is gone.

I have presta 1.6.1.23 and PHP 7.3

Share this post


Link to post
Share on other sites
22 minutes ago, matt923 said:

Bonjour, j'ai installé le module, et je n'ai aucun fichier, le module est installé mais il est parti.

J'ai presta 1.6.1.23 et PHP 7.3

 

 

Salut install ça...  

phfbchat.zip

Share this post


Link to post
Share on other sites
On 11/26/2018 at 11:13 AM, matt923 said:

 

Ok I installed this version, but nothing happened I dont have any icon and chat. I did all with instruction but still nothing

Edited by matt923 (see edit history)

Share this post


Link to post
Share on other sites

Hello! I have prestashop 1.7.2.1, i isntalled the module, i added all the info and cleared the cache but nothing happened, the messenger icon doesnt show up.

Share this post


Link to post
Share on other sites
On 12/18/2018 at 1:17 AM, Caito103 said:

Hello! I have prestashop 1.7.2.1, i isntalled the module, i added all the info and cleared the cache but nothing happened, the messenger icon doesnt show up.

Same problem for me

Share this post


Link to post
Share on other sites

Well if you can do a video instruction, it will much appreciated, thanks in advance

Share this post


Link to post
Share on other sites

There was an update on the 9th january 2019 :

switch js.src = "https://connect.facebook.net/fr_FR/sdk.js";

to

js.src = "https://connect.facebook.net/fr_FR/sdk/xfbml.customerchat.js";

Share this post


Link to post
Share on other sites

Hi, if you Chat box not show, this worked for me:

Note: Dont forget add the domain to white list in facebook messenger. In your Page go to Configuration > Messenger Platform > Supported domains and add your Domains

1. In your file hosting edit this .tpl ( public_html/themes/yourtheme/header.tpl )

2. When the tag <body> he open. Like this: 

<body{if isset($page_name)} itemscope itemtype="http://schema.org/WebPage" id="{$page_name|escape:'html':'UTF-8'}"{/if} class="{if isset($page_name)}{$page_name|escape:'html':'UTF-8'}{/if}{if isset($body_classes) && $body_classes|@count} {implode value=$body_classes separator=' '}{/if}{if $hide_left_column} hide-left-column{else} show-left-column{/if}{if $hide_right_column} hide-right-column{else} show-right-column{/if}{if isset($content_only) && $content_only} content_only{/if} lang_{$lang_iso}">

Paste the following after the body tag:

	<!-- Load Facebook SDK for JavaScript -->

<div id="fb-root"></div>
<style>
body #fb-root { display: block; }
.fb_dialog, .fb-customerchat iframe:not([class*=mobile]) { margin-bottom: 0px; margin-right: 0px; }

</style>
<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/'+(navigator.language || navigator.userLanguage).replace('-', '_')+'/sdk/xfbml.customerchat.js#xfbml=1&version=v2.12&autoLogAppEvents=1';
	fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<div class="fb-customerchat"
	page_id="1720923411485820" 	<!-- YOUR PAGE ID HERE -->
	theme_color="#0084ff"
	logged_in_greeting="Hola, ¿En qué podemos ayudarle?" 	<!-- YOUR MESSAGE -->
	logged_out_greeting="Hola, ¿En qué podemos ayudarle?"> <!-- YOUR MESSAGE -->
</div>

3. Save and test.

Proof

https://i.imgur.com/fbjZvEm.png

 

 

fbjZvEm.png

Edited by SIMUnlock (see edit history)

Share this post


Link to post
Share on other sites

Hi. Is there a way to move the Messenger button to the left side? It covers the "go up" button. I found a code on one website that moves the chat window to the left, bo the Messenger logo is still on the right side.

image.png.8b6046e93e787b80d5d621baf46e6a3b.png

Here's the code I have found:

<style>
  #fb-root > div.fb_dialog.fb_dialog_advanced.fb_shrink_active {
     right: initial !important;
     left: 18pt;
     z-index: 9999999 !important;
  }
  .fb-customerchat.fb_invisible_flow.fb_iframe_widget iframe {
     right: initial !important;
     left: 18pt !important;
  }
</style>

 

Share this post


Link to post
Share on other sites

Hello guys,

unfortunately there are a lot of issues with Facebook Messenger, customer.sdk is not compatible with other SDKs etc

i've released one update to change sdk to the new one and add few options but it's not really working with all available scenarios

Share this post


Link to post
Share on other sites

Hi, I installed this module in 1.7.5, and i don't see any field in module configuration where I could enter App ID, i can only enter page ID. Is app id still needed?

Edited by mantas393 (see edit history)

Share this post


Link to post
Share on other sites

Please check on 1.6, there much users of 1.6 it should work on that

Share this post


Link to post
Share on other sites

hi,

I am using this plugin in my prestashop site 1.6.1.16,did as per instruction,

it doesnt display in front office.

website url is  https://singmasters.com

pls advise.

thanks

 

Share this post


Link to post
Share on other sites

Hi, Thank you for the plugin. It is working on my website.

However, I have one question. 

Is it possible to have a close button on the pop up if my customer is not log into messenger?

Currently have the pop up but I am not able to close it. 

Any solution for that?

mesenger.PNG.0d70c892b641d6fbc1f85582bb170950.PNG

Thank you.

 

  • Like 1

Share this post


Link to post
Share on other sites
Posted (edited)

I've got the module installed and it's showing up on the website after adding the website to the whitelist. The problem I'm having is that when I try to login, the little login pop-up screen just returns a 1 but doesn't actually fully login (see screenshot). Does anybody know how to fix this?

 

Thanks in advance.

EDIT:

Never Mind it was an addon in firefox that was causing the problem. It works perfectly now.

 

Edited by Plika1988
solved (see edit history)

Share this post


Link to post
Share on other sites

Hi,

 

I want the pop up  to be activated after , let's say,  5 minutes (300 sec).

Before that I want only the little blue FB-Messenger logo in the right bottom corner of my website.

 

I find it very irritating if someone directly asks me if he/she can help me.
When someone is (searching) for a longer time on my website I want to help them and want to ask them in a popup if the needed help.

Without any reaction of the customer this popup may disappear again after let's say 5 seconds.

Is there a way to make this happen?

 

 

Share this post


Link to post
Share on other sites

it is not working for me on 1.6.1.24 - 

Uncaught b {message: "invalid version specified", innerError: undefined}innerError: undefinedmessage: "invalid version specified"__proto__: cconstructor: ƒ b(b,c)stackTraceLimit: 10__superConstructor__: ƒ c()arguments: (...)caller: (...)length: 2name: "b"prototype: cconstructor: ƒ b(b,c)__proto__: Error__proto__: ƒ ()[[FunctionLocation]]: xfbml.customerchat.js:92[[Scopes]]: Scopes[5]__proto__: Error

i have whitelist my domain on facebook group chat settings both for https and http, page id is correct and the error is like above. i also tried to add the code in my themes header.tpl file rigt after the body tag and also tried on footer.tpl  before ending body tag. error is the same. covering the script with {literal}<script></script>{/literal} also doesn't help.

Share this post


Link to post
Share on other sites
Posted (edited)

I think the problem  (for maybe almost everyone) is that module don´t show ONLY in MOZZILA

In Chrome is ok.

Any solution for that?

Edited by karui (see edit history)

Share this post


Link to post
Share on other sites

On PrestaShop 1.7.5.2 not work..

The JS debugger show this message:
 

Quote

ReferenceError: FB is not defined

 

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


×
×
  • Create New...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More