Facebook like button for every entry-post!?

Looking for a MOD? Have a MOD request? Post here for help. (Note: This forum is community supported; phpBB does not have official MOD authors)
Get Involved
User avatar
bgself
Registered User
Posts: 45
Joined: Tue Apr 10, 2012 8:17 pm

Re: Facebook like button for every entry-post!?

Post by bgself » Wed Jun 06, 2012 12:29 pm

The code works great.
I have a question... How to do that when somebody likes something in our site , it shall to be visible also with a picture in the facebook ? Similar like that:

http://alfa.kachi-snimka.info/viewer.ph ... 85670c.JPG

User avatar
Theriddler1
Registered User
Posts: 448
Joined: Sat Aug 27, 2011 11:00 pm
Location: NL
Name: Theriddler❶
Contact:

Re: Facebook like button for every entry-post!?

Post by Theriddler1 » Wed Jun 06, 2012 7:52 pm

bgself wrote:The code works great.
I have a question... How to do that when somebody likes something in our site , it shall to be visible also with a picture in the facebook ? Similar like that:

http://alfa.kachi-snimka.info/viewer.ph ... 85670c.JPG
You need something extra for that

you need to make a picture called (in this example) example.png and make sure it's 200 x 200 pixels (height x width)

Open /template/overall_header.html

FIND:

Code: Select all

 <html xmlns="http://www.w3.org/1999/xhtml" dir="{S_CONTENT_DIRECTION}" lang="{S_USER_LANG}" xml:lang="{S_USER_LANG}">
REPLACE WITH:

Code: Select all

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:og="http://ogp.me/ns#"
      xmlns:fb="https://www.facebook.com/2008/fbml" dir="{S_CONTENT_DIRECTION}" lang="{S_USER_LANG}" xml:lang="{S_USER_LANG}">
FIND:

Code: Select all

<meta name="description" content="" />
ADD AFTER on a new line:

Code: Select all

<meta property="og:title" content="{PAGE_TITLE}" />
<meta property="og:type" content="article" />
<meta property="og:url" content="{BOARD_URL}" />
<meta property="og:image" content="http://www.YOUR-BOARD-URL-HERE.COM/images/example.png" />
<meta property="og:site_name" content="{SITENAME}" />
<meta property="fb:app_id" content="APP ID HERE" />
<meta property="og:description" content="{SITE_DESCRIPTION}" />
Find:

Code: Select all

<body 
Add after on a new line:

Code: Select all

