Showing posts with label Tips Blogger. Show all posts
Showing posts with label Tips Blogger. Show all posts

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.
Read More

Cara Pasang Widget Floating Tombol Share di samping Blog

Kalo kemarin saya posting cara pasang tombol share floating slider-melayang, sekarang akan saya bahas cara pasang widget floating tombol share-berbagi via media sosial di samping kiri atau samping kanan halaman blog, cara ini adalah cara paling mudah dan sederhana seperti anda biasa memasang atau menambah kode html/script di bagian sidebar.

Widget Floating Share Button

Ok, langsung aja login ke blog anda, Design > Page Elements > Add a Gadget / HTML-Javascript.

Kemudian copy kode di bawah ini, dan simpan di bagian manapun yang anda inginkan, Widget floating share button ini akan tampil di samping kiri atau kanan blog anda seperti yang saya gunakan sekarang.

Terlebih dulu tentu anda harus sisipkan kode tombol media sosial anda di bagian yang berwarna merah, anda bisa menambah tombol berapapun yang anda butuhkan.

<style> #floatingbuttons { background: #aaa; background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f2f2f2), color-stop(1, #aaa)); background: -moz-linear-gradient(top, #f2f2f2, #aaa); border: 1px solid #808080; color: #fff; float: left; font-weight: normal; font-size: 13px; padding:0 0 3px 0; position: fixed; text-decoration: none; bottom:30%; left:0; z-index:10; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; box-shadow: 2px 2px 5px rgba(0,0,0,0.3); -moz-box-shadow: 2px 2px 5px rgba(0,0,0,0.3); -webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.3); } #floatingbuttons .floatbutton { float:left; clear:both; margin:5px 4px 0 4px; } .addbuttons { clear:both; color:#fff; font-size:9px; text-align:center; padding-top:3px; font-family:tahoma, verdana, helvetica, arial, sans-serif; font-weight:bold; line-height:1.4; } .addbuttons a { color:#fff; background:none; } .addbuttons a:hover { color:#fff; background:none; } .sharebuttons { font-size:8px; } </style> <div id='floatingbuttons' title="Share this post!">

<div class='floatbutton' id='facebook'> Kode tombol Like Facbook Anda </div>

<div class='floatbutton' id='sharefb'> Kode tombol Share Facebook anda </div>

<div class='floatbutton' id='twitter'> Kode tombol Twitter Anda </div>

<div class='floatbutton' id='google+1'>
<!-- Place this tag in your head or just before your close body tag -->
<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
  {lang: 'id'}

</script>

<!-- Place this tag where you want the +1 button to render -->
<g:plusone size="tall"></g:plusone> </div> </div>

Update : Maaf, anda bisa Copy kodenya disini

Untuk merubah posisi widget floating, anda bisa ubah huruf berwarna biru.
Kode yang anda lihat sekarang untuk di samping kiri tengah, kalo mau di samping kanan ganti aja dengan right.

Mungkin anda juga ingin menyesuaikan warna latar widget floating dengan template blog, silahkan ubah kode warna yang berwarna hijau. Gunakan HTML Color Codes

Setelah beres mengedit atau menambah kode nya, lalu simpan/Save. Dan lihat hasilnya, mudah, cepat dan sederhana kan??
Oke, cara  ini memang cara pasang widget floating share button media sosial paling mudah cepat dan sederhana, tapi hasilnya sangat baik. Selamat mencoba.
Read More

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.
Read More

Cara pasang kode iklan Adsense di bawah judul posting blogspot

Bagi Blogger yang mau tau cara pasang kode adsense di bawah judul atau memasang kode iklan di atas konten artikel postingan blog / blogspot anda, sebenarnya sangat mudah, cepat dan praktis. Mungkin anda sudah banyak membaca tips dan triks untuk menampilkan iklan yang benar dan tepat, tetapi terkadang agak sulit dan sering terjadi error akibat menyimpan kode adsense berupa script atau html di tempat yang salah dan dapat menggangu tampilan template blog anda.

Jika anda akan memasang kode script Google Adsense, sebaiknya di parse dulu agar muncul sempurna.
Untuk memparse kode GA, anda bisa gunakan layanan converter ads, cukup masukan kode GA di kotak lalu klik convert ad code, dan simpan hasilnya di notepad.

Untuk memasang kode iklan selain Google Adsense, anda tidak perlu memparse, karena dari pengalaman saya,  blogger template akan secara otomatis merubahnya. Kalaupun ada kode ads lain yang perlu di ubah, lakukan seperti proses parse kode GA di atas.



Kita mulai prakteknya:
1. Login / masuk ke Dashboard blog anda, klik Design lalu klik Edit html.
Centang / klik Expand Widget Template.

2. Cari kode berikut, supaya mudah - gunakan ( Ctrl+F )

<div class='post-header'>
<div class='post-header-line-1'/>
</div>

Kemudian simpan kode adsense anda tepat di bawah kode <div class='post-header-line-1'/> warna hijau, lihat contoh di bawah :

