Blogspot | JEVUSKA

Cara mudah membuat meta description di Blogger

Sekitar 5 bulan yang lalu tim Blogger telah menambah fitur terbaru cara mudah membuat meta description di Blogger yang terdapat pada submenu Preferensi penelusuran (Search preferences). Tentunya Anda tidak perlu lagi membuat meta description secara manual di template Blogger Anda.

Fitur meta description ini tidak serta merta aktif di blog Anda. Jadi Anda perlu mengaktifkan terlebih dahulu untuk membuat meta description di setiap halaman postingan Anda. Berikut cara mudah membuat meta description di Blogger:

Masuk ke menu Setelan > Preferensi penelusuran (Settings > Search preferences)
Pada opsi Tag meta deskripsi (Meta tags Description), “Aktifkan deskripsi penelusuran? (Enable search description?)” pilih “Ya (Yes)”.
Isi kotak deskripsi dengan kalimat yang menjelaskan mengenai isi secara keseluruhan blog Anda. Panjang karakter maksimal 150 karakter (spasi dihitung). Deskripsi ini tampil pada source HTML blog Anda pada halaman depan (Homepage).
Klik tombol Simpan Perubahan (Save Changes).
Kini Anda dapat melihat fitur Deskripsi Penelusuran (Search Description) pada saat Anda ingin membuat artikel terbaru (New Post) atau ingin mengedit artikel yang lama.
Isi kotak Deskripsi Penelusuran dengan kalimat yang menjelaskan deskripsi singkat mengenai artikel yang Anda publikasikan (Max 150 karakter).
Klik tombol Selesai (Done).

Cara melihat meta description

Buka halaman depan atau halaman postingan blog Anda.
Jika browser Anda adalah Firefox atau Chrome, tekan Ctrl+u (View Page Source) untuk melihat halaman HTML Blog Anda.

Pada bagian atas antara kode <head> dan </head> terdapat kode HTML meta description seperti ini:

<head>
...
<meta name="description" content="Ini adalah satu contoh meta description. Deskripsi ini muncul pada halaman penelusuran mesin pencari.">
...
</head>

Berikut video singkat dari YouTube mengenai penjelasan cara membuat membuat meta description di Blogspot.

Custom domain name di Blogger/Blogspot

Blogger menawarkan dua pilihan untuk publishing gratis di blog Anda yaitu melalui hosting di Blogspot, misalnya example.blogspot.com, dan hosting pada kustomisasi nama domain Anda sendiri, misalnya www.example.com atau foo.example.com. Anda dapat mengubah pilihan ini kapanpun Anda inginkan, dan konten Anda tidak akan berubah.

Jika Anda menginginkan domain sendiri untuk di hosting di Blogger, ada dua proses untuk membuat custom domain name di Blogger/Blogspot yaitu:

Membeli domain langsung melalui Blogger.
Menghosting url domain yang sudah ada dari domain registrar lainnya.

Cara membeli domain langsung melalui Blogger

Pada opsi Setelan > Dasar > Penerbitan (Settings > Basic > Publishing)

