Cara Pasang Tombol Share Facebook, Twitter, dan Google Plus di Akhir Postingan Blog

Cara Pasang Tombol Share Facebook, Twitter, dan Google Plus di Akhir Postingan Blog Hi all, jumpa lagi dengan saya di Blog Cara Ririn. Pernahkah anda melihat tombol share jejaring sosial yang terpasang di postingan blog? jika pernah, pasti terlihat menarik kan? Selain widget tersebut terlihat cantik dan menarik, ternyata ada banyak manfaatnya lho apabila di pasang di blog/web kita.

Apa saja manfaatnya? antara lain adalah (i) memudahkan admin dan pemirsa blog untuk melakukan share artikel ke jejaring sosial, (ii) bisa membantu peringkat SEO, ini khusus tombol plus dari Google+. (iii) dapat meningkatkan jumlah pageview blog, (iv) dan masih banyak lagi manfaatnya.

Untuk proses instalasi widget tombol ini, sangatlah mudah. Anda hanya perlu melakukan editing pada template blog anda. Yakni dengan menambahkan script khusus ke template blog anda.
Tombol Share Social Media, cara menambahkan atau memasukkan tombol share like fb, twitter, dan google plus di bawah artikel blogger/blogspot
Image by dibukasaja.blogspot.com
Setelah sebelumnya saya membahas tentang Cara Pasang Widget Twitter di Blog. Dalam kesempatan yang berbahagia ini, saya akan menjelaskan tentang cara menambahkan atau memasukkan tombol share like fb, twitter, dan google plus di bawah artikel blogger/blogspot. Silahkan perhatikan langkah-langkah berikut ini.

Cara Pasang Tombol Share Facebook, Twitter, dan Google Plus di Akhir Postingan Blog

1. Silahkan log in ke akun Blogger anda

2. Silahkan masuk ke Dashboard dan kemudian pilih Menu Template

3. Pada Menu Template, silahkan klik tombol Edit HTML

4. Anda akan menjumpai script yang jumlahnya ribuan. Silahkan cari kode <data:post.body/>. Untuk memudahkan proses pencarian, silahkan tekan CTR + F.

5. Setelah kode <data:post.body/> sudah anda temukan, silahkan letakkan kode berikut ini tepat di bawah kode <data:post.body/>.

<b:if cond='data:post.isFirstPost'>
<!-- Facebook -->
<div id='fb-root'/>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "http://connect.facebook.net/en_US/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));


</script>
<!-- Google +1 -->
<script type='text/javascript'>
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>


<!-- Twitter -->
<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","twitter-wjs");</script>
</b:if>
<!-- Scripts End -->
<!-- Horizontal social buttons Start -->


<b:if cond='data:blog.pageType != "static_page"'>
<div class='horizontal-social-buttons' style='padding:5px 0 5px;'>
<!-- Twitter -->
<div style='float:left;'>
<a class='twitter-share-button' data-count='horizontal' data-lang='en' data-related='' data-via='' expr:data-text='data:post.title' expr:data-url='data:post.url' href='https://twitter.com/share'>Tweet</a>
</div>
<!-- Google +1 -->


<div style='float:left;'>
<g:plusone annotation='bubble' expr:href='data:post.url' size='medium'/>
</div>
<!-- Facebook Like+Send -->
<div style='float:left;'>
<fb:like colorscheme='light' expr:href='data:post.url' font='' layout='button_count' send='true' show_faces='false'/>
</div>
</div>
</b:if>


<div style='clear: both;'/>

Catatan:
Kode <data:post.body/> jumlah nya sekitar 3 sampai 4. Silahkan pilih kode <data:post.body/> yang ke 3 atau yang ke 4.

6. Setelah itu silahkan klik tombol Save/Simpan. Dan lihat hasilnya.

