Membuat Halaman di Google+ / pasang Tombol G+

Tentu anda sudah pernah membuat halaman di Facebook. Nah, kali ini saya sarankan juga untuk membuat halaman di Google+ sekaligus pasang tombol G+ yang kita buat untuk di tampilkan di blog kita. Halaman Google Plus ini sangat berguna untuk mengumpulkan penggemar di lingkaran Circles Blog Page anda juga akan menambah traffic pengunjung ke blog selain dari search engine atau media sosial lainnya.
Ada beberapa keuntungan yang bisa anda dapatkan dari Google Plus Page ini, diantaranya: ketika seseorang mempromosikan konten di blog anda dengan mengklik tombol G+, maka setiap mereka melakukan pencarian di search engine Google, blog anda akan sering tampil di halaman utama hasil pencarian khusus di komputer yang mereka gunakan. Walaupun tidak akan selalu tampil karena akan dipengaruhi oleh berapa banyak blog yang mereka promosikan melalui tombol Google+ dan tergantung dari berapa jumlah konten yang di promosikan oleh penggemar blog kita. Ini menurut pengalaman saya menggunakan beberapa komputer teman dan sodara, dan ternyata memang selalu muncul sesuai dengan kata kunci yang cocok dengan yang mereka ketik di mesin pencari Google. Kalau anda penasaran, silahkan di coba, caranya mudah aja ko.

1. Langsung browsing aja link untuk mulai membuat halaman Google+ , akan terlihat seperti gambar di bawah, lalu isikan nama blog dan URL nya > centang kotak ketentuan > trus klik BUAT

2. Kemudian pilih kategori halaman blog dan isi slogan Halaman Google Plus maksimal 10 kata dan tambahkan foto profil nya. > klik Lanjutkan

3. Setelah berhasil membuat halaman Google Plus anda (lihat gambar di bawah). Lalu klik Dapatkan Lencana untuk di pasang di blog anda.

4. Lalu copy URL identitas halaman anda, contoh: https://plus.google.com/118038773178331886448 - (lihat gambar di bawah):

5. Pilih dan sesuaikan ukuran dan tampilan Lencana / Badge anda, lalu copy kode-nya di kolom paling bawah.

Anda bisa gunakan kode ini <g:plus href="https://plus.google.com/115758842332937296744" size="badge"></g:plus> untuk di pasang di Widget blog anda. Ganti angka yang berwarna merah dgn ID Google+ Page anda, ganti ukuran/tampilan tombol badge sesuai pilihan anda di bagian huruf berwarna biru.

6. Lalu, Login ke akun blog > Design > Page Template > Add Widget > HTML / JavaScript > paste kode tadi dan simpan.
Lihat blog anda untuk melihat apakah sudah tampil atau belum.

Kalau belum tampil, masuk Design > Edit HTML > cari kode </head> (gunakan CTRL+F), kemudian simpan kode ini <script type="text/javascript" src="http://apis.google.com/js/plusone.js"/> di bawah nya.

Save Template, lalu lihat lagi hasilnya. Pasti ada.
Tapi tunggu dulu, anda belum selesai sebelum mencoba tombol pada gambar di bawah...hehey.

Selamat mencoba Cara Membuat Halaman di Google+ dan pasang Tombol G+, semoga dapat meningkatkan traffic pengunjung blog anda.

Cara pasang Tombol Share Floating Slider di Blogger

Memasang tombol share floating slider untuk di pasang di samping posting blogger dan blogspot menyerupai plugin blog wordpress kini semakin mudah, juga berguna bagi pengunjung agar mempermudah dalam berbagi konten blog kita via media sosial. Saat ini saya sudah mencoba praktek bagaimana caranya supaya tombol berbagi selalu mengikuti halaman ketika pengunjung scroll page sampai ke bawah. Dan tentu saja disamping praktis juga akan mempercantik tampilan blog kita seperti blog/situs profesional seperti Mashable...dll.
Tidak ada salahnya juga jika anda pengguna blogger gratisan seperti saya, berusaha selalu mencoba hal kreatif yang terkadang memang agak menghabiskan waktu untuk dapat benar-benar berhasil 100%. Diperlukan kesabaran dan keuletan agar apa yang kita inginkan tercapai. Tricks ini saya pelajari dari blog Mashable, kemudian saya lihat sourcepage nya, kemudian di copy lalu saya modifikasi dari awalnya menggunakan plugin WP menjadi kode html/script fiture jQuery agar bisa digunakan di blogger atau blogspot. Anda bisa lihat hasilnya di blog ini Z-Set. Contoh gambar di bawah:

