Senin, 04 September 2017

Cara Menciptakan Widget Share Simple Tanpa Javascript

Cara Mengganti "Poskan Komentar" Teks Dengan Gambar di Blog, namun di sore hari ini aku akan menyebarkan ihwal Cara Membuat Widget Share Simple Tanpa Javascript. Langsung saja,

Widget Share, menurut aku sih widget ini salah satu widget penting untuk sebuah blog, soalnya kenapa? semoga artikel-artikel kita yang bermanfaat sanggup pribadi di share ke situs jejaring sosial, ibarat Facebook, Twitter, Google+ dan Lain-lain, dan tentunya sanggup menambah traffict juga ke blog kita. Widget Share ini kenapa aku sebut simple alasannya tidak memakai gambar dan Javascript. berikut screenshot nya :

Cara Membuat Widget Share Simple Tanpa Javascript Cara Membuat Widget Share Simple Tanpa Javascript

Tertarik ga nih? Jika agan agan ingin memasangnya sanggup ikuti langkah-langkah di bawah ini :

Login Ke Akun Blogger
Pergi Ke Halaman Edit Template => klik edit HTML
Cari kode </b:skin> (Ctrl+F untuk pencarian semoga lebih mudah)
Copy paste instruksi dibawah ini tepat di atas instruksi tadi
.sharecontain {background: #cccccc;border: 1px solid #999;padding: 5px;}
.fbshare {line-height: 20px; color: #fff !important; background: #3b5998; text-decoration: none !important; border: 1px solid #313c7d; padding: 3px; font-family: arial, verdana, sans-serif; font-size: 12px; border-radius: 2px;}
.twshare {color: #fff !important; background: #4099FF; text-decoration: none !important; border: 1px solid #3a8be8; padding: 3px; font-family: arial, verdana, sans-serif; font-size: 12px; line-height: 20px; border-radius: 2px;}
.plshare {color: #fff !important; background: #c0361a; text-decoration: none !important; border: 1px solid #9c2c15; padding: 3px; font-family: arial, verdana, sans-serif; font-size: 12px; line-height: 20px; border-radius: 2px;}
.dgshare {color: #fff !important; background: #5b88af; text-decoration: none !important; border: 1px solid #4a6f8f; padding: 3px; font-family: arial, verdana, sans-serif; font-size: 12px; line-height: 20px; border-radius: 2px;}
.lkshare {color: #fff !important; background: #005a87; text-decoration: none !important; border: 1px solid #003f5e; padding: 3px; font-family: arial, verdana, sans-serif; font-size: 12px; line-height: 20px; border-radius: 2px;}
.tcshare {color: #fff !important; background: #157501; text-decoration: none !important; border: 1px solid #105901; padding: 3px; font-family: arial, verdana, sans-serif; font-size: 12px; line-height: 20px; border-radius: 2px;}
Jika Sudah, Cari instruksi <data:post:body/>, lalu tambahkan instruksi di bawah ini sempurna di bawah instruksi tadi :
<div class='sharecontain'>
Bagikan Ke:
<a class='fbshare' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url' rel='nofollow' target='_blank'>Facebook</a>
<a class='twshare' expr:href='&quot;http://twitter.com/share?url=&quot; + data:post.url' rel='nofollow' target='_blank'>Twitter</a>
<a class='plshare' expr:href='&quot;https://plus.google.com/share?url=&quot; + data:post.url' rel='nofollow' target='_blank'>Google+</a>
<a class='lkshare' expr:href='&quot;http://www.linkedin.com/cws/share?url=&quot; + data:post.url' rel='nofollow' target='_blank'>Linkedin</a>
<a class='tcshare' expr:href='&quot;http://technorati.com/faves?sub=addfavbtn&amp;add=&quot; + data:post.url' rel='nofollow' target='_blank'>Technorati</a>
<a class='dgshare' expr:href='&quot;http://digg.com/submit?url=&quot; + data:post.url' rel='nofollow' target='_blank'>Digg</a>
</div>
 Oke, cukup sekian post aku ihwal Cara Membuat Widget Share Simple Tanpa Javascript, semoga berhasil :) kalau ada yang ingin di tanyakan tinggal tanyakan di kolom komentar di bawah :) Terima Kasih..

Sumber http://nandarious.blogspot.com


EmoticonEmoticon