Dewa Inside | Tutorial Blogger dan SEO

Cara Memasang Kotak Komentar Facebook di Blog

Memasang Kotak Komentar Facebook di Blogger

Memasang kotak komentar facebook di blogger dengan model tab. Dimana kolom komentar akan terbagi menjadi 2 tab, yaitu tab komentar blogger dan tab komentar facebook. Widget ini sangat cocok untuk meningkatkan interaksi dan komunikasi media sosial facebook. Apalagi kita ketahui bahwa semua orang pasti memiliki akun facebook dan biasanya selalu login "ingat saya" di browser komputer atau laptop pribadi mereka. Contoh gambar seperti yang terlihat pada gambar dibawah ini:

Tab Komentar Facebook dan Blogger

Cara Memasang Kolom Komentar Facebook

Langkah 1. Pada dashboard blogger --> Template --> Edit HTML --> klik kiri area kosong kotak Edit HTML dan Cari (CTRL+F) kode  berikut:
<div class='comments' id='comments'>
Edit HTML


Langkah 2. Copy dan Paste kode berikut dibawah dari kode <div class='comments' id='comments'>
<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle(&quot;#fb-comments&quot;);' title='Comments made with Facebook'>
<img class='comments-tab-icon' src='http://4.bp.blogspot.com/--8aj3rJ89sI/VTHsYBy63uI/AAAAAAAABcc/UYw376A1yrw/s1600/Facebook%2BIcon.png'/><fb:comments-count expr:href='data:post.url'/> Comments</div>
<div class='comments-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle(&quot;#blogger-comments&quot;);' title='Comments from Blogger'>
<img alt='blogger tab' class='comments-tab-icon' src='http://3.bp.blogspot.com/-BnBR2UHhoq8/VTHsWMYPdsI/AAAAAAAABcU/758rOrcX9_k/s1600/Blogger%2BIcon.png'/> <data:post.numComments/> Comments</div>
<div class='clear'/>
</div>
<div class='comments-page' id='fb-comments-page'>
<b:if cond='data:blog.pageType == &quot;item&quot;'><div id='fb-root'/>
<fb:comments expr:href='data:post.url' num_posts='2' width='550'/></b:if></div>
<div class='comments comments-page' id='blogger-comments-page'>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><script src='http://code.jquery.com/jquery-latest.js'/><meta content='187715554575764' property='fb:admins'/><script type='text/javascript'>function commentToggle(selectTab) {$(&quot;.comments-tab&quot;).addClass(&quot;inactive-select-tab&quot;);$(selectTab).removeClass(&quot;inactive-select-tab&quot;);$(&quot;.comments-page&quot;).hide();$(selectTab + &quot;-page&quot;).show();}</script>
<style>.comments-page { background-color: #f2f2f2;}#blogger-comments-page { padding: 0px 5px; display: none;}.comments-tab { float: left; padding: 5px; margin-right: 3px; cursor: pointer; background-color: #f2f2f2;}.comments-tab-icon { height: 14px; width: auto; margin-right: 3px;}.comments-tab:hover { background-color: #eeeeee;}.inactive-select-tab { background-color: #d1d1d1;}</style>
Catatan: Ganti tulisan Merah dengan ID Fans Page Facebook anda. Untuk mengetahui ID dari laman penggemar berikut saya berikan contoh: https://www.facebook.com/pages/Dewa-Inside/187715554575764

Langkah 3. Simpan Template

Silahkan lihat blog dan apabila berhasil, Selamat anda telah memasang kolom komentar facebook di blog anda dengan model tab. Sekian dan semoga bermanfaat bagi sobat blogger semua. :)
2Baca Selengkapnya »
Cara Memasang Tombol Pin it Pinterest di Blog Reviewed by Dewa Inside Rating: 4

Cara Memasang Tombol Pin it Pinterest di Blog

1 komentar:
1

Memasang Tombol Pin It Pinterest

Memasang tombol pin it pinterest pada setiap gambar di blogger itu cukup mudah. Walapun anda tidak harus memiliki akun pinterest terlebih dahulu. Namun ada baiknya anda membuat akunnya ya di https://www.pinterest.com/. Kenapa? Karena kita dapat mendaftarkan blog yang kita miliki di akun pinterest, sehingga nantinya dapat muncul tulisan "situs terverifikasi". Selain itu tentunya menambah backlink ke blog dan apalagi anda memiliki banyak teman di akun pinterest anda. Tentu sangat disayangkan kalau ada kesempatan emas seperti itu. Tidak seperti facebook dan twitter yang harus memiliki popularitas yang tinggi dan mengirimkan beberapa persyaratan untuk verifikasinya.

Tombol Pin it Pinterest

Fungsi Tombol Pin it

Fungsi dari tombol ini adalah sharing ke sosial media untuk setiap gambar yang ada pada blog anda. Sama halnya seperti tombol g+1, like facebook ataupun retweet twitter. Namun pinterest ini terbatas khusus untuk gambar saja.

Memasang Tombol Pin it

Langkah 1. Kunjungi situs --> Pembuat Tombol Pin It pinterest

Langkah 2. Pilih Tombol Pin It --> Gambar Mengambang, anda dapat mengedit (Tipe Tombol dan Tampilan) yang disediakan oleh developer pinterest dan dapat dipratinjau. Lalu Copy kode yang ada pada bagian bawah.

Tombol pin it

Copy kode tombol pin it

Langkah 3. Buka akun blogger --> Template --> Edit HTML --> klik kiri area kosong Edit HTML dan Cari (CTRL+F) kode berikut:
</head>
Langkah 4. Paste kode tombol pin it diatasnya dan Simpan Template.

Catatan : Perlu untuk diketahui bahwa gambar yang memiliki dimensi lebar dan panjang yang terlalu kecil tidak akan memiliki tombol hover pinterest. Dikarenakan tombol pin it sendiri yang lebih besar dari gambar yang akan dipasangkannya.

Selesai dan sekarang setiap gambar yang ada pada blog anda akan memiliki tombol pin it pinterest yang hover ketika kursor mouse didekatkan ke gambar. Selamat mencoba dan semoga bermanfaat bagi sahabat blogger semua.
Baca Selengkapnya »
Apakah Validator W3C Mempengaruhi SEO Reviewed by Dewa Inside Rating: 4

Apakah Validator W3C Mempengaruhi SEO

3 komentar:
3

Apa itu Validator W3C?

Validator W3C adalah alat yang berfungsi untuk memeriksa validasi dokumen web berupa HTML, XHTML, SMIL, MathML, dan lainnya. Anda pasti sudah tahu alamat W3C itu sendiri. Silahkan apabila anda ingin memeriksa html5 dari blog ini atau blog anda sendiri. --> Validator W3C

W3C Mempengaruhi SEO

Validator W3C Mempengaruhi SEO?

Jawabannya adalah tidak. Coba sobat periksa sendiri situs-situs besar dan terkenal. kita ambil contoh saja google, youtube, atau facebook. Berikut saya tampilkan screenshot test markup validator dari facebook, google dan youtube:

W3C Facebook
W3C Google
W3C Youtube

Dapat terihat jelas pada gambar diatas, bahwa situs-situs tersebut pada dasarnya tidak memperbaiki dokumen web meraka yang error walaupun mereka mampu. Saya tidak tahu alasan yang pasti kenapa, tapi Matt Cutts sendiri mengapresiasi apabila ada anggotanya yang mau meluangkan waktu untuk memperbaikinya. Untuk video terkait bahwa Validator W3C tidak mempengaruhi SEO adalah sebagai berikut:

Video Matt Cutts pada 16 September 2009 tentang Mengapa google.com Tidak Validasi dokumen mereka?


Video pada 15 Maret 2011 Matt Cutts dengan Danny Sullivan dari SearchEngineLand tentang Apakah Validasi HTML diperlukan untuk Ranking?


Namun ada baiknya untuk mengurangi seminimal mungkin kesalahan yang terjadi pada blog kita. Karena pada dasarnya yang disampaikan oleh W3C itu benar. Sebagai contoh, sewaktu saya memeriksa blog ini, saya berusaha memperbaiki kesalahan yang ada semaksimal mungkin. Dan memang ada hasil positifnya, yakni compability pada browser tertentu.

Compability Suatu Browser

Semisal saya ibaratkan, ketika sobat menuliskan kalimat pada www.google.com dan ada kata yang salah, apakah google mengerti kalau kata itu salah? Jawabannya iya dan mesin pencari google berusaha melakukan pendekatan menuju kata yang lebih tepat dengan memberikan sugesti kata terkait dan menampilkan laman terkait. Sama halnya dengan validator w3c yang berfungsi memberitahu adanya kesalahan kode dokumen suatu situs. Ketika ada kode html yang salah pada template blog anda apakah browser anda mengerti kalau html itu salah? Jawabannya iya juga, browser anda berusaha untuk membenarkan agar dapat membaca template dan menampilkannya sehingga dapat terlihat oleh mata manusia.

Maka dari itu akan lebih baik apabila kita dapat memperbaikinya, ya terkait dengan compability dari suatu browser. Terlihat pada peramban Chrome bagus, belum tentu pada Mozilla atau Internet Explorer (biasa terjadi). Bisa saja ada widget yang bergeser atau tidak terlihat pada browser lain namun terlihat cantik dan pro pada browser lainnya lagi. Sedangkan faktor yang mempengaruhi SEO itu sendiri ada banyak. Seperti kualitas konten, keywords, dan lain sebagainya yang belum bisa saya jelaskan satu per satu.
Baca Selengkapnya »
Menghilangkan Script plusone.js di Blogger Reviewed by Dewa Inside Rating: 4

Menghilangkan Script plusone.js di Blogger

7 komentar:
7

Menghilangkan plusone.js Blogger

Menghilangkan javascript plusone.js dengan URL https://apis.google.com/js/plusone.js pada blogger itu dapat untuk dilakukan. Plusone.js merupakan javascript bawaan blogger untuk widget dan navigasi bar yang ada pada posisi floating diatas. Selain itu sebelum google+1 button menggunakan versi asinkron (async) yang baru (platform.js), plusone.js lah yang digunakan walaupun dapat diasinkronkan juga. Namun dengan seiring berkembangnya developer google dengan kemunculan PageSpeed Insights, banyak pengguna domain blogspot yang memeriksa kecepatan blog mereka.

Dan dengan hasil yang kurang memuaskan dimana adanya javascript plusone.js yang memblokir perenderan di konten paruh atas. Karena bawaan langsung dari blogger, apabila script itu dihilangkan maka ada beberapa widget yang tidak berfungsi, seperti arsip blog. Namun widget tersebut jarang digunakan dan selain itu widget lainnya yang saya gunakan pada dewa inside blog ini berfungsi dengan baik.

Menghapus Plusone.js

Dengan menghapus script itu, maka akan mempercepat loading blog dengan domain blogspot anda. Untuk menghapus script tersebut dari platform blogger silahkan anda ikuti langkah-langkah dibawah ini:

Langkah 1. Pada Template --> Edit HTML --> Cari (CTRL+F) url berikut:
https://apis.google.com/js/plusone.js
Langkah 2. Hapus semua kode navbar dari <b:section class='navbar' id='navbar' maxwidgets='1' showaddelement='no'> sampai dengan </b:section>. Seperti gambar yang tampil dibawah ini:

Hapus Plusone.js
Klik Untuk Memperbesar Gambar
Langkah 3. Selanjutnya Cari (CTRL+F) kode:
</body>
Ubah kode diatas menjadi
&lt;!--</body>--&gt;
Langkah ini perlu dilakukan karena apabila anda memiliki extensions PageSpeed Insights (by Google) di chrome, maka apabila anda check pada developer tools maka plusone.js tetap ada.

Langkah 4. Simpan Template

Langkah 5. Selanjutnya uji kecepatan menggunakan --> PageSpeed Insights. Untuk memastikan bahwa script plusone.js telah dihapus dari template blog anda. Untuk memudahkan dan memastikan lebih jauh anda juga dapat meng-install --> extensions PageSpeed Insights (by Google).

Selamat anda telah lebih mempercepat loading blog anda dengan menghilangkan script plusone.js yang memblokir perenderan konten paruh atas :). Silahkan tinggalkan komentar pada kolom komentar dibawah apabila anda memiliki masukan lainnya.
Baca Selengkapnya »
Cara Agar Posting Cepat Terindeks Google Reviewed by Dewa Inside Rating: 4