<div class='post-header'>
<div class='post-header-line-1'/>
--- Simpan kode iklan anda di sini---
</div>

Lalu Simpan / Save Template. Lihat hasilnya.
Cara di atas adalah cara mudah menampilkan iklan / adsense tepat di bawah judul posting dan tepat di atas konten artikel.

Lalu bagaimana cara menempatkan kode iklan supaya muncul di samping kiri atau kanan bagian awal konten tapi masih di bawah judul posting ?
Mudah juga, anda cukup menambahkan kode di bawah di antara kode iklan yang anda pasang :

<div style='float: left; margin: 0px 10px 0px 0px; '>
</div>

Hasilnya akan terlihat seperti di bawah ini :

<div class='post-header'>
<div class='post-header-line-1'/>
<div style='float: left; margin: 0px 10px 0px 0px; '>
---Kode adsense anda di sini---
</div>
</div>

Untuk menampilkan iklan di sebelah kanan samping artikel, anda cukup ganti huruf left warna biru dengan right.

Catatan : Jika anda menggunakan cara menyisipkan kode iklan agar muncul di samping awal konten artikel ini, mungkin sebaiknya pertimbangkan dulu untuk mengecek apakah postingan artikel anda selalu di tambah gambar di awal artikel atau tidak, karena jika gambar artikel sama penempatannya dengan iklan muncul di samping, akan tidak terlihat baik di mata pengunjung. Jadi, anda harus coba dulu.

Silahkan uji coba, semoga bermanfaat dalam mempelajari cara pasang kode adsense di bawah judul posting atau di atas konten artikel, dan cara menyisipkan kode iklan agar tampil di samping postingan konten artikel Blogger, blogspot.
Read More

Cara Submit Blog / Add Site di Webmaster Yandex-Search Engine

Webmaster Tools Yandex
Yandex Webmaster
Cara submit blog / add site url di Yandex atau cara verifikasi site / blog dgn Webmaster Yandex.com agar blog kita di index di search engine Yandex dari Russia, saat ini sangat mudah seperti halnya menggunakan Google Webmaster, Webmaster Bing atau Yahoo site explorer. Walaupun Yandex.com masih dalam tahap uji coba dan baru di luncurkan beberapa bulan yang lalu, tetapi cara kerjanya sangat cepat, continue dalam mengindexs halaman konten blog juga lumayan bisa menambah / mendatangkan traffic pengunjung. Jika dahulu mesin pencari Yandex kurang mendapat perhatian dari para blogger karena bahasa yang kurang bisa di mengerti, juga dgn alasan mesin pencarinya kurang mendunia alias khusus digunakan untuk sekitar Russia dan bahasa yang sama. Tetapi saya tidak terpengaruh oleh pendapat seperti itu, dari mulai membangun blog sekitar 1 tahun yang lalu, saya sudah submit blog di search engine yandex bahasa Russia, pada saat itu masih menggunakan yandex.ru dgn bahasa Russia dan belum mendukung bahasa Inggris seperti sekarang yandex.com.



Sebagai info: Mesin pencari Yandex.com saat ini banyak di lirik oleh para blogger luar negri karena merupakan saingan berat Google search engine, saya juga merasakan manfaatnya untuk menambah lalulintas pengunjung, menurut catatan yang saya analisa dari hasil pencarian search engine ternyata yandex.com lebih efektif di banding mesin pencarian milik Bing dan Yahoo.

Untuk bisa menggunakan webmaster yandex, tentu anda harus mendaftar akun email yandex terlebih dulu, sama seperti anda menggunakan akun email Google, email Msn/Bing atau YahooMail untuk bisa menggunakan Webmaster Tools mereka. Setelah terdaftar di akun email yandex, kemudian anda kunjungi Webmaster Yandex . Silahkan lakukan langkah berikut:

Saat anda berada di halaman webmaster dashboard yandex.
1. Click Add site di bagian atas, lalu masukkan alamat url blog anda di kolom Add site - lalu click Add site button / tombol.



2. Lalu anda akan dibawa masuk ke pilihan cara verifikasi, untuk cara yang mudah anda pilih tab meta tag, lalu akan muncul kode meta verifikasi untuk anda copy. Jangan di tutup dulu halaman verifikasi yandex nya.

3. Kemudian masuk / login ke situs / blog anda, di bagian Template Edit html, paste kan kode verifikasi yandex di bawah kode <head>, kemudian Simpan / Save Template.

4. Kemudian anda kembali ke halaman verifikasi yandex, lalu click Check Button, anda akan dibawa masuk ke halaman seperti gambar di bawah:


5. Untuk menambahkan Sitemap agar lebih cepat dalam pengindexsan dan tampil di search engine yandex.com, lihat menu sebelah kiri - click Indexing options, lalu masukan url sitemap, rss, feed blog anda, prosesnya cukup seperti langkah ke 1 di atas. Mudah khan...!?

Selesai sudah saya membahas bagaimana cara submit blog / Add site di Webmaster Yandex untuk bisa di indexs search engine Yandex.com dan menambah traffic pengunjung Blog. Semoga bermanfaat.
Read More