Sedikit Info Seputar
Membuat Tombol Facebook, Twitter dan Google Plus Valid HTML5
Terbaru 2017
- Hay gaes kali ini team Free Template BLogspot.Com, kali ini akan membahas artikel dengan judul Membuat Tombol Facebook, Twitter dan Google Plus Valid HTML5, kami selaku Team Free Template BLogspot.Com telah mempersiapkan artikel ini untuk sobat sobat yang menyukai Free Template BLogspot.Com. semoga isi postingan tentang
Artikel Facebook,
Artikel Google Plus,
Artikel HTML5,
Artikel Sosial Media,
Artikel Tutorial Blogger,
Artikel Twitter, yang saya posting kali ini dapat dipahami dengan mudah serta memberi manfa'at bagi kalian semua, walaupun tidak sempurna setidaknya artikel kami memberi sedikit informasi kepada kalian semua. ok langsung simak aja sob
Judul:
Berbagi Info Seputar
Membuat Tombol Facebook, Twitter dan Google Plus Valid HTML5
Terbaru
link: Membuat Tombol Facebook, Twitter dan Google Plus Valid HTML5
Berbagi Membuat Tombol Facebook, Twitter dan Google Plus Valid HTML5 Terbaru dan Terlengkap 2017
iframe, seperti yang sudah Saya bahas sebelumnya bahwa iframe sangat tidak bagus untuk SEO.Pada tombol share ini Saya mengubahnya menjadi Asyncron agar kinerjanya lebih cepat. Silakan Anda simak baik - baik.
Tombol Facebook
<div id='fb-root'/>
<span class='fb-like' data-layout='button_count' data-send='false' data-show-faces='false' expr:data-href='data:post.url'/>Tombol Twitter
<a class='twitter-share-button' data-count='horizontal' expr:data-text='data:post.title' expr:data-url='data:post.url'>Tweet</a>Tombol Google Plus
<div class='g-plusone' data-count='true' data-size='medium' expr:data-href='data:post.url'/>JavaScript
Silakan Anda simpan JavaScript Asyncron ini diatas kode</body>. <script type='text/javascript'>
//<![CDATA[
(function(){var fb1=document.createElement('script');fb1.type='text/javascript';fb1.async=true;fb1.src='http://connect.facebook.net/id_ID/all.js#xfbml=1','facebook-jssdk';var fb2=document.getElementsByTagName('script')[0];fb2.parentNode.insertBefore(fb1,fb2)})();(function(){var tw1=document.createElement('script');tw1.type='text/javascript';tw1.async=true;tw1.src='http://platform.twitter.com/widgets.js';var tw2=document.getElementsByTagName('script')[0];tw2.parentNode.insertBefore(tw1,tw2)})();(function(){var gp1=document.createElement('script');gp1.type='text/javascript';gp1.async=true;gp1.src='https://apis.google.com/js/plusone.js';var gp2=document.getElementsByTagName('script')[0];gp2.parentNode.insertBefore(gp1,gp2)})();
//]]>
</script>Cara Memasangnya
Pertama silakan Anda simpan CSS ini diatas kode]]></b:skin> atau </style>. .share{display:block;padding:0;margin:0}<b:includable id='post' var='post'>
<article class='post hentry' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>
.....
<data:post.body/>
.....
</article>
</b:includable><data:post.body/> bila ingin menyimpanya diatas artikel atau simpan dibawah kode <data:post.body/> bila ingin menyimpannya dibawah artikel. Sehingga menjadi kode dibawah ini, perhatikan kode yang Saya tandai. <b:includable id='post' var='post'>
<article class='post hentry' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>
.....
<data:post.body/>
<div class='share'>
<span style='float:left;margin-right:35px;font-weight:bold'>Bagikan :</span>
<div id='fb-root'/><span class='fb-like' data-layout='button_count' data-send='false' data-show-faces='false' expr:data-href='data:post.url' style='margin-right:40px;'/><a class='twitter-share-button' data-count='horizontal' expr:data-text='data:post.title' expr:data-url='data:post.url'>Tweet</a><div class='g-plusone' data-count='true' data-size='medium' expr:data-href='data:post.url'/>
<div class='clear'/>
</div>
.....
</article>
</b:includable>