Cara Agar Posting Cepat Terindeks Google

Tidak ada komentar:
0

Agar Posting Cepat Diindeks Google

Semua blogger tentu ingin agar postingan, artikel ataupun konten mereka cepat di-index oleh google sehingga dapat muncul pada SERP. Alasannya sudah jelas karena google merupakan mesin pencari yang dipakai oleh seluruh orang diseluruh dunia. Jika ingin postingan kita secara cepat dapat terindeks oleh google dalam hitungan detik dan menit, caranya yaitu menggunakan alat pengambilan oleh google bot (Fetch as Google Bot) yang disediakan pada alat webmaster google sendiri.

Ambil sebagai Google Bot

Berdasarkan pengalaman saya menggunakan tool ini, artikel yang saya publikasikan langsung tampil pada SERP google apabila saya periksa dengan menggunakan alamat postingan yang berkaitan itu dalam waktu yang singkat. Tool ini sangat bermanfaat apabila anda memiliki situs yang setiap harinya harus mempublikasikan puluhan artikel sekaligus. Seperti situs-situs selebritis, berita dan politik.

Video

Maile Ohye (Pimpinan Teknologi Developer Programs di Google) tentang kegunaan fetch as google tool.


Dampak Negatif

Namun ada sisi buruk yang saya alami (belum tentu orang lain mengalaminya juga) dari menggunakan tool ini adalah ada salah satu dari posting saya yang terdahulu hilang dari dindeks. Saya dapat berkata demikian karena saya mengalaminya. Setelah AMBIL sebagai google bot dan Kirim ke Indeks (mungkin saya tidak sadar double submit). Saya periksa beberapa menit kemudian dengan mencarinya pada mesin pencari google. Dan memang terbukti postingan saya langsung diindex oleh google. Namun ketika saya melihat peta situs saya, ternyata jumlahnya sama dengan sebelumnya.

