Masih melanjutkan artikel sebelumnya tentang bagaimana membuat template blog valid HTML5, pemasangan kode Facebook 'Like' button, Google Plus dan Twitter, yang sudah banyak beredar pada tutorial Blogger, akan mengakibatkan banyaknya error pada validasi HTML5 terutama pada bagian postingan yang biasanya kita pasang.
Berikut ini adalah tombol (button) yang valid HTML5 :
<a class='twitter-share-button' data-count='horizontal' data-related='' data-via='' expr:data-text='data:post.title' expr:data-url='data:post.url' href='http://twitter.com/share'>Tweet</a>
<script src='http://platform.twitter.com/widgets.js' type='text/javascript'/>Google Plus
<div class='g-plusone' data-count='true' data-size='medium' expr:data-href='data:post.url'/>
<script type='text/javascript'>
window.___gcfg = {lang: 'id'};
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>Facebook Like
<iframe expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&amp;send=false&amp;layout=button_count&amp;show_faces=false&amp;width=90&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=21"' style='border:none; overflow:hidden; width:90px; height:21px;'/>Update
Karena ada masukan dari Kang Kompi Ajaib, bahwa iframe kurang bagus untuk SEO dan disarankan untuk menggunakan kode dari Facebook Developer. Namun bagi sahabat yang ga mau buka developer fb, silahkan ikuti langkah pemasangan Facebook Like Button SEO friendly dan valid HTML5 :
1. Simpan kode ini di abawah
<body><div id='fb-root'/>
<script>//<![CDATA[
(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/id_ID/all.js#xfbml=1&appId=352634211479923";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
//]]>
</script>2. Untuk menambah kode Facebook Like Button, simpan kode ini di tempat mana kode akan dimunculkan :
<div class='fb-like' data-layout='button_count' data-send='false' data-show-faces='false' data-width='90' expr:data-href='data:post.url'/>Semoga bermanfaat...