Page 1 of 2

[Solved] Facebook "Like" on each article in "News Module"

Posted: Wed Nov 03, 2010 12:41 pm
by ples
Hello everyone

I'm developing a website for a night club. They would like to have a feature to post new events every week. For this I have chosen to use the News Module which is already included in CMSMS.
My question is how to chain a “Facebook LIKE button” to each article? For example if the night club has an event called "J-Day" and someone clicked "like" it would look something like this: "Donald likes J-day on Night Club ". I’ve seen that it can be done on other websites.
I've implemented the button in the news modules "summary template". The button appears on each item/event like it should but is not linked to each of them seperately.
Cannot figure out what code I need to put in the like buttons "href" attribute??

All the code in the "Summary Template" looks like this:

Code: Select all

<!-- Start News Display Template -->
{if $pagecount > 1}
  <p>
{if $pagenumber > 1}
{$firstpage} {$prevpage} 
{/if}
{$pagetext} {$pagenumber} {$oftext} {$pagecount}
{if $pagenumber < $pagecount}
 {$nextpage} {$lastpage}
{/if}
</p>
{/if}
{foreach from=$items item=entry}
<div class="NewsSummary"><br>

{if $entry->formatpostdate}
	<div class="NewsSummaryPostdate">
		<b>{$entry->formatpostdate}</b>
	</div>
{/if}

<div class="NewsSummaryLink">
	{$entry->titlelink}
</div>

<div class="NewsSummaryCategory">
<__script__ src="http://connect.facebook.net/en_US/all.js#xfbml=1"></__script>
<fb:like href="#" colorscheme="dark" show_faces="false"></fb:like>
</div>

{if $entry->author}

{/if}

{if $entry->summary}
	<div class="NewsSummarySummary">
		{eval var=$entry->summary}
	</div>

	<div class="NewsSummaryMorelink">
		[{$entry->morelink}]
	</div>

{else if $entry->content}

	<div class="NewsSummaryContent">
		{eval var=$entry->content}
	</div>
{/if}

{if isset($entry->extra)}
    <div class="NewsSummaryExtra">
        {eval var=$entry->extra}
	{* {cms_module module='Uploads' mode='simpleurl' upload_id=$entry->extravalue} *}
    </div>
{/if}
{if isset($entry->fields)}
  {foreach from=$entry->fields item='field'}
     <div class="NewsSummaryField">
        {if $field->type == 'file'}
          <img src="{$entry->file_location}/{$field->value}"/>
        {else}
          {$field->name}: {eval var=$field->value}
        {/if}
     </div>
  {/foreach}
{/if}


</div>
{/foreach}

<!-- End News Display Template -->
The facebook code is this:

Code: Select all

<__script__ src="http://connect.facebook.net/en_US/all.js#xfbml=1"></__script>
<fb:like href="#" colorscheme="dark" show_faces="false"></fb:like>
Hope you can help me!

Re: Facebook "Like" on each article in "News Module"

Posted: Wed Nov 03, 2010 5:04 pm
by Dr.CSS
Most comment type things for News are put on the detail part, like Comments module or CGFeedback, does this have to be facebook I like thing or can it be any type of rating system as CGFeedback has star ratings that you can show results of in/on summary...

Re: Facebook "Like" on each article in "News Module"

Posted: Wed Nov 03, 2010 5:30 pm
by cyberman
ples wrote: Cannot figure out what code I need to put in the like buttons "href" attribute??
Think you can use a similar code like for canonical url inside detail template

Code: Select all

{literal}<__script__ src="http://connect.facebook.net/en_US/all.js#xfbml=1"></__script>{/literal}
{if isset($canonical)}
<fb:like href="{$canonical}" colorscheme="dark" show_faces="false"></fb:like>
{elseif isset($content_obj)}
<fb:like href="{$content_obj->GetURL()}" colorscheme="dark" show_faces="false"></fb:like>
{/if}

Re: Facebook "Like" on each article in "News Module"

Posted: Wed Nov 03, 2010 10:01 pm
by ples
Dr.CSS wrote: Most comment type things for News are put on the detail part, like Comments module or CGFeedback, does this have to be facebook I like thing or can it be any type of rating system as CGFeedback has star ratings that you can show results of in/on summary...
Thanks for your reply!
Well it is quite important that it is connected to facebook because most of their marketing is there.. The important part is what shows in the facebook users profile when they click on the "like" button. That it is the right URL it is refering to. Do you know a way to do so?

Re: Facebook "Like" on each article in "News Module"