Bila anda berhasil memasangnya, maka tombol share jejaring sosial akan tampil seperti screenshoot berikut ini.
Cara Pasang Tombol Share Facebook, Twitter, dan Google Plus di Akhir Postingan Blog
Demikian tutorial sederhana yang dapat saya sampaikan untuk anda sekalian tentang Cara Pasang Tombol Share Facebook, Twitter, dan Google Plus di Akhir Postingan Blog. Mudah-mudahan tutorial ini bisa membantu Sahabat Blogger yang beberapa waktu yang lalu telah bertanya kepada saya tentang hal ini. Dan semoga bisa bermanfaat untuk kita semua. Jangan lupa baca tutorial menarik lainnya di blog saya tentang Cara Membuat dan Memasang Facebook Like Box di Blog. Terimakasih atas perhatiannya.
Share artikel ke: Facebook Twitter Google+

59 komentar:

Rohis Facebook said...
This comment has been removed by a blog administrator.
Mas Marnes said...

Kembali hadir lagi disini mba' ririn...
Iya mba' sering banget liat blog temen-temen yang menggunakan widget tersebut, selain blog jadi lebih menarik dilihat widget tersebut juga bermanfaat buat share artikel ke berbagai jejaring sosial.

Blog saya juga sudah ada tombol sharenya tapi gak ada salahnya kalo saya mencoba mempraktekan cara pasang tombol share diatas, pengen ganti juga sie...thanks udah share tutorialnya :)

Anonymous said...

Keren nih kapan-kapan saya akan coba terapkan di blog saya :)
Artikel mas ririn memang bermanfaat semua dan penjelasanya sangat jelas dan mudah di mengerti. Terima kasih ya mbak ririn :D

Unknown said...

saya juga pernah pasang tombol itu mba, tpi saya ganti lg, hehe.. Thankz mba artikelnya, :-)

Kang Ucup said...

Alhamdulillah di blog saya sudah ada mbak, memang penting sekali fungsi dari tombol-tombol tersebut, karena dapat menaikkan jumlah kunjungan ke artikel terkait. tapi tombol yang ada di blog saya kebanyakan masih perawan karena jarang disentuh pengunjung :)

Claresta said...

Penting sekali ya mbak, tombol share itu. Jadi pembaca bisa share artikel kita kepada teman2nya di facebook dan twitter, dan juga facebook.
Info yg bermanfaat ^_^

Anonymous said...

Datang lagi, di aratikel Mbak Rin, nyimak aja nih Mbak
Enakan yaah Mbak dengan adanya widget, jejaringan sosial
Kala mau share postingan tinggal klik saja, simple praktis dan dinamis
Terima kasih atas artikelnya Mbak Rin.

Unknown said...

Eeeh samapai lupa Nice artikel nya Adminya juga lebih nice dueeh tt3tt3tt3
Salam Bravo blogging juga buat Sobat blogging semua,. tetap semangat Sob

Unknown said...

emang itu penting juga buat yang berbisnis apalagi mungkin lebih cepat pencariannya

Mizz Aiza said...

sangat bermanfaat titorial ini.. template blog saya telah tersedia tombol itu.. tapi kelihatannya tidak bewarna.. kenapa ya?

Intan Sudibjo said...

kalo disimpen di post:body ke dua jadinya gimana mba? :D

Masnady said...

wah sip deh mbak.. saya save dulu ya mbak.. di blog saya sih sudah ada, tapi sepertinya terlalu banyak mbak. berat jadinya.. kapan kapan saya ganti dengan ini deh....

Anonymous said...

wah punya saya belum ada nih mba', ijin coba mba'

Unknown said...

paling di share ke facebook, twitter dan google+ aja mbak kalo saya.

Anonymous said...

Salah satu cara untuk membuat pageview blog naik, yaitu menarik pengunjung menshare artikel blog kita :) bagus mbak

Gunawan said...

Saya coba save kodenya di blog saya tapi kok slalu aja muncul error ya sob dan tak bisa tersave? Apa ada yang salah dengan kode di atas?

Unknown said...

tombol share seperti yang ada di blog ini kelihatannya lebih keren ^__^

coding di atas sepertinya ada yang tertinggal.. code pada js twitter sepertinya tiada tag pembuka...

Anonymous said...

tombol share ini memang berguna sekali ya mbak...

tapi saya lihat ada yang memasang "lintaskan" juga...itu mungkin berbeda ya?? apa berhubungan dengan lintasme? *maaf banyak nanya hehe

