Friday, November 15, 2013

Cara Membuat Tombol Share di Bawah Posting

Cara Membuat Tombol Share di Bawah Posting - Pasti anda sudah sering melihat tombol share atau like yang ada di bawah posting blog, tombol share atau like ini berfungsi agar visitor atau pengunjung blog kita dapat dengan mudah membagikan artikel yang sudah kita posting ke beberapa media sosial seperti facebook, twitter, google+, dll.

Untuk memasang tombol share di bawah posting ini cukup mudah, kita hanya menambahkan sedikit kode di template blog.

tombol share keren dan gaul


Berikut langkah-langkah pemasanganya di blog :

1. Masuk ke akun blogger
2. Pilih tab Template lalu klik Edit HTML
3. Cari kode ]]></b:skin>
4. Copy kode dibawah ini diatas kode ]]></b:skin>

.widgetshare {font:bold 12px/20px Tahoma !important; background: #333;border: 1px solid #444; padding: 5px 4px; color: #fff !important; margin-top: 10px;}.widgetshare a{font:bold 12px/20px Tahoma !important; text-decoration: none !important; padding: 5px 4px; color: #fff !important; border: 1px solid #222; transition: all 1s ease;}.widgetshare a:hover {box-shadow: 0 0 5px #00ff00; border: 1px solid #e9fbe9;}.fcbok { background: #3B5999; }.twitt { background: #01BBF6; }.gplus { background: #D54135; }.digg { background: #5b88af; }.lkdin { background: #005a87; }.ltsme { background: #fb8938;
}

5. Selanjutnya copy kode berikut, dan taruh di bawah kode <div class='post-footer'> atau bisa juga di bawah kode <data:post.body/>.

Note : Perlu diperhatikan biasanya di dalam template blog terdapat lebih dari satu kode <div class='post-footer'> dan <data:post.body/> maka dari itu untuk pemasangannya tombol share ini silahkan sesuaikan dengan template yang anda gunakan.

<div class='widgetshare'>Share artikel ke: <a class='fcbok' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url' rel='nofollow' target='_blank'>Facebook</a> <a class='twitt' expr:href='&quot;http://twittter.com/share?url=&quot; + data:post.url' rel='nofollow' target='_blank'>Twitter</a> <a class='gplus' expr:href='&quot;https://plus.google.com/share?url=&quot; + data:post.url' rel='nofollow' target='_blank'>Google+</a><a class='lkdin' expr:href='&quot;http://www.linkedin.com/cws/share?url=&quot; + data:post.url' rel='nofollow' target='_blank'>Linkedin</a><a class='digg' expr:href='&quot;http://digg.com/submit?url=&quot; + data:post.url' rel='nofollow' target='_blank'>Digg</a><script>//<![CDATA[var uri = window.location.href;var ttle = document.title;document.write("<a href='http://www.lintas.me/?c=bookmarklet&url="+uri+"&title="+ttle+"' rel='nofollow' class='ltsme'>Lintasme</a>");//]]></script></div>

5. Pilih media jejaring sosial yang ingin ditampilkan.
Note : Hapus script kode berdasarkan warna apabila ingin menghapus tombol share salah satu media jejaring sosial.
Contohnya anda ingin menghapus tombol facebook maka anda tinggal menghapus kode script berwarna biru  saja.

6. Langkah terakhir simpan template anda lalu lihat hasilnya.

Demikian tutorial kali ini tentang Cara Membuat Tombol Share di Bawah Posting. Semoga artikel ini dapat bermanfaat.

5 comments:

Silahkan Berkomentar Dengan Kata-Kata yang Sopan

Powered By Blogger · Designed By Seo Blogger Templates