Bila Sobat berminat, sobat bisa melihat demo dan mendownloadnya langsung di blognya sobat @Choen disini : Template Valid xHTML
Nah karena blog saya sudah berisi postingan dan banyak widget, tentu saja banyak error/warning untuk valid XHTML, dan harus dibenahi kembali. Serta dikarenakan fitur-fitur default dari template blogger yang kurang bersahabat dengan XHTML.
Yasudah kita mulai saja dari awal, cara ini saya dapat dari berbagai sumber, dan ini berdasarkan apa yang saya tahu dan saya praktekan di blog saya ini, hasilnya... bisa kita lihat nanti.
Langkah pertama kunjungi website berikut untuk mengecek valid XHTML,
Silahkan kunjungi disini:http://validator.w3.org
Setelah masuk dan muncul seperti gambar dibawah ini:
screenshot
Setelah itu masukan alamat url blog sobat, dan klik CHEk... lihatlah hasil reviewnya, bisa sobat lihat berapa jumlah error dan warning blog sobat, sedikitkah?? banyakkah?? nah kalau banyak berarti selamat, hasilnya sama kayak punya saya.. hahaha ^^
ini hasil dari blog saya
Bagaimana cara untuk mengurangi error/warning, agar lebih valid XHTML ??
Berikut caranya:
1. Login ke akun blogger sobat
2. Masuk Rancangan/Layout
3. Pilih Edit HTML
4. Klik "Download Template Lengkap" (ini untuk memBackUp template sobat)
5. Beri tanda centang "Expand Template Widget"
6. Setalah itu kita mulai step by step dan cari kode dibawah ini:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Kemudian, gantilah kode diatas dengan kode berikut:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Pastikan setelah itu simpan dan sobat cek untuk melihat perbedaan/hasilnya.
7. Perhatikan kode dibawah ini, kode bawaan/default blogger biasanya seperti ini:
<b:skin><![CDATA[/*
-----------------------------------------------
Blogger Template Style
Name: Minima
Date: 26 Feb 2004
Updated by: Blogger Team
----------------------------------------------- */
Hapuslah semua kode/tanda strip (--) hanya stipnya saja yang dihapus.
Dan cek juga pada kode css yang lainya, biasanya terdapat banyak tanda seperti pada contoh diatas.
Hasilnya kan menjadi seperti ini:
<b:skin><![CDATA[/*
Blogger Template Style
Name: Minima
Date: 26 Feb 2004
Updated by: Blogger Team
*/
8. Jika sobat menambah sebuah widgate atau gadget, ingatlah untuk menghapus:
<b:include name='quickedit'/>
9. Ini yang mungkin pengaruhnya cukup banyak untuk valid XHTML, tapi ?? efeknya juga ada sob, setelah saya hapus kodenya, ternyata avatar untuk komentar admin blog tidak muncul, hal ini juga yang sempat membuat saya pusing, kenapa avatar admin pada komentar blog saya tidak muncul.
dan semua terserah sobat, mau mempertahankan atau menghapusnya.
cari dan hapuslah kode:
<b:include data='blog' name='all-head-content'/>
10. Ini juga sebenernya melanggar TOS blogger, karena kita menghilangkan Navbar blog, tapi kalo memank mau valid ya tidak ada cara lain selain menghapusnya.
tambahkan kode berikut di bawah tag: </head>
<!-- <body>
<div></div> -->
11. Jika Sobat meng-upload sebuah image, ubah script tersebut. contoh scriptnya seperti ini:
<a href="http://validator.w3.org/"><img alt="Markup Validation Service" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuL_D6pCdWlt4aYHVzG_Kmzsi2A6N9_QHVDD9Oyejg5W5Z3pt-G1-mAjSEE90iecRs2g9LbjcSem-QSQChYHoNpnV86Hi-ybpiS-cFxZ-mzm2c-PiA3mafo0sGuOW4MM1FTJyqp9woVkY/s320/valid-html.gif" /></a>
12. Jika sobat menemukan penulisan meta content dengan huruf besar, contoh:
<META content='blogger' name='generator'/>
Ubahlah menjadi:
<meta content='blogger' name='generator'/>
Nah mungkin cara diatas cukup untuk membuat template blog lebih valid XHTML, sebenarnya masih banyak, dan masih bisa dikompres lagi, itu tergantung widget/kode script yang ada di blogger sobat.
Misalnya:
Saya membuang kode script untuk recent post, dan recent comment, facebook like, tentunya agar lebih valid XHTML, untuk widget followers bisa kita akali dengan google friend connect.
tapi bila sobat masih ingin mempertahankan widget tersebut, saya rasa cara diatas sudah paling maksimal untuk valid XHTML.
Untuk hal lainnya bisa sobat atak-atik sendiri dan mungkin sobat blogger punya trick baru, jadi kalau ada, jangan lupa share juga ya sob!! hehehe
Untuk hasilnya silahkan sobat cek sendiri di: http://validator.w3.org
Sobat juga bisa mengecek blog saya ini, dan lihat hasilnya.
Dari saya cukup sekian, semoga bermanfaat.
UPDATE
Menambahkan jenis type="text/javascript" pada semua kode JavaScript yang ada.
Contoh:
<script src="http://sites.google.com/site/kodeblogger/javascript/post-terakhir.js"></script>
Ubahlah Menjadi:
<script type="text/javascript" src="http://sites.google.com/site/kodeblogger/javascript/post-terakhir.js"></script>
Simpan, jangan lupa untuk mengecek kembali blog sobat untuk melihat hasilnya.
Thanks.
Tutorial yang sangat bermanfaat Mas bro...
BalasHapus@Adis Production Bali: Hehe, Makasih mas bro... salam kenal :)
BalasHapusom kalo blog valid mank buat apa???
BalasHapusmasalahnya yang eror di blog saya ada 360 dan warning 380,,,,
BalasHapussangat membantu infonya buatnewbie seperti saya...sekalian mau ngantari award buat sahabat viyan..kalau mau silakan ambil di blog saya..suksess yacchh
BalasHapus@Imaduddin: Setahu saya, akan berpengaruh pada search engin, blog/website yang valid XHTML akan lebih mendapatkan perhatian dari mesin penelusur(search engin) atau boleh dikatakan "SEO Friendly"
BalasHapus@Blog SEO Drakula: Wahhh.. Award lagi yaa?? ok sob, TKP...
Thank banget sob :)
keren,, dapet award lagi y om blogger,,,,,
BalasHapusaqw mau tanya tapi belum dijawab,, sekarang aqw mau tanya y? cara munculin emoticon yang tidak muncul tuh gmna y??,,,
aqw butuh banget,,, kk kan master blogger,, heheehehe
Mantap gan.. saya sudah lama mengotak.atik hal ini.. tapi tetep aja banyak errornya...
BalasHapus@Deafile: Yah valid XHTML rata2 cuman pada halaman awalnya/Home-pagenya saja, pastilah banyak yang dikorbanin kalo mau bener2 valid. hehhee
BalasHapustoh semua itu gak mutlak sob. karena filtur2 default dari blogger jg gak bersahabat denga xHTML.
jadi, menurut saya jg gak begitu bermasalah.
@Imaduddin: Yup, makasih sob.
BalasHapusWeleh, gak ada master disini sob, saya jg masih sambil belajar, jadi mari kita sama2 belajar.
Emoticon pada kotak komentar atau emoticon pada blogger sob??
Untuk masalah emoticon gak muncul coba sobat baca terlebih dahulu di:
http://kode-blogger.blogspot.com/2011/03/cara-mudah-menambah-emoticon-pada.html
309 Errors, 270 warning(s)
BalasHapusmakasih atas infonya. . .info ini sangat penting buat saya. . . . info ini benar-benar berguna buat saya. . .
BalasHapusjangan lupa lihat juga blog saya yach. .
http://aboutinstallationlinux.blogspot.com/
makasih. . .
@boy : Huehehe, Lumayan banyak tuh
BalasHapus@about linux : Yupz, sama2 Sob? Blognya bagus sob !!
mantab infonya gan, sangat bermanfaat.
BalasHapusane follow agan ya, btw follow balik ya gan. salam kenal
As a Newbie, I am always exploring online for articles that can help me. Thank you
BalasHapusSelamat malam dan selamat beristirahat.. berkunjung di malam hari sambil mencari artikel tentang cara memasukan kode CSS dan JQuerry serta Script neh.. mumet kemana2 bahasa linggis semua ... hohohoho Blognya kyknya ada yang berubah nih.... ^_^
BalasHapus@Informasi Ku: Sipp gan, pasti saya follow balik.
BalasHapussalam kenal juga :)
@Ali Hamid: Hi Bro ?? I am also newbie bro? Thanks for the visit and comment.
@Astro: Malam sob, wah sibuk neh critanya :))
Bagian mana yang berubah sob?? ;))
soreee.... prikitiew... setelah di analisa ternyata navigasi nya berubah :-o mantebh tebh deh... :)) met beraktifitas dueh di hari yang cerah ini....
BalasHapusbisa bantu pasang kode JS di blog saya sob.. ane sdh mumet met masukin kodenya tp gagal terus :((
BalasHapushttp://astro-note.blogspot.com/
@Astro: Yupz, makasih sob.
BalasHapusKode.js buat bikin apaan sob ??
bisa dicoba itu mas boy.......
BalasHapus@Cay's: Sip, silahkan mas bro ?? :)
BalasHapusnice share,. thx
BalasHapusmakasih banyak beget buatmas
BalasHapussangat bermanfaat buat saya:))
@North Sulawesi Tourism: Makasih Sob...
BalasHapus@Arya: Semoga bisa membantu Mas. :)
nice sob, lumayan udh turun yang erornya... tpi masih 100an yang tertinggal..
BalasHapusHalo teman bagaimana cara mengurangi kesalahan saya lebih dari template saya, saya mengikuti saran mereka (ucapan selamat di website Anda) dan memiliki beberapa blogger hacks terakhir
BalasHapusIni adalah www.uviconsejos.com web saya
Terima kasih banyak
Saya terjemahkan pesan estte karena saya tidak berbicara melalui penerjemah google Idoma
Salam dari Spanyol
Nica artikel
BalasHapuswah bgus ini, izin coba yah mas :D
BalasHapushehe tq sob,aq baru liat2 posting yang ini tq boy
BalasHapuswah ada lagunya heheheheheh...........
BalasHapussudah lama saya menerapkannya...
BalasHapusbtw thnx :-bd
makasih infonya...
BalasHapussekalian share cara memperbaiki yang errornya dunk om
siip
BalasHapus