Kali ini saya akan memperkenalkan kepada anda widget terbaru jejaring sosial, yaitu cara membuat tombol like facebook, tweet, dan google plus di bawah posting blog anda dengan gaya dan penampilan yang keren. Langsung saja cara membuatnya.
1. Login ke Blog kamu.
2. Pilih Rancangan, Pilih Edit HTML, jangan lupa Centang Expand Widget Template nya.
3. Cari kode <data:post.body/>
4. Setelah ketemu copy kode di bawah ini dan letakan tepat di bawah kode nomor 3.
<b:if cond='data:blog.pageType == "item"'>Simpan dan lihat hasilnya.
<style>
.promote_post_bg {
height: 103px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgaigktfC08v-DxFyX9f903fqCr-TCrPThgLPdqssXQJWCChRjHomiCxwGuAouTceBYH664oBgvwjpHszklaDVqCCHR_2SgQPDamHD-3ESROmWdVje8OsOILWHQqVa8TAakURgu66lzLcE/s1600/latesthack.png) 0 -7px no-repeat;
width: 500px;
margin-left: 65px;
}
.promote_twitter {
width: 130px;
height: 38px;
float: left;
margin: 0 39px 0 0;
padding: 65px 0 0 13px;
text-align: center;
}
.promote_facebook {
width: 115px;
height: 40px;
float: left;
margin: 0 39px 0 0;
padding: 63px 0 0 28px;
text-align: center;
}
.promote_google {
width: 65px;
height: 40px;
float: left;
margin: 0 39px 0 0;
padding: 65px 0 0 28px;
text-align: center;
}
</style>
<div class='promote_post_bg'>
<div class='promote_twitter'>
<a class='twitter-share-button' data-via='Mr_RaVictory' href='https://twitter.com/share'>Tweet</a>
<script>
!
function (d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (!d.getElementById(id)) {
js = d.createElement(s);
js.id = id;
js.src = "//platform.twitter.com/widgets.js";
fjs.parentNode.insertBefore(js, fjs);
}
}(document, "script", "twitter-wjs");
</script>
</div>
<div class='promote_facebook'>
<div>
<b:if cond='data:post.isFirstPost'>
<script>
(function (d) {
var js, id = 'facebook-jssdk';
if (d.getElementById(id)) {
return;
}
js = d.createElement('script');
js.id = id;
js.async = true;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
</script>
</b:if>
<fb:like expr:href="data:post.canonicalUrl" layout='button_count' send='false'
show_faces='false' font="verdana" action="like" colorscheme="light"></fb:like>
</div>
</div>
<div class='promote_google'>
<script type='text/javascript'>
(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>
<g:plusone annotation="none" size='medium'></g:plusone>
</div>
</div>
</b:if>
2 komentar:
wah lumayan nih widget buat nambah-nambah traffic. happy blogging
postingannya bermanfaat banget
thanks gan
kapan2 saya berkunjung lagi
Posting Komentar