Floating Share Button Slider

Untuk bisa memasang tombol floating slider seperti di atas, ada 4 langkah yang harus anda lakukan agar hasilnya sempurna, tapi sebelumnya saya sarankan backup dulu template anda untuk menjaga hal-hal yang tak terduga :

1. Silahkan login ke blog anda, masuk ke Design > Edit HTML dan centang "Expand Widget Template". Lalu cari kode <data:post.body/> (gunakan CTRL+F), kemudian simpan kode di bawah ini tepat di atas <data:post.body/> :

<b:if cond='data:blog.pageType == "item"'>
<div id='sharebox'>
<div class='wdt'> Tweet Button </div>
<div class='wdt'> Facebook Share </div>
<div class='wdt'> StumbleUpon </div>
<div class='wdt'> Digg </div>
<div class='wdt'> Untuk Tombol berikutnya yg akan anda tambahkan </div>
</div>
</b:if>

Update : kalo mau copy kodenya, silahkan lihat Link di bawah.

Tambahkan kode script/html tombol berbagi media sosial anda di antara <div class='wdt'> Tambah Kode di Sini </div>. Lihat contoh hasil dibawah menggunakan kode share saya :

<div class='wdt'><script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script></div>

2. Langkah berikutnya menambahkan kode jQuery terbaru di bawah tepat setelah kode ]]></b:skin>.

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js' type='text/javascript'></script>

Jika anda telah memiliki kode jQuery versi lama, anda cukup menggantinya dengan kode di atas, jangan gunakan keduanya.


3. Sekarang anda tambahkan bagian kode CSS, tambahkan kode di bawah tepat di atas kode ]]></b:skin>.

 #sharebox {
float: left;
margin-left: -80px;
background: #992211;
position: absolute;
-moz-border-radius: 5px;
border-radius: 5px;
}
#sharebox .wdt {
float: left;
clear: left;
padding: 5px;
}

 Anda bisa mengatur jarak antara sisi widget dengan sisi halaman konten dengan mengganti angka di atas yang berwarna merah dan merubah warna background yang berwarna hijau agar sesuai dengan keinginan tampilan blog anda. Untuk mendapatkan kode warna yang cocok, anda bisa lihat di HTML Color Codes.

4. Langkah terakhir adalah menambahkan kode Javascript yang akan menampilkan tombol share floating slider yang berhasil saya modifikasi, cari code </head> dan tambahkan kode di bawah tepat di atas kode </head>.

<script type='text/javascript'>
$(document).ready(function() {

var $sidebar   = $("#sharebox"),
$window    = $(window),
offset     = $sidebar.offset(),
topPadding = 15;

$window.scroll(function() {
if ($window.scrollTop() > offset.top) {
$sidebar.stop().animate({
marginTop: $window.scrollTop() - offset.top + topPadding
});
} else {
$sidebar.stop().animate({
marginTop: 0
});
}
});

});
</script>

Update : Ga bisa copy ? maaf, silahkan di > COPY.

 5. Simpan Template anda.

Jika anda tidak melihat contoh widget floating slider di blog Coerhat, itu karena tidak sesuai dengan template Coerhat yang 3 colum, cara yang sekarang di bahas akan efektif untuk blog bertemplate 2 collum. Yang saya gunakan sekarang adalah widget floating biasa yang paling mudah dan praktis.

Jika anda terbiasa dengan mengutak-atik kode CSS, anda bisa merubah tampilan baru widget tombol share floating slider, Selamat mencoba praktek cara pasang tombol share floating slider media sosial di Blogger anda.