Cara Membuat Share Widget Keren

Intinya share widget ini sama dengan lainnya, hanya tampilannya saja yang berbeda. Sekarang mari kita kupas cara membuat widget share keren. Ikuti langkah berikut.

Langsung aja teman:

1.Log in ke blogger
2.Klik Rancangan
3.Edit HTML
4.Centang Expand Template Widget
5.Masukkan kode berikut di bawah kode <div class='post-footer-line post-footer-line-1'/>
6.Kalau tidak cocok, masukkan di bawah kode <div class='post-footer-line post-footer-line-3'/>. sesuaokan saja dengan keinginan saudara. Berikut kode yang harus dipasang.
-----------------------------------------------------------------------------------------------------------------------

<b:if cond='data:blog.pageType == "item"'>
<style>
.promote_post_bg{height:103px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDww5EAbQFHgIlvYeLMEPFDpIpT6AVtGHLsQoexvyOiv6sbFi_M2Gkp1bK9OZNMlj_UKpPlziOoCV7sS_RU9GLlGRjuoceAARmwxyTDyqMAzZeJNfK6dTsoI85lLfCu55IPh0NfnOoQVo/s1600/helperblogger.com-sharing-widget.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='helperblogger' 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'>
       <fb:like expr:href="data:post.canonicalUrl" layout='button_count' send='false'
                show_faces='false' font="verdana" action="like" colorscheme="light"></fb:like>
            <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>
                            </div>
        </div>
        <div class='promote_google'>
            <g:plusone annotation="none" size='medium'></g:plusone>
            <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>
        </div>
    </div>
</b:if>

 ------------------------------------------------------------------------------------------------------------------------------------

Selanjutnya Klik Simpan dan lihat hasilnya
Selamat mencoba dan sukses selalu