Ilham Nurhamzah said...

waw.. boleh di coba nih mba :D
thanks buat tutorial nya

Senyum syukur said...

Tips yang bermanfaat.. makasih..

Anonymous said...

Tutorialnya lengkap mbak,kalau saya tombol sharenya diatas postingan mbak :)

Unknown said...

@aben, koding b:if nya kan mas? ckck jelih jga ente kang :D
Saya jga sdah masang tombol share kyk gini mbak :) cuman sprti apa yg dsmpekan mas Ucup, tmbol share itu jarang dsntuh sma pngunjung. Dan itu juga saya rasakan :(

Anonymous said...

Di blog saya sudah saya terapkan master. ^^

Ən Yeni Mahnı Sözləri 2 said...

saya cuma pakai tombol like aja mbak, lebihnya default dari blogger

Rizkyzone.com said...

saya lebih sering manual mb' ke Google plust, yang lain dah otomatis memanfaatkan rss feed

Mas Andes said...

manis semanis adminnya :) hihihi..
cakep mbak tombolnya mungil2, di taruh dibawah posting makin sipp jadinya

Anonymous said...

saya udah punya mbak cuma beda tampilannya, memang perlu juga tombol share seperti ini yah mbak supaya banyak yang tertarik untuk datang ke blog kita, makasih mbak :)

Wahyu Eka Prasetiyarini said...

Mas Rohis, makasih banyak mas rohis atas komentarnya :)

Mas Marnes, kalau blog mas marnes sudah ada tombol share nya malah bagus mas, jadi nggak perlu pasang lagi. Kan fungsi nya sama :) Yang beda hanya tampilannya saja :)

Mas Lutfi, iya silahkan. Dicoba atau nggak terserah, saya nggak maksa kok wkwkwk :D

Mas Warim, wah bagus kalau sudah pasang mas. Kenapa dilepas lagi widgetnya? Sayang sekali ya kalau dilepas begitu saja hmmm :)

Kang Ucup, kalau begitu berarti di share sendiri kang. Kan selain bisa di share pengunjung, kan bisa di share sendiri. Ya nggak? hehe :D Tujuan widget tersebut kan untuk memudahkan share saja, apabila kita nggak sempat untuk mengakses jejaring sosial Google Plus, Twitter, ataupun Facebook :)

Mbak Indri, iya lumayan penting mbak. Bisa meningkatkan jumlah pageview blog juga hehe :)

Mas Karis, seratus untuk mas karis. Betul itu mas. Dengan adanya widget tombol share ini tentu selain bisa mempermudah melakukan share, juga bisa membuat tampilan blog menjadi menarik dan cantik ^^

Jenk Indah, iya mungkin sih, tapi sebenarnya bukan pada bisnis kalau menurut saya, tetapi lebih kepada trafik blog dan performa blog :)

Mizz Aiza, iya karena tombol share di Blog Dunia Kecil sudah ada bawaan dari template blogspot. Jadi tidak berwarna. Kalau berwarna seperti yang ada di blog saya tersebut merupakan dipasang sendiri menggunakan script mizz :)

Mas Intan, disimpen dimana aja boleh mas, asalkan jangan disimpan di kulkas wkwkwk :D

Mas Nady, iya silahkan dipikir-pikir dulu mas untuk mengganti atau tidak tombol share di blog nya mas nady. Nanti kalau sudah mantep, baru pasang tombol share di blog :)

Mas Hidayat, silahkan dicoba dan semoga berhasil :)

Mbak Elsa, iya mbak memang benar ketiga jejaring sosial tersebut merupakan jejaring sosial yang sudah besar, dan sangat berpotensi mendatangkan trafik blog :)

Mas Manarul, iya bagus mas. Kebetulan blog saya juga pengunjung nya banyak yang datang dari media sosial Google+ hehe :)

Mas Agung, iya mas tadi ada yang salah dengan kode tersebut, tapi sekarang sudah saya perbaiki lagi kodenya. Terimakasih sudah mengingatkan ya. Hehehe :)