Disini terjadi miss atau hilangnya salah satu dari artikel saya di mata google bot. Mungkin itu hanya bug yang terjadi pada saya dan belum tentu orang lain mengalaminya juga. Dengan kejadian seperti itu, saya lebih sering update postingan dan membiarkannya secara alami agar google bot mengindeks postingan saya. Saya tetap gunakan tool ambil sebagai google bot ini tapi tanpa mengirim alamat url yang berkaitan agar diindex oleh google bot.

Batasan Submit Alamat Posting

Ada batasan submit URL dari postingan yang dapat disubmit secara langsung setiap bulannya. Untuk setiap 1 URL berbeda dari setiap postingan yang kita ambil atau render oleh google bot secara langsung melalui alat webmaster dapat dikirim agar diindex dengan maksimal jumlah adalah 500 URL per bulan.

500 URL

Sedangkan untuk URL yang terkait langsung pada setiap URL posting berbeda yang kita ambil atau render dapat dikirim agar dindex dengan maksimal jumlah adalah 10 URL per bulan.

10 URL

Ambil sebagai Google

Akhirnya kita sampai pada fungsi Ambil sebagai Google Bot. Maksudnya adalah google bot akan secara langsung melihat konten yang kita ingin perlihatkan kepadanya melalui alamat yang kita cantumkan lalu mengambil ataupun merendernya.

