Membuat meta tag blogger

Setiap blog yang SEO friendly pasti memiliki meta-tag, karena meta tag sengaja dibuat agar mesin pencari mendatangi blog kita dengan keyword atau kata kunci tertentu (SEO). Oleh karena itu maka meta tag juga seharusnya korelatif dengan konten blog kita. Sebagai contoh blog ini diantaranya membahas beberapa hal yang berhubungan dengan blogging. Maka keyword pada meta tag blog juga disarankankan mengandung kata yang berhubungan dengan blogging juga. 

Selain untuk mengatur bagaimana mesin pencari nanti mengarah ke blog kita, meta tag juga bisa kita gunakan untuk menampilkan judul atau tulisan tertentu pada tab browser. Caranya sebagai berikut :

  1. Seperti biasa silahkan masuk ke Dashboard >> Setting >> Edit Template
  2. Cari dan hapus semua kode yang terletak di antara <head> dan <b:skin><![CDATA[ lalu ganti dengan kode di bawah ini :
<meta charset='utf-8'/>
<link expr:href='data:blog.url' rel='canonical'/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<title><data:blog.title/> | DESKRIPSI BLOG SOBAT </title>
<b:else/>
<title><data:blog.pageName/> &#171; <data:blog.title/></title>
</b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta content='DESKRIPSI BLOG SOBAT' name='description'/>
<meta content='KEYWORD, BLOG, SOBAT, PISAHKAN, DENGAN, TANDA, KOMA, SEPERTI, INI' name='keywords'/>
<meta content='NAMA SOBAT ATAU JUDUL BLOG SOBAT' name='author'/>
<meta content='INDEX, FOLLOW' name='ROBOTS'/>
</b:if>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<meta expr:content='data:blog.pageTitle + &quot; - DESKRIPSI BLOG SOBAT&quot;' name='description'/>
<meta expr:content='data:blog.pageTitle + &quot;, KEYWORD, BLOG, SOBAT, PISAHKAN, DENGAN, TANDA, KOMA, SEPERTI, INI&quot;' name='keywords'/>
<meta content='1 days' name='REVISIT-AFTER'/>
<b:else/>
<meta expr:content='data:blog.pageName + &quot; - DESKRIPSI BLOG SOBAT&quot;' name='description'/>
<meta expr:content='data:blog.pageName + &quot;, NAMA ATAU JUDUL BLOG SOBAT, KEYWORD, BLOG, SOBAT, PISAHKAN, DENGAN, TANDA, KOMA, SEPERTI, INI&quot;' name='keywords'/> </b:if>
<b:if cond='data:blog.metaDescription != &quot;&quot;'>
<meta expr:content='data:blog.metaDescription' name='description'/>
</b:if> 

Hasilnya sebagai contoh saja, silahkan sobat kunjungi beranda blog ini lalu tekan Ctrl+U. Pada jendela baru akan terlihat keyword-keyword apa saja yang sudah saya buat untuk meta tag blog ini.

Note :
Jika sebelumnya sobat sudah punya kode meta content khusus seperti google site verification, google analytics atau kode-kode lain yang sengaja sobat buat untuk kepentingan tertentu, kode-kode tersebut dibuat back-up nya dulu dan silahkan tempatkan lagi pada posisi meta-tag yang diinginkan. Selamat mencoba.
selengkapnya » Membuat meta tag blogger

Menambahkan plugins komentar facebook di posting blogger

Diantara sekian banyak pengunjung yang datang dan ingin berkomentar di blog kita sangat mungkin diantara mereka ada yang tidak memiliki Open ID. Tentu saja kita bisa memperbolehkan 'anonymous' akan tetapi cara ini sering mengundang spam. Sebagai alternatif kita bisa memasang kolom komentar untuk akun facebook, selain bisa lebih memfilter spam juga bisa lebih mempercantik tampilan blog kita.

Ada beberapa langkah yang bisa kita lakukan untuk menambahkan plugins komentar menggunakan akun facebook kita di postingan blogger, sebagian dari cara-cara tersebut malah membuat blog kita jadi tidak enak dipandang sebab posisinya tidak proporsional. Misalnya, kolom komentar plugins facebook tersebut berada di bawah kolom komentar blogger, praktis jadi ada 2 kolom komentar kosong yang terlihat di bawah postingan kita. Kasus seperti sebetulnya karena penempatan HTML nya saja yang kurang pas. Contoh yang saya gunakan adalah seperti ini :


Dibawah ini langkah-langkah membuatnya :

A. SETTING DI FACEBOOK :
Ketahui terlebih dahulu FACEBOOK_USER_ID dan APPLICATION_ID sobat di facebook, caranya :
1. FACEBOOK_USER_ID bisa dilihat di URL https://graph.facebook.com/usernameFBSobat
2. Untuk APPLICATION_ID sobat harus buat dulu aplikasinya di facebook, caranya :
  • Masuk ke sini.
  • Register as Developer >> Centang Box "I accept the dst....." Lanjutkan >> Dibawah "Which types of apps do you plan on building?" Centang Box "Aplikasi untuk halaman" klik Lanjutkan >> Done.
  • Buat Aplikasi Baru, isi data kurang lebih seperti ini :
  • Nama Aplikasi : Plugins Komentar Nama Anda
  • App Name Space : namaandadisatukanaja
  • App Category pilih : Aplikasi untuk halaman
  • Lanjutkan >> jika ada capcay isi saja >> lanjutkan.
  • Catat App ID sobat yang diberikan disana terlebih dahulu, lalu klik simpan perubahan :

Nah, sekarang sobat sudah mengetahui FACEBOOK_USER_ID dan APPLICATION_ID masing-masing.

B. SETTING DI BLOGGER.
Langsung saja langkahnya sebagai berikut, masuk ke Blogger >> Template >> Edit HTML dan masukkan kode-kode di bawah ini :
1. Meta Tag
Copykan kode ini di atas <b:skin><![CDATA[
<meta property="fb:admins" content="{FACEBOOK_USER_ID}"/>
<meta property="fb:app_id" content="{APPLICATION_ID}"/>
2. CSS
Tempatkan kode CSS di bawah ini tepat di atas kode ]]></b:skin>
/* komentar facebook */
.comments-page {}
#blogger-comments-page {display: none;}
.comments-tab {float:left; padding: 5px; margin-right: 3px; cursor: pointer; background-color: #f2f2f2; border-radius:4px;}
.comments-tab-icon { height: 16px; width: auto; margin-right: 3px;}
.comments-tab:hover { background-color: #eeeeee;}
.inactive-select-tab { background-color: #d1d1d1;}
 3. Javascript
Letakkan kode di bawah ini tepat di atas kode </head>
<!--script komentar facebook start -->
<script src='http://connect.facebook.net/id_ID/all.js#xfbml=1&amp;appId=APPLICATION_ID'/>
<script src='http://code.jquery.com/jquery-latest.js'/>
<meta content='FACEBOOK_USER_ID' 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>
<!--script komentar facebook end -->
4. HTML :
Cari kode:
<div class='comments' id='comments'>
Biasanya terdapat lebih dari satu kode di atas pada template blogger, jika sobat ingin agar plugin itu tampil di setiap halaman silahkan simpan kode HTML di bawah ini tepat di bawah kode-kode tersebut.
<!-- HMTL komentar facebook start -->
<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://static.ak.fbcdn.net/rsrc.php/v1/yH/r/eIpbnVKI9lR.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 class='comments-tab-icon' src='http://www.blogger.com/img/icon_logo32.gif'/> <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='4' width='500'/>
</b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'>
<!--HTML komentar facebook end -->
Catatan :
  • Nilai 500 di atas adalah lebar kolom komentar yang bisa sobat sesuaikan sendiri berdasarkan kebutuhan.
  • Ganti semua tulisan FACEBOOK_USER_ID dan APPLICATION_ID dengan User & App ID sobat sendiri.
  • Preview terlebih dahulu lalu save.
Sekarang di bawah postingan blog sobat akan terdapat kolom untuk pengunjung berkomentar menggunakan akun facebook mereka. Sedangkan sobat sendiri akan melihat Link "Pandangan Moderator" dan icon pengaturan komentar seperti pada contoh gambar blog saya di atas. Sebagai Moderator, sobat juga bisa mengatur komentar para facebooker di blog disini.
Regards.
selengkapnya » Menambahkan plugins komentar facebook di posting blogger

Mengatasi Error Ketika Edit Template Blogger

Beberapa saat lalu saya menggonta-ganti template blog, akan tetapi entah kenapa tiba-tiba halaman CMS blogger mengalami crash, seperti gambar di bawah ini :
Setelah googling kesana-kemari ternyata masalahnya terletak pada sebuah script yang entah dari mana datangnya ada di template blog yang saya edit itu.

Langsung saja untuk mengatasi masalah tersebut, caranya :
1. Masuk ke Dashboard >> Template
2. Saat browser masih loading dan halaman edit template sudah tampil cepat klik tanda "x" di sudut address bar. Tujuannya agar CMS Blogger tidak sempat men-load script 'break iframe' yang membuat error tampilannya itu.

3. Klik edit HTML, apabila browser melakukan loading lagi cepat klik lagi tanda "x" tadi.
4. Jika halaman edit template sudah tampil klik expand template widget
5. Cari dan hapus kode di bawah ini.
<script language='JavaScript' type='text/javascript'> if (top.location != self.location) top.location.replace(self.location); </script>

Sekarang halaman edit template sobat sudah normal lagi. Dari berbagai sumber.
selengkapnya » Mengatasi Error Ketika Edit Template Blogger

Statistik