<div id="fb-root"></div>
<script>
      window.fbAsyncInit = function() {
        FB.init({
          appId      : 'your-app-id',
          xfbml      : true,
          version    : 'v2.1'
        });
      };

      (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>
(change en_US if using another language)

You need to make a facebook app id.
If you allready have a facebook app id, then replace your-app-id with your app id in the code above.

Upload overall_header.html and refresh templates and board cache.
now facebook will grab your picture you made.

also if intrested i've made a tutorial to only share topics, and the description from the first post made is taken by facebook to show on the facebook users wall. you will find it HERE
Last edited by Theriddler1 on Wed Oct 01, 2014 11:29 pm, edited 7 times in total.
Theriddler - Moderator @ phpBB.nl | phpBBservice.nl Team-member
ImageSupport Tools | Image My Extensions | buy me a beer Image

User avatar
bgself
Registered User
Posts: 45
Joined: Tue Apr 10, 2012 8:17 pm

Re: Facebook like button for every entry-post!?

Post by bgself » Thu Jun 07, 2012 10:43 am

Thank you! It was very informative. I will try this out.

User avatar
Theriddler1
Registered User
Posts: 448
Joined: Sat Aug 27, 2011 11:00 pm
Location: NL
Name: Theriddler❶
Contact:

Re: Facebook like button for every entry-post!?

Post by Theriddler1 » Thu Jun 07, 2012 12:00 pm

bgself wrote:Thank you! It was very informative. I will try this out.
no problem glad to be of any help. if you need help or get stuck or something then please let me know and will try to help you were i can.
Theriddler - Moderator @ phpBB.nl | phpBBservice.nl Team-member
ImageSupport Tools | Image My Extensions | buy me a beer Image

KnocksX
Registered User
Posts: 178
Joined: Sun Jun 10, 2012 9:58 pm

Re: Facebook like button for every entry-post!?

Post by KnocksX » Sat Jul 14, 2012 11:27 am

I'm assuming the code has changed since this topic was posted, because it doesn't really work for me. I put up the like button for every post and pressed "like" to test it and suddenly there were 27 likes. I know this is a brand new domain and nobody could have pressed like in the past. Also, those 27 likes were being shown for several posts in that topic, yet for other posts the number of likes was zero.

If there is an updated version of this code, it would be great if someone could post it here.

User avatar
newsbee
Registered User
Posts: 279
Joined: Sat Mar 29, 2003 1:07 pm
Location: Moscow
Contact:

Re: Facebook like button for every entry-post!?

Post by newsbee » Fri May 10, 2013 6:02 pm

KnocksX wrote:I put up the like button for every post and pressed "like" to test it and suddenly there were 27 likes.
You had so many likes because you haven't changed the URL to your own.
A year later, the code still works well.
What I'm trying to figure out is how to change the language from default English to the one I need.

PS. Oh, that was easy: insert the locale data, like this: <iframe src="http://www.facebook.com/plugins/like.ph ... &href=http

khabbab
Registered User
Posts: 23
Joined: Tue Apr 19, 2011 12:42 pm

Re: Facebook like button for every entry-post!?

Post by khabbab » Tue Sep 30, 2014 3:20 pm

I know its an old thread but i have a custom theme and i was trying for a simple Like button of facebook. I used following code and it works fine except that in facebook activity, an extra sentence of "Tweet this post" appears in start of topic title. Bad thing is that it is part of the post title and not a separate link. Actual post link in FB activity is correct, it is just the post title which starts with "tweet this post". Following is the code i am using on my 3.0.12 forum:

Code: Select all

<fb:like href="{BOARD_URL}/viewtopic.php?p={postrow.POST_ID}#p{postrow.POST_ID}" send="false" width="450" show_faces="true"></fb:like>
Any clues?

User avatar
Theriddler1
Registered User
Posts: 448
Joined: Sat Aug 27, 2011 11:00 pm
Location: NL
Name: Theriddler❶
Contact:

Re: Facebook like button for every entry-post!?

Post by Theriddler1 » Tue Sep 30, 2014 5:42 pm

maybe it comes from this code snippet ?

tweet this post
Theriddler - Moderator @ phpBB.nl | phpBBservice.nl Team-member
ImageSupport Tools | Image My Extensions | buy me a beer Image

khabbab
Registered User
Posts: 23
Joined: Tue Apr 19, 2011 12:42 pm

Re: Facebook like button for every entry-post!?

Post by khabbab » Wed Oct 01, 2014 2:34 pm

Theriddler1 wrote:maybe it comes from this code snippet ?

tweet this post
Yes you are correct i have resolved it now. However i am still having two issues:

1- When i add comment in the FB like box then two activities are shown both duplicate in facebook. It should appear once only.
2- The name of my phpbb forum does not appear in FB activity.

Any clues?

User avatar
Theriddler1
Registered User
Posts: 448
Joined: Sat Aug 27, 2011 11:00 pm
Location: NL
Name: Theriddler❶
Contact:

Re: Facebook like button for every entry-post!?

Post by Theriddler1 » Wed Oct 01, 2014 11:09 pm

Do you have any screenshots of the problem, also a link to your forum would be nice
Theriddler - Moderator @ phpBB.nl | phpBBservice.nl Team-member
ImageSupport Tools | Image My Extensions | buy me a beer Image

khabbab
Registered User
Posts: 23
Joined: Tue Apr 19, 2011 12:42 pm

Re: Facebook like button for every entry-post!?

Post by khabbab » Fri Oct 03, 2014 2:59 pm

Theriddler1 wrote:Do you have any screenshots of the problem, also a link to your forum would be nice

Forum link is http://www.gardeningpakistan.com And screenshot of duplicate activity is attached below.

Image

User avatar
Theriddler1
Registered User
Posts: 448
Joined: Sat Aug 27, 2011 11:00 pm
Location: NL
Name: Theriddler❶
Contact:

Re: Facebook like button for every entry-post!?

Post by Theriddler1 » Mon Oct 06, 2014 10:32 am

Something goes wrong here, you forgot to put the meta tags within your overall_header.html

Please have a look in the object debugger and fix all problems that facebook sees.

https://developers.facebook.com/tools/debug/og/object/

Use this as the url to investigate in the debugger http://www.gardeningpakistan.com/viewtopic.php?p=40697#p40697

The following edits are neccesary:

Open overall_header.html

Find:

Code: Select all

<html xmlns:fb="http://ogp.me/ns/fb#" xmlns="http://www.w3.org/1999/xhtml" dir="{S_CONTENT_DIRECTION}" lang="{S_USER_LANG}" xml:lang="{S_USER_LANG}">
Replace with:

Code: Select all

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:og="http://ogp.me/ns#" xmlns:fb="https://www.facebook.com/2008/fbml" dir="{S_CONTENT_DIRECTION}" lang="{S_USER_LANG}" xml:lang="{S_USER_LANG}">
Find:

Code: Select all

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
Add After on a new line:

Code: Select all

<meta property="og:locale" content="{S_USER_LANG}" />
<meta property="og:locale:alternate" content="en_US" />
<meta property="og:site_name" content="{SITENAME}" />
<meta property="og:url" content="THE CORRECT URL OF THE POST THAT'S BEEN LIKED" />
<meta property="og:title" content="<!-- IF SCRIPT_NAME eq 'viewtopic' -->{TOPIC_TITLE}<!-- ELSE -->{SITENAME}<!-- ENDIF -->" />
<meta property="og:type" content="article" />
<meta property="og:image" content="IMAGE URL HERE THAT WILL BE SHARED TO FACEBOOK" />
<meta property="fb:app_id" content="ENTER YOUR APP ID HERE" />
<meta property="og:description" content="{SITE_DESCRIPTION}"/>
Please note:
This line:

Code: Select all

<meta property="og:url" content="THE CORRECT URL OF THE POST THAT'S BEEN LIKED" />
I've never completed this part because every post that's been liked needs to have it's own meta tags and that's something that can't be accomplished with phpbb. (maybe with some jquery magic eg. replace function)
That's why i use facebook topic like to only like a topic and not post. See here for info

Find and remove:

Code: Select all

<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/en_US/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
Find:

Code: Select all

<body 
Add After on a new line:

Code: Select all

<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/{S_USER_LANG}/sdk.js#xfbml=1&appId=ENTER YOUR APP ID HERE&version=v2.0";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
Theriddler - Moderator @ phpBB.nl | phpBBservice.nl Team-member
ImageSupport Tools | Image My Extensions | buy me a beer Image

haleymama
Registered User
Posts: 3
Joined: Sun Nov 02, 2014 4:15 pm

Re: Facebook like button for every entry-post!?

Post by haleymama » Sun Nov 02, 2014 4:21 pm

hi i folowed this post but i cant seem to get facebook icon to show. it only shows a white square when posted

jay1110
Registered User
Posts: 1
Joined: Sat Jan 10, 2015 12:06 pm

Re: Facebook like button for every entry-post!?

Post by jay1110 » Sat Jan 10, 2015 12:09 pm


arkadin
Registered User
Posts: 15
Joined: Fri May 30, 2014 5:46 am

Re: Facebook like button for every entry-post!?

Post by arkadin » Mon Apr 13, 2015 3:37 am

Hi guys (esp TheRiddler); is the last code posted working, in order to produce results such as in the Gardening forum? That seems to be what I've been after for ages; just a FB Like button that would link back from FB to an actual post in the forum. I tried several methods last year incl the earlier code here but could never get anything working properly.
Advice appreciated thanks.

Locked

Return to “[3.0.x] MOD Requests”