Mas Aben, iya keren donk. Tapi lebih keren admin nya wkwkwk :D Terkait dengan script diatas, memang benar bahwa tadi ada yang tertinggal mas. Terimakasih banyak ya sudah memberitahu saya. Salam :)

Mas Wewengkon, seratus untuk mas wewengkon hehe :D Oh tombol share lintaskan ya? Itu adalah situs lintas.me yakni merupakan situs Social Bookmark Dofollow. Dengan melakukan share ke situs Bookmark tersebut, maka kita akan memperoleh backlink berkualitas dan juga tentunya bisa mendatangkan trafik. Tapi sejauh ini saya belum pernah mencobanya. Saya lebih suka melakukan share artikel ke Twitter, Facebook, dan Google+ aja hehe :)

Mas Ilham, iya sama-sama mas ilham :)

Mas Senyum, you're welcome mas :)

Mas Abed Siragih, kalau diatas postingan juga bagus mas. Terserah kita masing-masing mau pasang tombol tersebut dimana aja, kan fungsinya sama :)

Mas Agri, kalau jarang di sentuh pengunjung ya di sentuh sendiri mas hehe :D Kan tujuan pemasangan tombol tersebut untuk mempermudah kita (pemilik blog dan pengunjung blog) untuk membagikan artikel kepada pengguna jejaring sosial :)

Mas Fadly, wah bagus kalau begitu master. Selamat ya bahwa Blog Kolong Tulis sudah terpasang widget tombol share ^^

Mas Sabda, iya nggak apa-apa mas. Kan fungsinya sama aja. Mungkin performanya yang beda. Lebih keren yang dari script daripada yang bawaan dari blogspot hehe :D

Mas Rizky, owh begitu ya mas. Itu juga nggak apa-apa. Jadi lebih nyantai ya mas kalau share secara manual getu :)

Mas Andes, iya mas. Tapi sepertinya script nya belum valid HTML5, soalnya cukup memperberat loading blog hmmm :)

Mas Anthonie, tombol share yang ada di Blog Rahasia Hidup Sehat kan berwarna warni ya mas. Jadi lebih keren performa nya hehe :)

Reusam Endatu said...

biasa-nya mbak kq tombol share sudah di sediakan oleh pembuat template
tapi kebanyakan kalau like dengan facebook dan komentar dengan facebook sering tidak ada
salah satu-nya blog saya mbak
hehehe

rumah abu abu said...

Mencoba selalu hadir saat waktu luang di cara ririn :) selamat malam

Anonymous said...

kalau saya ada bawaan dari temflatnya kayaknya... mbak master... jadi gak pasang lagi tombol share facebook twitter dan google plus eheheh

Afrid Fransisco said...

rasanya mba, saya udah pernah bacaiin artikel ini disini.. "-"

Unknown said...

Punya saya sudah ada mbk jadi nggak perlu susah payah pasang lagi :D

Wahyu Eka Prasetiyarini said...

Mas Reusam, iya betul itu mas. Ada template yang sudah ada tombol jejaring sosial, dan ada juga yang belum ada. Kalau komentar Facebook memang jarang sekali ada mas, karena untuk memasang nya lumayan cukup sulit :)

Mas Dadang, hehehe thanks mas dadang atas kunjungannya ya :)

Pak Mang Yono, wah bagus kalau begitu master. Jadi nggak perlu repot-repot pasang widget tersebut di blog, karena sudah ada. Berarti tinggal dimanfaatkan saja yang sudah ada ya :)

Mas Afrid, hehehe iya mas artikel ini hampir sama dengan artikel sebelumnya, tapi untuk artikel ini lebih saya sederhanakan lagi :)

Mas Arifin, sippp dech kalau begitu mas :)

Anonymous said...

Terkadang emang sangat penting sebuah blog dengan artikel yang
Relavan, dan disitu share pada jejaringan sosial itu diantaranya
Facebook twitter dan masih banyak lagi jejaringan sosial lainy
Terima kasih sudah berbagi Mbak Rin. sukses terus

Meutrap said...

Ini yang saya cari-cari kak,
simak dulu baru praktek.

Unknown said...

Di blognya Cara Ririn juga berwarna warni kayaknya yah mbak, keren banget deh :)

