Jump to content

[Free Module] Facebook Like Box


KostasX
 Share

Recommended Posts

I' ve created this little module with just a simple task. To display a facebook like box in your prestashop site.

 

It's simple, it's easy and it just does the work.

 

You can download it from here, or my Blog, where you will find pics and instructions about the module.

 

Greek Version

English Version

fblikebox-1_3_2.zip

Edited by KostasX (see edit history)
  • Like 3

Share this post


Link to post
Share on other sites

Hi! I'm searching how to put the fan box on order-confirmation page. I did that:

 

SDK Facebook in header.tpl just before </head>

 

<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 = "//connect.facebook.net/fr_FR/all.js#xfbml=1";

fjs.parentNode.insertBefore(js, fjs);

}(document, 'script', 'facebook-jssdk'));</script>

 

And the fan box in the end of order-confirmation.tpl

 

<div class="fb-subscribe" data-href="http://www.facebook.com/YouLab.fr" data-show-faces="true" data-font="arial" data-width="980"></div>

 

But it do not work, maybe you have an idea of were is my mistake? Thanks

Share this post


Link to post
Share on other sites

Hi! I'm searching how to put the fan box on order-confirmation page. I did that:

 

SDK Facebook in header.tpl just before </head>

 

<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 = "//connect.facebook.net/fr_FR/all.js#xfbml=1";

fjs.parentNode.insertBefore(js, fjs);

}(document, 'script', 'facebook-jssdk'));</script>

 

And the fan box in the end of order-confirmation.tpl

 

<div class="fb-subscribe" data-href="http://www.facebook.com/YouLab.fr" data-show-faces="true" data-font="arial" data-width="980"></div>

 

But it do not work, maybe you have an idea of were is my mistake? Thanks

 

First of all, you don't have to put the SDK in the header, but in the <body> tag. So it won't matter if you put the entire code (SDK and box) in the order-confirmation.tpl.

 

Your problem probably is with themplate caching. Try go at backoffice at Preferences->Performance and check Yes to "Force compile" and No to "Cache". After that try to complete an order and see if the facebook like box appears.

 

If that doesn't work try delete the content of /tools/smarty/compile folder.

Share this post


Link to post
Share on other sites

Try puting some plain HTML code where you want the Facebook box to be displayed and see if it show correctly. If it does, then it has to do with the Facebook code. If doesn't show up, then it's either the template cache or just the wrong tpl file.

 

Hope you find a solution :)

Share this post


Link to post
Share on other sites

Thanks a lot, I found the solution thanks to you! Indeed it was Facebook API html that was not good...

 

Then I used the below one and everything is working fine!

 

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 = "//connect.facebook.net/fr_FR/all.js#xfbml=1&appId=460852680613503";

fjs.parentNode.insertBefore(js, fjs);

}(document, 'script', 'facebook-jssdk'));</script>

 

<div class="fb-like-box" data-href="http://www.facebook.com/youlab.fr" data-width="292" data-show-faces="true" data-stream="false" data-header="true"></div>

Share this post


Link to post
Share on other sites

You were right. It seems I forgot my native language for js include in FB API.

 

Now I embed some languages (English, Spanish, Italian, Greek, German and French). So now it displays differently the Facebook Box according to selected language.

 

If you have a language that is not in the list, then it will be displayed in English.

 

I hope in the future I will embed more languages.

 

If someone wants an extra language... just ask :D

Share this post


Link to post
Share on other sites

You were right. It seems I forgot my native language for js include in FB API.

 

Now I embed some languages (English, Spanish, Italian, Greek, German and French). So now it displays differently the Facebook Box according to selected language.

 

If you have a language that is not in the list, then it will be displayed in English.

 

I hope in the future I will embed more languages.

 

If someone wants an extra language... just ask :D

 

much better now:) Thank you

Edited by rmiho (see edit history)

Share this post


Link to post
Share on other sites

Hello, what kind of modifications should I do to be able to change the facebook page the module shows. Because if I just replace the link from the facebook page url it says "Could not retrieve the specified page. Please verify correct href was passed in." I'm not that good in coding because I've just started with this site stuff. I would really appreciate your directions. Thanks!

Share this post


Link to post
Share on other sites

Hello, what kind of modifications should I do to be able to change the facebook page the module shows. Because if I just replace the link from the facebook page url it says "Could not retrieve the specified page. Please verify correct href was passed in." I'm not that good in coding because I've just started with this site stuff. I would really appreciate your directions. Thanks!

 

If you read the installation instructions from my blog http://blog.01webdesign.com/facebook-like-box-module-for-prestashop.html

you 'll see it's very easy to do it.

All you have to do is copy your Facebook page url and paste it in the first box.

 

Paste your facebook page though, just in case.

Share this post


Link to post
Share on other sites

  • 4 weeks later...
  • 2 months later...

Hello!

 

Thank you for this module! I am verry happy with it, but there seems like a problem in IE and Chrome.

 

See file 1. my configuration is oke.

File 2. is the box in firefox, 100% great

File 3. is the box in chrome, and in IE it is the same. Wrong colors, and no footer.

 

I use Prestashop 1.5, I think that is the problem?

 

Can you fix it?

 

Greetings, Hilda

Edited by Lucif (see edit history)

Share this post


Link to post
Share on other sites

Hello!

 

Thank you for this module! I am verry happy with it, but there seems like a problem in IE and Chrome.

 

See file 1. my configuration is oke.

File 2. is the box in firefox, 100% great

File 3. is the box in chrome, and in IE it is the same. Wrong colors, and no footer.

 

I use Prestashop 1.5, I think that is the problem?

 

Can you fix it?

 

Greetings, Hilda

 

Send me your webpage url to give it a look

Share this post


Link to post
Share on other sites

Great module. Can I put it on just one page easily without having to write code?

 

If you want any module to be displayed in only one page, you can do it by excluding all the others in the Module Position configuration

Share this post


Link to post
Share on other sites

  • 2 weeks later...

Hello,

 

I've installed your module on my prestashop and I can't seem to get to the 'end' of the box. It keeps showing faces no matter how long I made it.

 

You can see it here at bottom right: http://www.todogamers.net/

 

 

To tell you the truth I just don't know why this is happening. It's probably theme related, because in some sites it shows correctly and in some others (like yours) it doesn't show the bottom part of the Facebook Box.

The code is the same to all and is rendered by Facebook SDK, so it doesn't have to do with the module itself. I am looking, though, for a workarround.

Share this post


Link to post
Share on other sites

  • 1 month later...
  • 2 months later...

being a newbie, how do you position the fb like box?

 

You can position "facebook LIKE box" the same way you do with every module in Prestashop. From the top menu "Modules->Positions"

 

You can find more info in Prestashop's documentation here

Share this post


Link to post
Share on other sites

  • 5 weeks later...
  • 1 month later...
  • 1 year later...
  • 5 months later...
Guest
This topic is now closed to further replies.
 Share

×
×
  • Create New...

Important Information

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