Mengulas Misteri dan Blogging

Membuat Tombol Facebook Twitter Google Plus Pinterest di Blog

Tombol Media Sosial

Membuat Tombol Facebook Twitter Google Plus Pinterest di Blog - Tombol yang biasa disebut tombol share sosial media ini sangat penting untuk blog. Tombol ini berguna untuk memberikan fasilitas dan mempermudah pembaca jika mereka ingin menge-share postingan blog kita ke media sosial. Ada juga tombol Like Facebook yang berguna apabila mereka menyukai konten yang telah mereka baca di blog kita dapat meng-klik tombol ini. Seperti pada gambar di bawah ini.

Tombol Share Sosial Media

Biasanya, tombol-tombol tersebut terletak di bawah postingan. Seperti yang sudah pernah ditulis oleh +Kang Mousir dengan postingannya yang berjudul Membuat Tombol Facebook, Twitter dan Google Plus Valid HTML5, maka saya juga akan berbagi pada anda tombol-tombol tersebut. Cuma, di sini saya menambahkan tombol Pinterest yang mungkin cocok bagi blog anda yang penuh dengan gambar-gambar. Dan tombol Pinterest-nya pun sudah saya beri asynchronous sehingga tidak terlalu membebani blog.

Untuk membuatnya, silahkan simpan CSS berikut di atas ]]></b:skin> atau </style>

.share{display:block;padding:0;margin:0}
#pin-wrapper &gt; a {background-image:none !important;}

Lalu, masukkan kode pemanggilnya di daerah bawah postingan blog anda.

<div class='share'>
<span style='float:left;margin:7px 20px 0 0;font-weight:bold'>Bagikan Artikel Ini :</span>
<div style='float:left;margin:5px 20px 5px 5px;'>
<div class='fb-like' data-layout='button_count' data-send='false' data-show-faces='false' data-width='90' expr:data-href='data:post.url'/>
  </div>
<div style='float:left;margin:7px; 0 0 0'>
<a class='twitter-share-button' data-count='horizontal' data-related='' data-via='' expr:data-text='data:post.title' expr:data-url='data:post.url' href='http://twitter.com/share'>Tweet</a>
</div>
<div style='float:left;margin:7px; 0 0 0'>
<div class='g-plusone' data-count='true' data-size='medium' expr:data-href='data:post.url'/>
</div>
  
<div id='pin-wrapper' style='float: left; margin:7px 0 0 10px; width:44px;'>
<a data-pin-config='beside' data-pin-do='buttonPin' expr:href='&quot;http://pinterest.com/pin/create/button/?url=&quot; + data:post.url'><img src='//assets.pinterest.com/images/pidgets/pin_it_button.png'/></a>
<span style='margin-left:-44px;'><a data-pin-config='beside' data-pin-do='buttonBookmark' href='//pinterest.com/pin/create/button/' style='outline:none;border:none;'/></span>
</div> 
<script async='async' src='http://assets.pinterest.com/js/pinit.js' type='text/javascript'/>

  <div class='clear'/>
</div>

Kemudian, letakkan javascript di bawah ini di atas </body>

<script type='text/javascript'>
//<![CDATA[
(function(){var fb1=document.createElement('script');fb1.type='text/javascript';fb1.async=true;fb1.src='http://connect.facebook.net/id_ID/all.js#xfbml=1','facebook-jssdk';var fb2=document.getElementsByTagName('script')[0];fb2.parentNode.insertBefore(fb1,fb2)})();(function(){var tw1=document.createElement('script');tw1.type='text/javascript';tw1.async=true;tw1.src='http://platform.twitter.com/widgets.js';var tw2=document.getElementsByTagName('script')[0];tw2.parentNode.insertBefore(tw1,tw2)})();(function(){var gp1=document.createElement('script');gp1.type='text/javascript';gp1.async=true;gp1.src='https://apis.google.com/js/plusone.js';var gp2=document.getElementsByTagName('script')[0];gp2.parentNode.insertBefore(gp1,gp2)})();
//]]>
</script>

Terakhir, silahkan simpan. Dan lihat hasilnya. 

8 Komentar untuk "Membuat Tombol Facebook Twitter Google Plus Pinterest di Blog"

