Menambahkan Social Sharing Widget Di Bawah Postingan

Nah kali ini saya selaku admin Poetra 86 akan update postingan yang berjudul..... 
Menambahkan Social Sharing Widget Di Bawah Postingan. Widget ini cukup menarik dan dapat mempercantik atau memperbagus blog sobat..
Biar gak penasaran sekarang mari kita bahas cara Menambahkan  Social Sharing Widget Di Bawah Postingan di Blogger sobat...

1. Masuk dulu ke akun blogger sobat.

2. lalu Pada Dasbor klik Rancangan > Edit HTML > Centang Expand Template Widget.

4. Selanjutnya sobat cari kode <data:post.body/> dengan menekan (ctrl-F)    Jika sobat menemukan 2 atau 3 kode <data:post.body/> pilih kode yang ke 2, dan letakkan di bawahnya

5. Jika sobat sudah menemukannya sekarang copy  kode di bawah ini dan paste atau letakkan di bawah kode tadi.

<b:if cond='data:blog.pageType == "item"'>


<style>
.promote_post_bg {
    height: 103px;
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNdtb7tjBO2Gx8aoLe52hXi0dtICyj39mSbvFpE1ha5EiL45ymP3xsqEcBLRek2-PBIJYW2LS4Gia9ycYGKjkhPdhRGNPVFgQbO21G6Io8rwyXpPPas0-DpXB-1pXa8Ew3BHyJoUUwXeQ/s1600/otowebsite-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='otowebsite' 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>

6. Simpan Template sobat.

<!> : Jika sobat meletakkan di bawah kode <data:post.body/> tapi tidak muncul maka sobat cukup cari kode <div class='post-footer-line post-footer-line-1'/> dan letakkan kode pada langkah lima di atasnya.