Setelan Blogger (klik gambar untuk memperbesar
Klik Tambahkan Domain Khusus (Add a custom domain)

Settings Basic Publishing custom domain Blogger (klik gambar untuk memperbesar
Periksa ketersediaan url domain Anda, jika tersedia Anda akan di arahkan ke halaman Google Apps. Halaman Google Apps ini adalah halaman dimana Anda akan melakukan proses pembelian url domain melalui fasilitas pembayaran Google Checkout. Harga domain sekitar $10.
Klik tombol Continue to Registration. Anda harus mengisi data yang ditampilkan sebagai informasi untuk kepemilikian url domain. Baca baik-baik aturan yang ada kemudian berikan centang “I have read the eNom Universal Terms of Service ” karena Google akan mendaftarkan domain Anda melalui tempat registrasi domain yaitu eNom.

Pembelian Domain di Google Apps (klik gambar untuk memperbesar)
Klik tombol “I accept. Proceed to Google Checkout“. Disini Anda akan melakukan pembayaran melalui Google Checkout. Diperlukan kartu kredit untuk melakukan proses ini. Setelah proses pembayaran selesai maka domain Anda akan di setup langsung di Blogger dan siap digunakan.

Menghosting url domain yang sudah ada dari domain registrar lainnya

Metode Custom domain name yang kedua ini dilakukan jika Anda telah memiliki domain di tempat registrasi domain yang lain, misalnya GoDaddy, ix web hosting, 1and1, EveryDNS.net, Yahoo!SmallBusiness, No-IP, DNS Park, Namecheap atau yang lainnya.

Pada opsi Setelan > Dasar > Penerbitan (Settings > Basic > Publishing)
Klik Tambahkan Domain Khusus (Add a custom domain). Pada keterangan “Sudah punya domain? (Already own a domain?)“, klik Alihkan ke setelan lanjutan (Switch to advanced settings).
Isi kotak “Setelan lanjutan (Advanced settings)” dengan domain yang Anda miliki. misalnya www.example.com atau subdomain.example.com. Anda tidak dapat mengisi kotak tersebut hanya dengan nama domain saja seperti example.com (tanpa www) atau subdomain di depan nama domain.
Berikan tanda centang pada Alihkan example.com ke www.example.com (Redirect example.com to www.example.com).

Publishing Advanced Settings Custom Domain Blogger (klik gambar untuk memperbesar)
Klik tombol Simpan (Save).

Langkah selanjutnya, Anda harus menuju ke registrar domain, dimana domain Anda di host, untuk menghubungkan domain Anda dengan Blogger dengan mengatur nameserver dan DNSnya.

Cara Custom domain GoDaddy ke Blogger/Blogspot

Jika domain Anda di hosting di GoDaddy.com, langkah custom domain ke Blogger cukup mudah. GoDaddy.com memiliki tool yang memudahkan Anda untuk melakukan kustomisasi domain ini. Toolnya adalah Go Daddy Blogger DNS Setup site di http://www.godaddy.com/blog/bloggerdnssetup.aspx. Di sini Anda akan melakukan proses setup DNS untuk menghubungkan domain Anda di GoDaddy dengan Blogger. Untuk domain registrar lainnya Anda harus melakukannya secara manual.

Setting Otomatis DNS Domain GoDaddy ke Blogger melalui tool Go Daddy Blogger DNS Setup site

Masuk ke http://www.godaddy.com/blog/bloggerdnssetup.aspx dengan informasi login akun GoDaddy Anda.
Isikan kolom konfirmasi dengan url domain Anda.

Go Daddy Blogger DNS Setup site (klik gambar untuk memperbesar)
Klik tombol Confirm. Akan muncul pesan bahwa DNS records domain Anda telah di update.

Jika tool ini bermasalah, Anda dapat melakukan setelan DNS manual domain Anda di GoDaddy.

Setting Manual DNS Domain GoDaddy ke Blogger melalui DNS Manager

Pada domain Anda di Godaddy.com, pastikan Nameservers diparkir di GoDaddy.com. Proses parkir domain GoDaddy sebagai berikut:
1. Klik Set Nameservers
2. Kemudian pilih opsi I want to park my domains,
3. Klik OK. Silahkan tunggu beberapa menit untuk perubahan Nameservers.
Jika nameserver Anda telah berubah, misalnya menjadi NS21.DOMAINCONTROL.COM dan NS22.DOMAINCONTROL.COM, baru kemudian Anda dapat mengatur DNS Manager domain Anda.
Klik Launch DNS Manager.

DNS Manager GoDaddy (klik gambar untuk memperbesar)
Pada Record type A (Host). Untuk Host diisi @, edit (icon pensil) Points to dengan ip address:
- 216.239.32.21
- 216.239.34.21
- 216.239.36.21
- 216.239.38.21
TTL 1 hour (default). Klik tombol Quick Add untuk menambahkan masing-masing ip address di atas. Langkah ini penting jika Anda ingin mengalihkan domain Anda. Misalnya dari example.com ke www.example.com. Jika Anda tidak melakukan setelan ini, maka ketika Anda mengetik hanya example.com, akan tampil halaman parkir GoDaddy.

A Host GoDaddy custom domain Blogger (klik gambar untuk memperbesar)

Setting Manual DNS Subdomain GoDaddy ke Blogger

Jika Anda menginginkan subdomain, misalnya blog.example.com, Pada Record type A (Host) isikan Host dengan blog (subdomain), TTL 1 hour (default), Points to dengan:
- 216.239.32.21
- 216.239.34.21
- 216.239.36.21
- 216.239.38.21
Pada Record type CNAME(Alias). Untuk Host berisi www, edit (icon pensil) Points to dengan ghs.google.com, TTL 1 hour (default).

CNAME GoDaddy custom domain Blogger (klik gambar untuk memperbesar)
Klik tombol Save Zone File pada kanan atas.

Cara Custom domain Namecheap ke Blogger/Blogspot

Pastikan nameserver domain Anda berada pada server Namecheap.com. Caranya dengan melakukan Transfer DNS. Pada domain yang Anda ingin kustomisasi, klik Transfer DNS Back to Us.
Centang Transfer DNS To NameCheap Default DNS.

Transfer dns Namecheap (klik gambar untuk memperbesar)
Klik tombol Save Changes.
Pilih All Host Records.
Pada All Host Records, isikan:
- Pada HOST NAME → @, IP ADDRESS/URL → http://www.example.com/ RECORD TYPE → URL Redirect(301), TTL → 1800.
- Pada HOST NAME → www, IP ADDRESS/URL → ghs.google.com. RECORD TYPE → CNAME (Alias), TTL → 1800.
- SUB-DOMAIN SETTINGS, Pada HOST NAME masing-masing diisi @, IP ADDRESS/URL:
  - 216.239.32.21
  - 216.239.34.21
  - 216.239.36.21
  - 216.239.38.21
  - Masing-masing RECORD TYPE → A (Address) dan TTL → 1800.
  All host records Namecheap custom domain Blogger (klik gambar untuk memperbesar)
Klik tombol Save Changes.

Cara Custom domain dari registrar domain lainnya

Log in ke akun domain Anda dan masuk ke halaman DNS management atau Name Server Management.
Aktifkan advanced settings dan buat CNAME record
Delete CNAME yang sudah ada.
Sebelum Anda memasukkan CNAME record yang baru, jika Anda ingin mentransfer konten Anda ke alamat yang baru di Blogger, pastikan Anda mengkopi seluruh konten pada hostingan lama Anda.
Jika registrar domain Anda memungkinkan untuk mengisi CNAME secara langsung, isikan Host Name/Alias dengan www, dan Value/Destination dengan ghs.google.com.
Save.

Proses setting custom domain name ke Blogger/Blogspot ini memerlukan waktu propagasi DNS maksimal 48 jam.

Update 24/09/2012

Akhir-akhir ini Anda kemungkinan sering bermasalah ketika melakukan mapping domain. Proses mapping domain pada custom domain name di Blogger kini mengalami perubahan. Anda diharuskan mengisi terlebih dahulu nama domain (misal www.domainname.com) Anda kemudian klik Petunjuk Setelan (Settings Instructions). Dari opsi On a top-level domain atau On a subdomain terdapat informasi bahwa Anda harus mengisi CNAME kedua yang strukturnya seperti ini:

“AMSC……” untuk nama Host.
“gv-2PGXWGNQL……domainverify.googlehosted.com.” untuk Points To.
Kode ini berbeda-beda untuk setiap domain.
Fasilitas membeli domain langsung melalui Blogger sementara ditiadakan karena sampai sekarang proses mapping sering mengalami masalah. Lihat detailnya di Known Issues for Blogger.

Pasang tombol Like Facebook di Blogger/Blogspot

Cara pasang tombol Like Facebook di Blogger/Blogspot berbeda dengan cara pasang button Like Facebook di WordPress. Bedanya pada penempatan kodenya dan atribut href plugin Facebook Like.

Berikut langkah-langkah cara pasang tombol Like Facebook di Blogspot:

Untuk implementasi kode Iframe

Masuk di template editor blog Anda Template > Edit HTML

Centang Expand Widget Templates dan tempatkan kode berikut sebelum atau sesudah setelah kode <data:post.body/>

<b:if cond='data:blog.pageType != "static_page"'>
<iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.canonicalUrl + "&send=false&layout=box_count&show_faces=false&width=55&action=like&font=arial&colorscheme=light&height=62"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:55px; height:62px;'/>
</b:if>

Save template Anda

Untuk implementasi kode XFBML

Pada bagian header, Anda harus memasang tipe dokumen XML pada tag <html> (kodenya ada di bagian atas kode template Anda). Tampilannya seperti ini:
```
<html xmlns:fb="http://ogp.me/ns/fb#">
```

Kemudian tempatkan kode JavaScript SDK Facebook setelah kode <body> atau <body expr:class=’"loading" + data:blog.mobileClass’>

<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

Kemudian tempatkan kode berikut di dalam loop konten, sebelum dan/atau sesudah <data:post.body/>:

<b:if cond='data:blog.pageType != "static_page"'>
     <fb:like expr:href='data:post.canonicalUrl' layout='box_count' send='false' show_faces='false'/>
</b:if>

Save template Anda

Jika hanya ingin menampilkan Facebook Like button pada halaman tertentu saja, misalnya halaman di single post/item, Anda cukup mengganti pagetype dalam kode tersebut. Misalnya seperti kode berikut ini:

<b:if cond='data:blog.pageType == "item"'>
    <fb:like expr:href='data:post.canonicalUrl' layout='box_count' send='false' show_faces='false'/>
</b:if>

Contoh kode tombol Like Facebook di atas akan menampilkan button dalam bentuk vertikal, Anda bisa memodifikasinya dengan mengganti atribut dalam kode tersebut untuk membuat tampilan yang lain.

Atribut Kode Facebook Like Button

href : url permalink postingan Anda, dalam tutorial ini, kode data:post.canonicalUrl untuk menunjukkan url postingan/artikel
send : menentukan apakah akan menyertakan tombol send/kirim. Ini hanya bekerja dengan versi XFBML. Opsinya adalah “true” atau “false”
layout : ada tiga pilihan.
- standar : menampilkan teks sosial di kanan tombol dan profil foto teman-teman Anda. Lebar minimum: 225 pixel. Minimal 40px untuk action ‘recommend’ oleh dan 60 piksel jika data ‘send’ adalah ‘true’. Standar lebar: 450 pixel. Tinggi: 35 pixel (tanpa foto) atau 80 piksel (dengan foto).
- button_count : menampilkan jumlah like/suka di kanan tombol. Lebar minimum: 90 pixel. Standar lebar: 90 pixel. Tinggi: 20 pixel.
- box_count : menampilkan jumlah like/suka di atas tombol. Lebar minimum: 55 pixel. Standar lebar: 55 pixel. Tinggi: 65 pixel.
show_faces : menentukan apakah akan menampilkan foto profil di bawah tombol. Opsinya adalah “true” atau “false”
width : lebar button like.
action : kata untuk ditampilkan di tombol. Pilihannya adalah “like/suka” , “recommend/rekomendasi”
font : untuk menampilkan jenis font yang dipakai. Pilihannya adalah ‘arial’, ‘lucida grande’, ‘segoe ui’, ‘tahoma’, ‘trebuchet ms’, ‘verdana’
colorscheme : skema warna untuk tombol seperti. Pilihannya adalah “light” dan “dark”
ref : label untuk melacak arahan; harus kurang dari 50 karakter dan dapat berisi karakter alfanumerik dan beberapa tanda baca (/ =-.: _). Atribut ref menyebabkan dua parameter yang ditambahkan ke URL referrer/perujuk ketika pengguna mengklik link Like dari permalink artikel/postingan:
- fb_ref : ref parameter
- fb_source : tipenya (‘home’, ‘profile’, ‘search’, ‘ticker’, ‘tickerdialog’ atau ‘other’)

Core konsep social plugin Facebook ini, Anda bisa temukan di sini:
http://developers.facebook.com/docs/reference/plugins/like/

Cara gampang mengubah link label di Blogspot menjadi search

Struktur link/url blog di Blogspot terlihat agak panjang dan hasil artikel yang tampil juga sangat terbatas karena sudah ditentukan melalui label postingan. Bagaimana jika kita ingin mengubah link label blog itu menuju ke halaman search atau halaman pencarian sehingga artikel yang terkait label juga bisa lumayan banyak.

Struktur default label seperti ini:
http://namablog.blogspot.com/search/label/kata%20kunci
kemudian diubah menjadi:
http://namablog.blogspot.com/search?q=kata%20kunci

Berikut cara gampang mengubah link label di Blogspot menjadi search:

Buka template editor blog Anda Template > Edit HTML
Lakukan proses edit HTML dan centang Expand Widget Templates dan temukan kode ini (CTRL+F untuk cara cepat menemukannya):
Untuk Label di Postingan
```
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
```
Untuk Label di Gadget/element
```
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
```

Ganti kedua kode tersebut dengan kode berikut:

<a expr:href='data:blog.homepageUrl + "search?q=" + data:label.name' rel='tag'><data:label.name/></a>

Save template.

Baca juga tutorial Blogger terkait label yaitu Autofill Google CSE dengan keyword label blogspot. →

Mengubah title di setiap tipe halaman Blogspot

Halaman blog di Blogspot atau Blogger mempunyai beberapa page type atau tipe halaman seperti:
1. Halaman Depan atau halaman index
2. Halaman Pagination
3. Halaman Postingan (Item Post)
4. Halaman Page
5. Halaman Arsip (Arsip Tanggal,Bulan atau tahun)
6. Halaman Label
7. Halaman Pencarian
8. Halaman Error atau 404 page atau Page Not Found

Dengan kode berikut Anda bisa mengubah struktur title di setiap tipe halaman Blogspot tersebut agar SEO (Search Engine Optimization) friendly. Berikut langkah-langkah cara merubah judul/title Blogspot:

1. Masuk di template editor blog Anda Template > Edit HTML
2. Centang Expand Widget Templates dan temukan kode ini:

<title><data:blog.pageTitle/></title>

3. Ganti kode tersebut dengan kode berikut:

<!-- Halaman Arsip -->
<b:if cond='data:blog.pageType == "archive"'>
<title><data:blog.pageName/></title>
</b:if>
<!-- Halaman Pencarian -->
<b:if cond='data:blog.pageType == "index"'>
<b:if cond='data:blog.searchQuery'>
<title><data:blog.searchQuery/> - Search Result <data:blog.title/></title>
</b:if>
<!-- Halaman Label -->
<b:if cond='data:blog.searchLabel'>
<title><data:blog.pageName/> - <data:blog.title/></title>
</b:if>
<!-- Halaman index dan pagination -->
<b:if cond='data:blog.searchQuery == ""'>
<b:if cond='data:blog.searchLabel == ""'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<title><data:blog.title/></title>
<b:else/>
<title><data:blog.title/></title>
</b:if>
</b:if>
</b:if>
</b:if>
<!-- Halaman Postingan -->
<b:if cond='data:blog.pageType == "item"'>
<title><data:blog.pageName/> | <data:blog.title/></title>
</b:if>
<!-- Halaman Page -->
<b:if cond='data:blog.pageType == "static_page"'>
<title><data:blog.pageName/> | <data:blog.title/></title>
</b:if>
<!-- Halaman Error/404 -->
<b:if cond='data:blog.pageType == "error_page"'>
<title>Page Not Found</title>
</b:if>

Save template Anda dan lihat hasilnya.

UPDATE 31-08-2012 Mengubah struktur title di halaman search
<data:blog.pageTitle/> menjadi
<data:blog.searchQuery/> - Search Result <data:blog.title/>

Baca juga tutorial cara membuat meta description di Blogger. →

Cara Modifikasi Halaman “page not found” di Blogger

Apakah Anda secara teratur menulis atau mempublikasikan artikel di blog Anda? kadang-kadang Anda mungkin harus mengedit, memperbarui postingan atau menghapus postingan dari blog Anda. Ketika Anda mengedit artikel Anda, para pengunjung mungkin akan melihat artikel Anda yang terdahulu tidak tersedia lagi pada blog Anda. Dalam situasi seperti ini, pengunjung akan melihat halaman “page not found” atau halaman error 404 pada blog Anda.

Bagaimana cara agar pengunjung tidak meninggalkan blog Anda begitu saja pada saat melihat halaman error tersebut? Ada beberapa tips cara melakukan modifikasi terhadap halaman “page not found” di blog Anda, khususnya blog dengan platform Blogspot atau Blogger.

Cara Mengganti Pesan Error di Blogger
Secara default, halaman Error Blogger akan menampilkan pesan error seperti ini:

Sorry, the page you were looking for in this blog does not exist.

Anda dapat mengganti atau merubah pesan tersebut dengan pesan sesuai dengan keinginan Anda pada bagian Settings > Search preferences > Custom Page not Found atau (dalam settingan bahasa indonesia) Setelan > Preferensi penelusuran > Pesan Khusus untuk Laman Tidak Ditemukan

Anda dapat mengisi kotak tersebut dengan pesan yang Anda inginkan, maksimal 10.000 karakter termasuk pesan dalam format HTML. Misalnya,

<h3>Halaman yang Anda minta tidak ditemukan</h3>
<p>Maaf, kami tidak dapat menemukan halaman yang Anda cari. Halaman yang Anda cari kemungkinan telah dihapus, judul artikel telah diganti, atau sementara tidak tersedia.</p>

Cara menambahkan kotak pencarian di Halaman “page not found” di Blogger
Anda juga bisa menambahkan search box atau kotak pencarian untuk lebih memudahkan pengunjung melakukan navigasi di blog Anda.

<form method="get" action="/search">
<table width="100%">
<tr>
<td><input type="text" style="width:95%;padding:2px;" value="Cari blog ini.." onfocus="if (this.value == "Cari di blog ini..") {this.value = ""}" onblur="if (this.value == "") {this.value = "Cari blog ini...";}" name="q"></td>
<td><input type="submit" Value="Search"></td>
</tr>
</table>
</form>

Cara mengganti judul halaman error
Secara default judul error di blogspot adalah nama blog Anda. Jika Anda ingin menggantinya, masuk di halaman editor template dan ganti kode

<title><data:blog.pageTitle/></title>

menjadi

<b:if cond='data:blog.pageType == "error_page"'>
<title>Halaman Tidak Ditemukan</title>
<b:else/>
<title><data:blog.pageTitle/></title>
</b:if>

Semoga tutorial blogspot ini dapat membantu memberikan tampilan yang lebih baik terhadap halaman “page not found” di blog Anda.

Cara buat Meta Description Blogspot Seunik Mungkin

Enginer Om G pernah bilang, kalo bikin postingan usahakan kata kunci kamu itu harus ada di title, snippet dan url permalink. Kamu bisa cek sendiri dari hasil indeks blog kamu, terutama di blogspot, dengan mengetikkan di search box mesin pencari site:exampledomain.com, apakah kata kunci di title ada juga di snippet dan url kamu? kalo tidak ada silahkan kamu coba tips berikut dengan membuat sendiri meta description blog kamu seunik mungkin.

1. Design > Edit HTML > centang Expand Widget Templates
2. Ganti kode <title><data:blog.pageTitle/></title> dengan kode berikut:

<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.title/></title>
<meta expr:content='"Ganti text ini dengan deskripsi yang kamu inginkan karena ini akan tampil sebagai deskripsi halaman depan."' name='description'/>
<b:else/>
<title><data:blog.pageName/> – <data:blog.title/></title>
<meta expr:content='"Judul postingan tentang " + data:blog.pageName + " di blog saya. Silahkan baca artikel selain " + data:blog.pageName + " di blog saya."' name='description'/>
</b:if>

3. Save, dan lihat hasilnya lewat page source.

Mudah-mudahaan index blog kamu bertambah. Selamat mencoba deh sob! :)

Please Note
- Tips ini berguna juga untuk terhindar dari duplicate description. :)
- Kamu bisa ganti kata-kata yang ada dalam kode tersebut sesuai dengan yang kamu inginkan.
- UPDATE (22/08/2012). Tim Blogger telah menambahkan fitur Search preferences, yang mana di dalam fitur ini terdapat opsi cara mudah membuat meta description.