Kunjungi Ambil sebagai Google --> Pilih situs yang diinginkan. Atau anda dapat membukanya pada Alat Webmaster --> Perayapan --> Ambil sebagai Google.

Ambil sebagai Google
Klik untuk Memperbesar

Langkah 1. Masukkan URL yang ingin kita render. Yaitu bagian tengah dari URL posting tanpa mencantumkan alamat blog dan tanpa slash (/). Contoh: http://dewainside.blogspot.com/2010/05/cara-agar-blog-terdeteksi-search-engine.html Bagian yang berwarna Biru yang anda copy dan paste.

Langkah 2. Pilih tampilan yang ingin dirayapi oleh google bot. Ada 4 tampilan yang tersedia: Desktop, Seluler: Ponsel Cerdas, Seluler: XHTML/WML dan Seluler: cHTML.

Tampilan Render

Langkah 3. Klik AMBIL atau AMBIL DAN RENDER. Perbedaannya sederhana. AMBIL = hanya merayapi posting terkait. Sedangkan AMBIL DAN RENDER = merayapi dan menampilkan posting terkait. Namun aslinya tidak ada tampilan apapun. lol.

Langkah 4. Kirim ke Indeks URL posting yang anda telah ambil atau render sebelumnya.

Kirim ke Indeks

Silahkan anda tunggu beberapa menit dan cari URL posting yang telah anda kirim untuk diindeks melalui mesin pencari google. Dapat dipastikan akan muncul pada SERP.

Sekian tutorial dari Cara Agar Posting Cepat terindex Google dalam hitungan detik. Semoga dapat bermanfaat bagi sahabat blogger sekalian.
Baca Selengkapnya »