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

ples · **Joined:** Wed Nov 03, 2010 11:48 am **Posts:** 7

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:

<!-- 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:

<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!

Dr.CSS · **Posted:** Wed Nov 03, 2010 5:04 pm

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...

cyberman · **Posted:** Wed Nov 03, 2010 5:30 pm

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:

{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}

ples · **Joined:** Wed Nov 03, 2010 11:48 am **Posts:** 7

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?

ples · **Joined:** Wed Nov 03, 2010 11:48 am **Posts:** 7

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:

{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.php?mact=News,cntnt01,detail,0&cntnt01articleid=4&cntnt01returnid=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..

ples · **Joined:** Wed Nov 03, 2010 11:48 am **Posts:** 7

Hmm.. {$smarty.get.page} made the right URL on the detail page..

Darwin Web Design · **Posted:** Wed Nov 03, 2010 11:46 pm

What about:

Code:

{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.

webform · **Posted:** Thu Nov 04, 2010 1:49 am

On the Summary Template use

Code:

{$entry->link}

And on your Detail Template you can use

Code:

{$entry->canonical}

ples · **Joined:** Wed Nov 03, 2010 11:48 am **Posts:** 7

Thanks webform
Worked perfectly!

Compalink · **Posted:** Tue Mar 15, 2011 6:37 pm

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

webform · **Posted:** Tue Mar 15, 2011 7:07 pm

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:

<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:

<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/reference/plugins/like/

Compalink · **Posted:** Tue Mar 15, 2011 9:41 pm

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/index.php?mact=News,cntnt01,detail,0&cntnt01articleid=5&cntnt01returnid=56

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

thanks in advance

webform · **Posted:** Tue Mar 15, 2011 10:12 pm

I'm not sure i understand - What icons are you missing?

Compalink · **Posted:** Tue Mar 15, 2011 10:17 pm

there are supposed to be some icons, right? see attachment. I tryied on different browsers...

webform · **Posted:** Tue Mar 15, 2011 10:23 pm

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!

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

Who is online