eZ Community » Blogs » Thiago Campos Viana » Tip: Facebook like button

By

Tip: Facebook like button

Saturday 17 September 2011 9:45:24 pm

  • Currently 5 out of 5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5

In this post I'll show how to create a simple facebook like button template.

First you'll need to create a template inside your design template folder with the name "fbbutton.tpl". Put this content in this file:

{def $w=cond( is_set($width), $width, '90' )
     $l=cond( is_set($layout), $layout, 'button_count' )
     $h=cond( is_set($href), $href, concat('http://', ezini('SiteSettings', 'SiteURL', 'site.ini')))}
 
{if not(is_set($#fbbuttonjs))}
    {set scope='global' $fbbuttonjs=1}
    {literal}
        <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>
    {/literal}
{/if}
 
<div class="fb-like" data-width="{$w}" data-layout="{$l}" data-href="{$h}"
{if is_set($faces)} data-show-faces="{$faces}"{/if}></div>
 
{undef}

Now you can use this template by using the include template operator, you can specify the width, layout, show faces and the href attribute, please check the facebook like button doc for more info.

Here are some samples:

{include uri="design:fbbutton.tpl" width='150'} Will get the site URL as default
{include uri="design:fbbutton.tpl" href="http://share.ez.no" layout='standard' width='250'}

You may check also the twitter button template.

Proudly Developed with from