Anindita Pinastika said...

Mba Ririn mau tanya, saya kok gak nemu data:post.body ya.. Sy udh cari dgn ctrl+f berkali2. Apa karena template saya? ngaruh gak sih mba?

Wahyu Eka Prasetiyarini said...

Mas Karis, yupz seratus untuk mas karis hehe :)

Mas Meutrap, silahkan mas dicoba. Kalau nggak dicoba juga nggak apa-apa kok :)

Mas Anthonie, hehehe iya donk, kalau berwarna warni kan jadi cerah hehe :D Yang pasti, admin nya nggak kalah keren hehe :D

Mbak Anindita, iya saya juga sudah cek template blog anda bahwa template tersebut tidak ada kode DATA POST BODY mbak. Mungkin anda bisa mengganti template yang lain apabila ingin cari kode tersebut :) Tapi sayang juga ya, soalnya template nya bagus banget :)

Anindita Pinastika said...

Waaah hrs diganti template nya ya mba...
Tks infonya mba, sy coba cri template baru yg eye catching tapi ada data post body nya hehehe...

Wahyu Eka Prasetiyarini said...

Owh sudah ganti template ya. Wah bagus dech kalau begitu. Sukses ya mbak untuk blog nya :)

t said...

saya udah pasang , , ,

mampir di http://nawayhac.blogspot.com

Wahyu Eka Prasetiyarini said...

Ok makasih mas ini. Thanks ya sudah berkunjung :)

Anonymous said...

hmm, saya sih belum niat buat ganti tobol sharenya
tapi saya save aja deh buat bahan inspirasi nanti :D

Miftahgeek said...

Bukannya ada yang bawaan blogspot nya ya gan?

Unknown said...

mantaab...izin mempraktikkan ya mbak ririn...saya selalu betah kalau harus mbuka blog anda...tutorialnya sangat berbobot, orisinil dan tentunya snagat bermanfaat...doa saya semoga sukses selalu untuk anda...dunia akhirat...aamiin ^_^

Mang Lembu said...

hiyah yah...keren banget, kenapa saya ngga coba ikutan pasang tombol share ke' gituh seh...kan tamu saya jadi gampang kalau pengen ng'share in postingan sayah ya..?!

Unknown said...

terima kasih untuk sharenya mba Ririn :), aku juga udah pakai tombol share facebook dan twitter... manfaatnya sangat terasa, jadi banyak yang berkunjung, hehe....

Wahyu Eka Prasetiyarini said...

Mas Nggak Lulus TK, silahkan di save mas, lumayan bisa memperbanyak isi di kulkas hehe :D

Mas Miftah, kalau yang bawaan blogspot memang ada mas, tapi itu adanya di template bawaan blogger. Kalau template custom kadang ada dan kadang tidak ada :)

Kang Zeer, terimakasih banyak kang Zeer atas support nya ya :)

Pak Cilembu, iya silahkan dicoba pak, biar blog desa cilembu tambah keren hehe :)

Mbak De, wah bagus kalau udah pasang mbak :)

Toko Sepeda Majuroyal said...

Saya pingin nya yang seperti di bawah artikel Mba Ririn... bolehkah... ?

Wahyu Eka Prasetiyarini said...

oh yang itu, saya memasang widget tombol share tersebut dari blog nya mas andes mas hehe :)

Anonymous said...

nah ini cara yg ane cari!!

Anonymous said...

kalo bikin tombol share kayak yg mabk pake gmn caranya? trims sebelumnya

Wahyu Eka Prasetiyarini said...

Iya ingsaallah akan saya buatkan tutorialnya mas. Mohon sabar ya :)

Jasa Pembuatan Aplikasi Klinik said...

Siip mbak, izin comot code nya....

Tazbhy said...

gak bisa gan gmna carnya
http://thazbhy.blogspot.com/
http://technogamecyber.blogspot.com/

Kaito Hasekun said...

Maju Terus Pokok e
http://sharebertron.blogspot.com/

Unknown said...

terima kasih ya
http://www.cecepdotcom.blogspot.com

Unknown said...
This comment has been removed by the author.

Post a Comment