Mungkin salah satu kelemahan terbesar blogger sebagai media weblog adalah format HTML dan CSS yang tidak bisa valid menurut W3C Validator. Padahal validasi itu sendiri diperlukan untuk mendapatkan design weblog yang mendekati sempurna selain beberapa aspek lain yang tidak kalah penting. Setelah beberapa lama menyimpan artikel ini kini akan saya ulas dibagian Blogger Tutorial.
Satu hal yang perlu diperhatikan sebelum melakukan Validasi pada template Blogger yaitu karakteristik tiap template yang berbeda, jadi jangan kaget jika ada beberapa code yang tidak anda temukan dalam template anda. Selain hal tersebut ada juga bagian yang sering dilupakan yaitu pemakaian widget yang tidak valid, tentunya hal tersebut menambah daftar error dalam validasi weblog anda. Terlalu banyak kalimat pembuka, mari kita lanjut ke Step by Step Validasi Blogger. Jangan lupa save template sebelum edit lebih lanjut, jaga-jaga kalau terjadi error pada template anda. Pada tab lain buka halaman HTML Validation W3C untuk melihat seberapa banyak error yang tersisa dan letak kesalahannya.
1. Pada Edit HTML "doctype" default blogger mempunyai tingkat kesulitan untuk menjadi valid, Solusinya ganti
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
dengan
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2. Pada Edit HTML contreng expand template widget lalu cari code
<b:include data='post' name='postQuickEdit'/>
dan
<b:include name='quickedit'/>
selanjutnya hapus semuanya. Fungsi code tersebut adalah icon Quick edit pada masing-masing widget, beberapa blogger hack bisa mendisable atau menghilangkan icon tersebut namun link edit widget itu sendiri adalah error karena mengandung code & yang tidak di tutup oleh ; sehingga menghasilkan error.
3. Jangan lupa tambahkan tag ALT pada setiap image yang terdapat pada weblog, sekecil apapun image tersebut. Hal ini dimaksudkan agar Image tersebut tidak hanya berfungsi secara visual, namun dapat di baca oleh robots. Selain itu jangan lupa untuk menggunakan penutup tag tersebut dengan attribut /> sehingga bisa mengurangi error pada html validation.
4. Jangan gunakan widget Archive menggunakan tampilan Hierarchy, karena itu akan menampilkan banyak error. Lebih baik gunakan Model List sehingga mengurangi error, selain itu tampilannya akan lebih simple dan elegant.
5. Berhati-hati dalam menggunakan langkah berikut ini, pastikan anda tidak salah dalam melakukan copy paste karena sedikit perubahan dapat mengakibatkan error.
Cari code
<b:include data='blog' name='all-head-content'/>
Ganti code tersebut dengan code berikut ini
<!-- Blogger Default Meta -->
<meta content='true' name='MSSmartTagsPreventParsing'/>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<link expr:href='data:blog.url' rel='canonical'/>
<link href='http://www.blogger.com/profile/IDBLOGGERANDA' rel='me'/>
<link href='http://www.blogger.com/openid-server.g' rel='openid.server'/>
<link href='http://www.blogger.com/rsd.g?blogID=IDBLOGANDA' rel='EditURI' title='RSD' type='application/rsd xml'/>
<link href='http://www.blogger.com/feeds/IDBLOGANDA/posts/default' rel='service.post' title='OBLO - Atom' type='application/atom+xml'/>
<link href='http://www.URLANDA.blogspot.com/feeds/posts/default' rel='alternate' title='OBLO - Atom' type='application/atom+xml'/>
<!-- End Blogger Default Meta -->
Perhatikan!
IDBLOGGERANDA = dapat anda jumpai pada alamat URL Profile Blogger anda.
IDBLOGANDA = dapat anda jumpai pada alamat URL edit Html Blog anda.
URLANDA = isi dengan url blog anda.
6. Jangan terlalu banyak menggunakan dash ( - ) pada HTML blog anda, memang akan terlihat indah jika kita menambahkan beberapa code ASCII disana, namun sadarkah anda itu hanya akan menambah jumlah error pada HTML / CSS anda.
Gunakanlah sesederhana mungkin.
HTML
<!------------------- Blogger Default Meta ----------------------> SALAH
<!-- Blogger Default Meta --> Benar ( terlihat simple dan rapi )
CSS
/*----------- Header ------------*/ SALAH
/* Header */ Benar
7. Banyak yang mengeluarkan trick untuk mendisable Default NAVBAR Blogger, tapi bagaimana kalo kita hapus saja Navbar tersebut. Karena walaupun di hidden / disable, link yang terdapat didalamnya akan tetap terbaca. Letakkan code berikut diantara </head> dan <body>
<!-- <body>
<div></div> -->
setelah itu save template, maka akan keluar notifikasi untuk menghapus Widget Navbar. Done you lost the Navbar. :)
8. Sebetulnya masih banyak yang perlu di benahi dalam blogger terutama penggunaan & ( & ) dalam setiap URLnya, karena code tersebut tidak bisa berdiri sendiri dan harus di akhiri dengan ( ; ) pada HTML, solusinya gunakan code &amp;.
Dengan melakukan beberapa step diatas anda tidak akan memperoleh hasil yang valid dari blogger karena beberapa bagian penting dari blogger sendiri itu mengandung ERROR. Kita bisa mengakalinya dengan menghapusnya, namun fungsi dari widget yang kita hapus tersebut tidak bisa berjalan dengan sempurna. Beberapa bagian blogger yang cukup mengandung banyak error adalah Comment box dan link Comments yang lagi lagi menggunakan code ( & ). Selain itu pada halaman index terdapat juga error pada navigation page ( New and older post ).
Untuk menghilangkan Navigasi newer dan older post pada halam index, dapat menggunakan trik berikut ini. Cari code dibawah ini
<b:include name='nextprev'/>
ganti dengan
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<!-- navigation -->
<b:include name='nextprev'/>
</b:if>
Catatan: Jangan lupa cek error blog anda pada W3C HTML Validator untuk mengetahui sisa kesalahan anda tiap kali melewati Step by Step Validasi Blogger.
Satu hal yang perlu diperhatikan sebelum melakukan Validasi pada template Blogger yaitu karakteristik tiap template yang berbeda, jadi jangan kaget jika ada beberapa code yang tidak anda temukan dalam template anda. Selain hal tersebut ada juga bagian yang sering dilupakan yaitu pemakaian widget yang tidak valid, tentunya hal tersebut menambah daftar error dalam validasi weblog anda. Terlalu banyak kalimat pembuka, mari kita lanjut ke Step by Step Validasi Blogger. Jangan lupa save template sebelum edit lebih lanjut, jaga-jaga kalau terjadi error pada template anda. Pada tab lain buka halaman HTML Validation W3C untuk melihat seberapa banyak error yang tersisa dan letak kesalahannya.
1. Pada Edit HTML "doctype" default blogger mempunyai tingkat kesulitan untuk menjadi valid, Solusinya ganti
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
dengan
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2. Pada Edit HTML contreng expand template widget lalu cari code
<b:include data='post' name='postQuickEdit'/>
dan
<b:include name='quickedit'/>
selanjutnya hapus semuanya. Fungsi code tersebut adalah icon Quick edit pada masing-masing widget, beberapa blogger hack bisa mendisable atau menghilangkan icon tersebut namun link edit widget itu sendiri adalah error karena mengandung code & yang tidak di tutup oleh ; sehingga menghasilkan error.
3. Jangan lupa tambahkan tag ALT pada setiap image yang terdapat pada weblog, sekecil apapun image tersebut. Hal ini dimaksudkan agar Image tersebut tidak hanya berfungsi secara visual, namun dapat di baca oleh robots. Selain itu jangan lupa untuk menggunakan penutup tag tersebut dengan attribut /> sehingga bisa mengurangi error pada html validation.
4. Jangan gunakan widget Archive menggunakan tampilan Hierarchy, karena itu akan menampilkan banyak error. Lebih baik gunakan Model List sehingga mengurangi error, selain itu tampilannya akan lebih simple dan elegant.
5. Berhati-hati dalam menggunakan langkah berikut ini, pastikan anda tidak salah dalam melakukan copy paste karena sedikit perubahan dapat mengakibatkan error.
Cari code
<b:include data='blog' name='all-head-content'/>
Ganti code tersebut dengan code berikut ini
<!-- Blogger Default Meta -->
<meta content='true' name='MSSmartTagsPreventParsing'/>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<link expr:href='data:blog.url' rel='canonical'/>
<link href='http://www.blogger.com/profile/IDBLOGGERANDA' rel='me'/>
<link href='http://www.blogger.com/openid-server.g' rel='openid.server'/>
<link href='http://www.blogger.com/rsd.g?blogID=IDBLOGANDA' rel='EditURI' title='RSD' type='application/rsd xml'/>
<link href='http://www.blogger.com/feeds/IDBLOGANDA/posts/default' rel='service.post' title='OBLO - Atom' type='application/atom+xml'/>
<link href='http://www.URLANDA.blogspot.com/feeds/posts/default' rel='alternate' title='OBLO - Atom' type='application/atom+xml'/>
<!-- End Blogger Default Meta -->
Perhatikan!
IDBLOGGERANDA = dapat anda jumpai pada alamat URL Profile Blogger anda.
IDBLOGANDA = dapat anda jumpai pada alamat URL edit Html Blog anda.
URLANDA = isi dengan url blog anda.
6. Jangan terlalu banyak menggunakan dash ( - ) pada HTML blog anda, memang akan terlihat indah jika kita menambahkan beberapa code ASCII disana, namun sadarkah anda itu hanya akan menambah jumlah error pada HTML / CSS anda.
Gunakanlah sesederhana mungkin.
HTML
<!------------------- Blogger Default Meta ----------------------> SALAH
<!-- Blogger Default Meta --> Benar ( terlihat simple dan rapi )
CSS
/*----------- Header ------------*/ SALAH
/* Header */ Benar
7. Banyak yang mengeluarkan trick untuk mendisable Default NAVBAR Blogger, tapi bagaimana kalo kita hapus saja Navbar tersebut. Karena walaupun di hidden / disable, link yang terdapat didalamnya akan tetap terbaca. Letakkan code berikut diantara </head> dan <body>
<!-- <body>
<div></div> -->
setelah itu save template, maka akan keluar notifikasi untuk menghapus Widget Navbar. Done you lost the Navbar. :)
8. Sebetulnya masih banyak yang perlu di benahi dalam blogger terutama penggunaan & ( & ) dalam setiap URLnya, karena code tersebut tidak bisa berdiri sendiri dan harus di akhiri dengan ( ; ) pada HTML, solusinya gunakan code &amp;.
Dengan melakukan beberapa step diatas anda tidak akan memperoleh hasil yang valid dari blogger karena beberapa bagian penting dari blogger sendiri itu mengandung ERROR. Kita bisa mengakalinya dengan menghapusnya, namun fungsi dari widget yang kita hapus tersebut tidak bisa berjalan dengan sempurna. Beberapa bagian blogger yang cukup mengandung banyak error adalah Comment box dan link Comments yang lagi lagi menggunakan code ( & ). Selain itu pada halaman index terdapat juga error pada navigation page ( New and older post ).
Untuk menghilangkan Navigasi newer dan older post pada halam index, dapat menggunakan trik berikut ini. Cari code dibawah ini
<b:include name='nextprev'/>
ganti dengan
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<!-- navigation -->
<b:include name='nextprev'/>
</b:if>
Catatan: Jangan lupa cek error blog anda pada W3C HTML Validator untuk mengetahui sisa kesalahan anda tiap kali melewati Step by Step Validasi Blogger.