mantap gan tutorialnya |o| :-d
izin save ya gan, kali aja nanti dibutuhkan

Iya gan. silahkan disave... :D

Makasih gan untuk tutornya, sangat membantu :) :-bd
http://goo.gl/y46Sp3

+++
Merasa kurang hoki bermain judi di situs lain ? atau Ingin mendapatkan income tanpa bekerja ?
KAMI HADIR UNTUK ANDA , MARI BERGABUNG BERSAMA KAMI DI RUBYQQ
PRESENTASI KEMENANGAN 80% ( MENANG ATAU KALAH TETAP DAPAT BONUS )
100 % PLAYER vs PLAYER !!
Hanya dengan 1 USER ID anda bisa main 7 GAMES :
* Bandar Poker | Poker Online | Capsa Susun | DominoQQ | BandarQ | AduQ | SAKONG ONLINE |
* Pendaftaran FREE ==> https://goo.gl/AQYhSc
* Minimal Deposit & Withdraw HANYA Rp.15.000,-
* Bonus Turn Over 0,5% SETIAP HARI DIBAGIKAN
* Bonus Referral 20% Seumur Hidup
* MEGA JACKPOT RATUSAN JUTA RUPIAH
* Customer Service siap melayani anda 24 jam

Untuk informasi lebih lengkap silahkan Hubungi Customer Service kami
BBM : 2B8938F7
FACEBOOK : rubyqq
SKYPE : RUBY QQ
LIVECHAT https://goo.gl/AQYhSc

Salam Hangat Dari royalQQ untuk semua Juragan Juragan ??
Kini Hadir Game Terbaru : ==> GAME SAKONG
Jangan ditunggu lagi para Juragan yang ingin mencari agen poker terpercaya dan tanpa ROBOT/ADMIN
Kami hadir Berkat Para Juragan yang ingin bermain Poker dengan Sportif
Ayo Juragan, Jangan ditunda lagi... Segerah Bergabung Bersama Kami Di RoyalQQ
Kami Juga Menyediakan Berbagai Promo2 Untuk Para Member RoyalQQ.
Disini kami juga menyediakan CS yang siap melayani Para Juragan Dengan Sebaik-baiknya (24jam/hari).
Minimal Depo Dan WD: Min DEPO 15RB & Min WD 15RB
Dijamin Proses Depo Dan Wd Yang Tercepat.

Komentar ini telah dihapus oleh pengarang. - Hapus

Ayo segera bergabung dengan Agen Judi Poker Online Terbaik dan Terpercaya di Indonesia KacangMasPoker | www.kacangmaspoker.net | . Dapatkan Jackpot hingga Jutaan rupiah setiap harinya !!

• Bonus New Member & Next Deposit s/d Rp. 1.000.000,-
• Bonus Jackpot s/d Rp. 200.000,-
• Bonus TurnOver 0,5%
• Bonus Referral 20%

# LINE : pokerkcm
# BBM : pokerkcm
# WHATSAPP : +6287819742741
# Twitter : kcm__poker
# IG : kcm_p0ker

• 7 Games dalam 1 ID
| Texas Poker | Capsa Susun | Ceme | Domino QQ | Bandar Ceme | Super 10 | Omaha |

• BCA - BNI - BRI - CIMB - Danamon - Mandiri.
• Menerima Deposit via Go-Pay, Ovo & Pulsa Telkomsel / XL

Link Alternatif:
• www.kacangmaspoker.xyz
• www.kacangmaspoker.club
• www.kacangmaspoker.live

Numpang ya min ^^

Bonus New Member 50%!!! Bukan server IDN maupun PokerV! Cobalah bermain di server baru 1G Poker hanya di kenaripoker . com! Proses deposit dan withdraw tidak basa basi langsung tinggal proses dan main saja bosku, dicoba keberuntungan kamu sekarang juga hanya di kenaripoker . com!

WHATSAPP : +855966139323
BBM : KENARI00
LIVE CHAT : KENARIPOKER . COM
ALTERNATIVE LINK : KENARIPOKER . COM

Silahkan berkomentar yang relevan. Jangan menyertakan link aktif di sini. Jika melanggar, komentar akan terhapus.

Emoticon : :) :( =( ^_^ :D =D |o| @@, ;) :-bd :-d :P :kak: