Cara membuat widget follow google plus, twitter, dan fanspage facebook di blog yang simpel

Cara membuat follow google plus, twitter, dan fanspage facebook di blog - Pada kesempatan kali ini saya akan berbagi mengenai cara membuat widget follow google plus, facebook dan twitter yang simpel dan bersih. Dimana semua widget itu semua bisa kita satukan sehingga hasilnya nanti akan lebih rapi dan bersih serta pasti sedap di pandang.

Untuk membuat widget ini pun juga sangat gampang kok, kamu tinggal mengcopy beberapa kode di bawah yang saya sediakan ini:

<style>
        /* Social Widget */
        #ForYouFree-bar {
            border: 0;
            margin-bottom: 10px;
            margin: 0 auto;
                width:300;
        }
        .fb-likebutton {
            background: #fff;
            padding: 10px 13px 0 10px;
            border-right: 1px solid #D8E6EB;
           border-left: 1px solid #D8E6EB;
           border-bottom: 1px solid #D8E6EB;
            margin:0px;
                height:45px;
        }
        .googleplus {
            background: #F5FCFE;
            border-top: 1px solid #FFF;
            border-bottom: 1px solid #ebebeb;
            border-right: 1px solid #D8E6EB;
            border-left: 1px solid #D8E6EB;
            border-image: initial;
            font-size: .90em;
            font-family: "Arial","Helvetica",sans-serif;
            color: #000;
            padding: 9px 11px;
            line-height: 1px;}
        .googleplus span {
            color: #000;
            font-size: 11px;
            position: absolute;
            display:inline-block;
            margin: 9px 70px;}
        .g-plusone {    float: left;}
    .gplus {
            background: #fff;
            padding: 0px;
            border: 0px solid #C7DBE2;
            margin-bottom:-13px;}

        .twitter {
            background: #EEF9FD;
            padding: 10px;
            border: 1px solid #C7DBE2;
            border-top: 0;}
</style>

    <!--begin of social widget-->
<div style="margin-bottom:10px;">
<div id="ForYouFree-bar" >

    <!-- Google Plus-->
    <div class="gplus"> <link href="http://plus.google.com/111282858122124201917" rel="publisher" />

    <!-- Place this tag where you want the badge to render -->
<g:plus href="http://plus.google.com/111282858122124201917" width="300" height="69" margin="0px" theme="light"></g:plus>
</div>

    <div class="fb-likebutton">
    <!-- Facebook -->
    <iframe src="//www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com/perjuangkansuksesmu/&amp;send=false&amp;layout=standard&amp;width=230&amp;show_faces=false&amp;font=arial&amp;colorscheme=light&amp;action=like&amp;height=80&amp;appId=142184962628769" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:230px; height:80px;" allowtransparency="true"></iframe>
</div>

    <div class="twitter">
    <!-- Twitter -->
<a class="twitter-follow-button" data-lang="id" data-show-count="true" href="https://twitter.com/tedieka07">Ikuti @tedieka07</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></div>

Berikut keterangannya:

1. Silahkan ganti yang warna merah dengan ID google plus kamu
2. Warna hijau ganti dengan ID akun twitter
3. Warna biru ganti dengan halaman fanspage facebook 

Apabila ada lebar widget tidak sesuai dengan blog kamu silahkan sesuiakan karena lebar widget ini di sett secara default 300px silahkan sesuaikan dengan blog agan.

Bagaimana? cukup mudah bukan? Cukup demikian mudah-mudahan cara membuat widget google plus, twitter, dan fanspage facebook yang simpel ini bisa bermanfaat.

Regards;

+Pemulung Jalanan