Posted: Wed Nov 03, 2010 10:13 pm
by ples
cyberman wrote:
ples wrote: Cannot figure out what code I need to put in the like buttons "href" attribute??
Think you can use a similar code like for canonical url inside detail template

Code: Select all

{literal}<__script__ src="http://connect.facebook.net/en_US/all.js#xfbml=1"></__script>{/literal}
{if isset($canonical)}
<fb:like href="{$canonical}" colorscheme="dark" show_faces="false"></fb:like>
{elseif isset($content_obj)}
<fb:like href="{$content_obj->GetURL()}" colorscheme="dark" show_faces="false"></fb:like>
{/if}
Hey cyberman
Thanks for your quick reply!
Think you are in to something right.. I tried it in the summary template and the detail template. But just dosent seem to work.. the URL that shows is http://localhost/cmsmadesimple/ but should look something like this http://localhost/cmsmadesimple/index.ph ... eturnid=15 . Do you have any other suggestions? Thought about using the NewsSummaryLink {$entry->titlelink} which links to the detail site, but it didnt work either.
Hope you can help me! Thanks in advance..

Re: Facebook "Like" on each article in "News Module"

Posted: Wed Nov 03, 2010 11:02 pm
by ples
Hmm.. {$smarty.get.page} made the right URL on the detail page..

Re: Facebook "Like" on each article in "News Module"

Posted: Wed Nov 03, 2010 11:46 pm
by Darwin Web Design
What about:

Code: Select all

{literal}<__script__ src="http://connect.facebook.net/en_US/all.js#xfbml=1"></__script><fb:like font="arial"></fb:like>{/literal}
put that in the news detail template, I just tried it in the blog module detail view template and it seems to work... although I haven't tested it on a live site yet, the link showed my localhost long URL exactly as it was on the blog page.

Re: Facebook "Like" on each article in "News Module"

Posted: Thu Nov 04, 2010 1:49 am
by webform
On the Summary Template use

Code: Select all

{$entry->link}
And on your Detail Template you can use

Code: Select all

{$entry->canonical}

Re: Facebook "Like" on each article in "News Module"

Posted: Sat Nov 06, 2010 2:08 pm
by ples
Thanks webform
Worked perfectly!

Re: [Solved] Facebook

Posted: Tue Mar 15, 2011 6:37 pm
by Compalink
Hello guys,

i know this post is old, but I have a couple of questions.

to webform: where exactly should I put those code you have included on the previews post? {$entry->link} and {$entry->canonical}

and my other question is: when I click on the button works ok but when I go and see the post on facebook, it shows the captcha picture???

please some help

thanks

Re: [Solved] Facebook

Posted: Tue Mar 15, 2011 7:07 pm
by webform
You put them in your News Template where you want your users to be able to click the Facebook "Like" button - Like this for the News Detail Template:

Code: Select all

<__script__ src="http://connect.facebook.net/da_DK/all.js#xfbml=1"></__script><fb:like href="{$entry->canonical}"></fb:like>
That will give you the correct url for the news article on Facebook!

If you users should be able to click the "Like" button on the Summary View of News Articles, you use this on your News Summary Template:

Code: Select all

<__script__ src="http://connect.facebook.net/da_DK/all.js#xfbml=1"></__script><fb:like href="{$entry->link}"></fb:like>
What image is shown depends on what's accessible on your page. If the only image on the page is your captcha picture, then thats is whats displayed!
If you look at the Facebook Developer site, you find code to set an image for your page/site that Facebook will use (See Open Graph Tags):

http://developers.facebook.com/docs/ref ... gins/like/

Re: [Solved] Facebook

Posted: Tue Mar 15, 2011 9:41 pm
by Compalink
thanks webform,

the link shows on facebook it works now, but there is something is not working right, can you try on my site please..

http://www.monclovabassclub.com/home/in ... eturnid=56

I cannot see the other icons beside the like button when you click on it.

thanks in advance

Re: [Solved] Facebook

Posted: Tue Mar 15, 2011 10:12 pm
by webform
I'm not sure i understand - What icons are you missing?

Re: [Solved] Facebook

Posted: Tue Mar 15, 2011 10:17 pm
by Compalink
there are supposed to be some icons, right? see attachment. I tryied on different browsers...

Re: [Solved] Facebook

Posted: Tue Mar 15, 2011 10:23 pm
by webform
You have set your Like Button colorscheme="dark" - Try to remove it as the text is white with that scheme!

You also have show_faces="false" which also removes an icon!