Page 1 of 2
Phoca Facebook Comments including custom Picture?
Posted: 13 Apr 2011, 21:38
by lolomat
Hello,
i wanna use Phoca Facebook Comments with Garys CookBook.
How can i customize this module so it will show the picture at Facebook?
Thx
Re: Phoca Facebook Comments including custom Picture?
Posted: 17 Apr 2011, 13:41
by Jan
Hi, I don't have any information about the possibility to display images by comments application in facebook.
Jan
Re: Phoca Facebook Comments including custom Picture?
Posted: 19 Apr 2011, 13:32
by cholzsch
If the fb:comments coding would be recoded to be a Like Button (fb:like)
http://developers.facebook.com/docs/ref ... gins/like/ then a picture would appear. It would involve coding meta tags to be written in the head using the Open Graph protocal.
http://developers.facebook.com/docs/opengraph/
I would love for Phoca Gallery to be updated to use Like instead of Comments. A picture (since this IS a photo gallery) on your Facebook wall draws more people to your website.
Here is a sample page I put up:
http://lha4.org/fblike.html
the sample code:
Code: Select all
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:og="http://ogp.me/ns#"
xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<title>Facebook Test Post</title>
<meta property="og:title" content="Title of Gallery"/>
<meta property="og:type" content="article"/>
<meta property="og:url" content="http://lha4.org/fblike.html"/>
<meta property="og:image" content="http://lha4.org/images/phocagallery/thumbs/phoca_thumb_l_pg293836959400.jpg"/>
<meta property="og:site_name" content="USS Nassau Crewmembers Association"/>
<meta property="og:description" content="An Image From The USS Nassau Crewmembers Association Website"/>
<meta property="fb:admins" content="1252543570"/>
</head>
<body>
<img src="http://lha4.org/images/phocagallery/thumbs/phoca_thumb_l_pg293836959400.jpg"></img>
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<fb:like></fb:like>
</body>
</html>
You'll see when you "like" the image, you are then allowed to post a comment.
So, the xmlns declarations would have to be added manually to the template code, then when the user clicks on the Facebook icon on a thumbnail, or in detail view, the proper meta property tags need to be created and inserted into the head of the page.
Re: Phoca Facebook Comments including custom Picture?
Posted: 20 Apr 2011, 15:54
by cholzsch
OK...for those of you that want a thumbnail of the image to appear in the Facebook wall post:
Edit your template's index:
After DOCTYPE, your html xmlns tag should read like this:
Code: Select all
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml" xmlns:og="http://ogp.me/ns#"
xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" >
Now, open /components/com_phocagallery/views/comment/view.html.php
Find:
Code: Select all
// ASIGN
$this->assignRef( 'tmpl', $tmpl );
$this->assignRef( 'commentitem',$commentItem);
parent::display($tpl);
After, Add:
Code: Select all
// ADD FACEBOOK META PROPERTIES
$document->addCustomTag('<meta property="og:image" content="http://'.$_SERVER['HTTP_HOST'].'/'.$item->linkthumbnailpath.'"/>');
$document->addCustomTag('<meta property="og:type" content="article"/>');
$document->addCustomTag('<meta property="fb:app_id" content="'.$tmpl['fb_comment_app_id'].'"/>');
Re: Phoca Facebook Comments including custom Picture?
Posted: 21 Apr 2011, 22:23
by Jan
Hi, thank you for this guide, anyway what is:
http://ogp.me/ns ?
Jan
Re: Phoca Facebook Comments including custom Picture?
Posted: 22 Apr 2011, 02:26
by cholzsch
Jan, you can get more detail
here, and a bit more
here.
Re: Phoca Facebook Comments including custom Picture?
Posted: 25 Apr 2011, 15:04
by Jan
Thank you, Jan
Re: Phoca Facebook Comments including custom Picture?
Posted: 23 Oct 2011, 19:12
by rkm1
this thread was very useful. although its old, i just want add a small correction in case someone else finds it...
i had to use JURI::base() for the og:image meta tag instead of variable mentioned above. I think the following is probably a more robust way of getting the url of the thumbnail for the facebook feed post:
Code: Select all
$document->addCustomTag('<meta property="og:image" content="'.JURI::base().$item->linkthumbnailpath.'"/>');
Re: Phoca Facebook Comments including custom Picture?
Posted: 17 Nov 2011, 19:04
by Jan
Hi, this can be done with:
Phoca Open Graph Plugin
https://www.phoca.cz/phoca-open-graph-plugin
Jan
Re: Phoca Facebook Comments including custom Picture?
Posted: 27 Feb 2012, 19:06
by aussiemike
I tried the opengraph plugin but couldn't get it to work. The code change above did work. I must not know enough about opengraph?
Mike