Jump to:

1835 Posts in 1139 Topics by 554 members

Blog Module

SilverStripe Forums » Blog Module » Facebook Like Button

Discuss the Blog Module.

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

Page: 1
Go to End
Author Topic: 3184 Views
  • e360
    Avatar
    Community Member
    6 Posts

    Facebook Like Button Link to this post

    Has anyone integrated the Facebook Like button with the blog module?
    http://developers.facebook.com/docs/reference/plugins/like

  • Willr
    Avatar
    Forum Moderator
    5462 Posts

    Re: Facebook Like Button Link to this post

    Yes - we have on http://www.silverstripe.org/blog/. Its really easy. Use the facebook tool to generate the iframe code. For silverstripe.org we altered the BlogSummary.ss template (blog/templates/Includes/) and the BlogEntry.ss template (blog/templates/Layout/BlogEntry.ss).

    Rather than edit those files directly in blog/ you should copy them to your current theme. Keep the location of the file in your theme the same as it is in the module (i.e BlogSummary should be copied from blog/templates/Includes/ to themes/yourthemename/templates/Includes) then you can edit it as much as you wish using your text editor

    For SS.org/blog I added the following

    <iframe src="http://www.facebook.com/plugins/like.php?href={$AbsoluteLink}&amp;layout=button_count&amp;show_faces=false&amp;width=150&amp;action=like&amp;colorscheme=light&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:150px; height:21px;" allowTransparency="true"></iframe>

    The only really SS specific part of that (that's mostly straight from facebook) is the $AbsoluteLink in the ?href part. This passes the full URL to the current page.

    And to add a tweet button is similar. This is the code I used for tweets in the template

    <a href="http://twitter.com/share" class="twitter-share-button" data-text="$Title" data-url="$AbsoluteLink" data-count="horizontal" data-via="silverstripe" data-related="dawnapp">Tweet</a>
    </div>
       
    <script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>

    Again this mostly comes from Twitter but the $Title and $AbsoluteLink send information about the page to twitter.

    Any question feel free to ask

  • biapar
    Avatar
    Forum Moderator
    435 Posts

    Re: Facebook Like Button Link to this post

    It works for me.

  • Jamine
    Avatar
    Community Member
    3 Posts

    Re: Facebook Like Button Link to this post

    Hi Willr, I tried the Iframe code, but it doesn't work for multiple "facebook like button" in one page...I tried the XFBML code and it works..

    BlogSummarry.ss
    <script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like href="$FBBlogURL" layout="button_count" show_faces="false" width="450"></fb:like>

    Page.ss
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html lang="$ContentLocale" xmlns="http://www.w3.org/1999/xhtml" xmlns:og="http://opengraphprotocol.org/schema/" xmlns:fb="http://www.facebook.com/2008/fbml">

    see the link for more info: http://hillarsaare.com/multiple-facebook-like-buttons-on-one-page/

  • BuddhaSource
    Avatar
    Community Member
    57 Posts

    Re: Facebook Like Button Link to this post

    xfbml code works fine when we are on .SS file.

    Can I add <fb:like > </fb:like> in the html content?

    I have tried adding these codes but no effect

    HtmlEditorConfig::get('cms')->setOption('extended_valid_elements', 'fb:like[href|show_faces|width|height|stream|header|send|font]');

    3184 Views
Page: 1
Go to Top

Want to know more about the company that brought you SilverStripe? Then check out SilverStripe.com

Comments on this website? Please give feedback.