.:: Ilmu Andi Rendy ::..: [TUTORIAL] Pasang Tombol Twitter, Facebook Share dan Facebook Like (3-in-1)

[TUTORIAL] Pasang Tombol Twitter, Facebook Share dan Facebook Like (3-in-1)

Saat ini situs-situs jejaring sosial terutama Facebook dan Twitter merupakan jenis situs online yang paling banyak diakses oleh pengguna internet di seluruh dunia, dengan salah satu layanan yang banyak digunakan adalah kemudahan bagi penggunanya untuk menyebarkan/membagikan aka share artikel online yang ada di berbagai website/blog.

Bagi pemilik atau pengelola website/blog, tentunya hal tersebut menjadi salah satu peluang untuk memperbesar tingkat kunjungan ke situsnya melalui Facebook dan Twitter ini, dengan memberikan kemudahan bagi pengunjung untuk share artikel yang ada di blog, salah satunya adalah dengan memasang tombol share Facebook dan Twitter.

Sebelumnya pernah disampaikan secara terpisah cara memasang tombol share Twitter dan Facebook, dan juga tombol Facebook Like. Kali ini masih soal cara memasang tombol Facebook dan Twitter, tapi sedikit berbeda dari cara sebelumnya itu. Pemasangan tombol share kali ini menggunakan layanan dari LinksAlpha, yang menyediakan tombol share yang menggabungkan ketiga tombol tersebut (Facebook Share, Facebook Like, dan Share Twitter) untuk ditampilkan menjadi satu baris saja, sehingga terlihat lebih simpel, kompak dan lebih rapi.

EasyCash, cara mudah dapat uang dari Facebook

Sebenarnya, tombol bernama “1-Click Retweet/Share/Like” yang disediakan oleh LinksAlpha ini bisa anda pasang dengan menggunakan kode yang diberikan di situs tersebut. Tapi sayangnya, kode tombol yang disediakan hanya untuk halaman / URL statis saja (Website), jadi tidak bisa tampil secara otomatis membaca URL/alamat setiap artikel blog. Kecuali anda install plugin untuk blog WordPress (self-hosted), atau blog TypePad.

Untuk platform blog/situs lainnya, tenang saja, bisa diakali kok. Berikut ini cara pemasangannya.

1. Pasang di template Blogspot/Blogger

Silahkan login, masuk ke tab Design/Layout, lalu klik Edit Template, centang pilihan Expand Widget Templates. Cari kode di template anda, lalu di atas/di bawahnya pasang kode ini:

</pre><p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.2em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; text-align: justify; ">Demo: <a href="http://zondemo.blogspot.com/2010/07/tombol-retweet-twitter-facebook-share.html" target="_blank" style="color: rgb(0, 102, 153); text-decoration: none; ">lihat di sini</a>.</p><p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.2em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; text-align: center; ">*</p><h3 style="margin-top: 0.2em; margin-right: 0px; margin-bottom: 0.5em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; font-size: 1.5em; font-weight: normal; line-height: 1.5em; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: rgb(204, 204, 204); "><span style="color: rgb(255, 0, 255); ">2. Pasang di template WordPress.ORG (self hosted)</span></h3><p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.2em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; text-align: justify; ">Anda bisa install <a href="http://wordpress.org/extend/plugins/1-click-retweetsharelike/" target="_blank" style="color: rgb(0, 102, 153); text-decoration: none; ">plugin ini</a>, atau bila anda seperti saya <img alt=":)" class="wp-smiley" src="http://inimu.com/komputer/wp-includes/images/smilies/icon_smile.gif" style="border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; vertical-align: bottom; padding-top: 0px; padding-right: 0.2em; padding-bottom: 0px; padding-left: 0.2em; background-image: none; background-attachment: initial; background-origin: initial; background-clip: initial; background-color: initial; background-position: initial initial; background-repeat: initial initial; " /> yang tidak suka install terlalu banyak plugins (karena semakin banyak plugins, semakin berat beban server hosting), silahkan pasang kode berikut ini. Silahkan login, masuk ke Appearance, lalu klik Editor (Themes editor). Silahkan buka template Single Post (single.php) atau Page Template (page.php). Carilah kode<code title="Click to select text" style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.2em; margin-left: 0px; padding-top: 0px; padding-right: 5px; padding-bottom: 0px; padding-left: 5px; font-style: inherit; font-weight: inherit; color: rgb(102, 51, 0); background-color: rgb(246, 246, 246); white-space: nowrap; "><!--php the_content(); ?--></code>, lalu di atas/di bawahnya tambahkan kode ini:</p><pre title="Click to select text" style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.2em; margin-left: 0px; padding-top: 0px; padding-right: 5px; padding-bottom: 0px; padding-left: 5px; font-family: 'Courier New', Courier, monospace; color: rgb(102, 51, 0); background-color: rgb(246, 246, 246); border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(221, 221, 221); border-right-color: rgb(221, 221, 221); border-bottom-color: rgb(221, 221, 221); border-left-color: rgb(221, 221, 221); overflow-x: scroll; overflow-y: scroll; "><iframe id="websites_iframe" src="" link="<?php">" scrolling="no" frameborder="0" height="25px" width="320px">

Demo: lihat di sini.

3. Pasang di Sidebar/Widget/Webpage (javascript)

Ini adalah kode generik untuk semua website (tentunya yang membolehkan pemasangan kode javascript) tanpa perlu edit template/theme, seperti pada demo pemasangan di artikel ini.

Untuk blog WordPress.COM (atau blog lainnya yang tidak mendukung pemasangan kode script atau pun iframe, alternatifnya bisa menggunakan layanan dari situs GetSocialLive (klik di sini). Tapi terpaksa pasang tombol satu-satu di setiap artikel

sumber : http://inimu.com

.:: Ilmu Andi Rendy ::..

Tempat Berbagi Ilmu² Seputar IT

Righteous Kill

Quisque sed felis

Etiam augue pede, molestie eget.

Hellgate is back

Post with links

[TUTORIAL] Pasang Tombol Twitter, Facebook Share dan Facebook Like (3-in-1)

1. Pasang di template Blogspot/Blogger

3. Pasang di Sidebar/Widget/Webpage (javascript)

Asmaulhusna

Pesan Hari Ini

Total Pageviews

About Me

Hari Ini

Labels

Blog Archive

SMS Gratis

Family Vacation

Free Movie

Page Rank

Page Rank

Free MP3

Followers

Beta News

Contact Me

IPv6 Test

Buat Uang

Dowload File