Cara Menciptakan Widget Follow Google Plus, Twitter, Dan Fanspage Facebook Di Blog Yang Simpel

Baca Juga

Cara menciptakan follow google plus, twitter, dan fanspage facebook di blog Pada kesempatan kali ini saya akan menyebarkan mengenai cara menciptakan widget follow google plus, facebook dan twitter yang simpel dan bersih. Dimana semua widget itu semua dapat kita satukan sehingga jadinya nanti akan lebih rapi dan higienis serta niscaya sedap di pandang.

Untuk menciptakan widget ini pun juga sangat praktis kok, kau tinggal mengcopy beberapa arahan di bawah yang saya sediakan ini:

<style>
        /* Social Widget */
        #ForYouFreebar {
            border: 0;
            marginbottom: 10px;
            margin: 0 auto;
                width:300;
        }
        .fblikebutton {
            background: #fff;
            padding: 10px 13px 0 10px;
            borderright: 1px solid #D8E6EB;
           borderleft: 1px solid #D8E6EB;
           borderbottom: 1px solid #D8E6EB;
            margin:0px;
                height:45px;
        }
        .googleplus {
            background: #F5FCFE;
            bordertop: 1px solid #FFF;
            borderbottom: 1px solid #ebebeb;
            borderright: 1px solid #D8E6EB;
            borderleft: 1px solid #D8E6EB;
            borderimage: initial;
            fontsize: .90em;
            fontfamily: "Arial","Helvetica",sansserif;
            color: #000;
            padding: 9px 11px;
            lineheight: 1px;}
        .googleplus span {
            color: #000;
            fontsize: 11px;
            position: absolute;
            display:inlineblock;
            margin: 9px 70px;}
        .gplusone {    float: left;}
    .gplus {
            background: #fff;
            padding: 0px;
            border: 0px solid #C7DBE2;
            marginbottom:13px;}

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

    <!begin of social widget>
<div style="marginbottom:10px;">
<div id="ForYouFreebar" >

    <!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="fblikebutton">
    <!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="twitterfollowbutton" datalang="id" datashowcount="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","twitterwjs");</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 kau silahkan sesuiakan sebab lebar widget ini di sett secara default 300px silahkan sesuaikan dengan blog agan.

Bagaimana? cukup praktis bukan? Cukup demikian mudahmudahan cara menciptakan widget google plus, twitter, dan fanspage facebook yang simpel ini dapat bermanfaat.

Regards;

+Pemulung Jalanan