» » » cara membuat widget tombol share ringan + sederhana dan seo friendly

cara membuat widget tombol share ringan + sederhana dan seo friendly

Ghuroba - cara membuat widget tombol share ringan + sederhana dan seo friendly
بِسْــــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم
السلام عليكم 
Widget tombol share ini ringan dan berbentuk kotak-kotak warna warni sehingga tidak membuat lambat tampilan blog anda karenanya. Jadi jika anda memiliki widget tombol share yang lambat atau memakan waktu yang lama untuk menampilkannya di blog anda sebaiknya anda menggantinya dengan widget tombol share ringan + sederhana dan seo friendly.
cara membuat widget tombol share ringan + sederhana dan seo friendly
    • Login ke aku blogger anda
    • pilih Template lalu Edit HTML
    • salin script di bawah lalu letakkan diatas ]]></b:skin> dengan tekan ctrl + F
    1. /* Share Buttom */
#button-share {
    background: #f1f1f1;
    color: #000;
    line-height: 45px;
    padding-left: 10px;
    margin-top: 10px;
}

#button-share h4 {
    font-size: 13px;
    font-weight: normal;
    line-height: 40px;
    margin: 0;
    text-transform: uppercase;
    display: inline;
}

#button-share h4 span {
    background: #2c3e50;
}

#button-share a {
    position: relative;
    font: normal 13px Tahoma;
    margin: 2px;
    color: #fff;
    text-transform: uppercase;
    padding: 7px 7px 7px 7px;
    font-weight: 700;
}

#button-share a:hover {
    background: #222;
}

#button-share a:hover span {
    color: #222;
}

#button-share a span {
    line-height: 20px;
    width: 40px;
    padding: 6px 0;
    top: 0;
}

#button-share a span.fb {
    background: #2884f6;
}

.fb {
    background: #1e90ff;
}

#button-share a span.tw {
    background: #45B0E3;
}

.tw {
    background: #00bfff;
}

#button-share a span.gp {
    background: #e00;
}

.gp {
    background: #f83124;
}
    • selanjutnya salin scrpit di bawah ini lalu letakkan di bawah <data:post.body/> atau 
    <div class='post-footer'>
      1. <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;action=like&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:100%; height:25px; padding-top: 4px; border-top: 1px solid #eee; border-bottom: 1px solid #eee;'/>
<div id='button-share'>
<h4>Share :</h4>
<a class='fb' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url' rel='nofollow' target='_blank' title='Share ke Facebook'> Facebook</a>
<a class='tw' expr:href='&quot;http://twitter.com/share?url=&quot; + data:post.url' rel='nofollow' target='_blank' title='Share ke Twitter'>Twitter</a>
<a class='gp' expr:href='&quot;https://plus.google.com/share?url=&quot; + data:post.url' rel='nofollow' target='_blank' title='Share ke Google+'>Google+</a>
 </div>
      • selanjutnya Klik save / simpan dan lihat hasil widget yang telah anda buat di blog anda tersebut
      Perhatian :
    - Beckup template blog anda terlebih dahulu sebelum memasang widgat share ringan + sederhana ini
    - Jika di dalam blog anda telah ada widget share, silahkan anda hapus widget share yang ada di blog anda kemudian baru anda masukkan script yang ada di atas agar tidak terjadi error / kerusakan pada template blog anda
Baca juga :
loading...
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa

Related Post:

Back To Top