Membuat Template Blogspot Valid XHTML 1.0. Template blogspot ada baiknya valid xhtml, alasannya karena dengan valid XHTML maka dapat berpengaruh pula terhadap SEO. Meskipun saya memberikan tutorial ini sedangkan template yang saya gunakan ini tidak valid XHTML. Pada postingan sebelumnya saya pernah menulis postingan mengenai Cara Pasang Slider Ala Zinmag Primus Template yang banyak sobat blogger ingin menggunakannya. kembali ke pokok pembicaraan. Membuat Valid XHTML tidak lah mudah, (Bagi Newbie seperti Saya) karena banyak kode yang sering kita gunakan padahal itu merupakan kode yang tidak valid ; contoh: sepertinya kita lebih sering memberi kode <br/> dibanding <p>...</p> untuk memberi perintah garis baru. padahal sesungguhnya pemberian kode br/ itu merupakan kode yang tidak valid XHTML (begitulah menurut para ahlinya). Selain itu penggunaan widget pun ternyata tidak terlalu baik terhadap valid XHTML ; contoh : widget kotak followers ternyata tidak valid XHTML.
Bagaimana cara cek blog yang valid XHTML? Caranya mudah, kunjungi saja situs http://validator.w3.org/, kemudian masukkan alamat blog sobat, nanti dapat terlihat berapa banyaknya yang error dan warning, blog saya memiliki sekian eror, sobat dapat cek sendiri untuk membuktikannya he..
Cara ini saya temukan dari SALAH SATU blogger yang sudah paham mengenai valid xhtml yaitu sobat Hendro Prayitno, kenapa saya membahas beliau, karena template blog yang beliau gunakan 100% valid xhtml, jika tidak percaya silakan untuk cek sendiri mengenai template sobat Hendro.
Cara ini saya temukan dari SALAH SATU blogger yang sudah paham mengenai valid xhtml yaitu sobat Hendro Prayitno, kenapa saya membahas beliau, karena template blog yang beliau gunakan 100% valid xhtml, jika tidak percaya silakan untuk cek sendiri mengenai template sobat Hendro.
Untuk membuktikan trik ini berhasil, setelah sobat cek di http://validator.w3.org/, jangan langsung ditutup, nantinya tiap tahap yang sobat edit, lakukan lah refresh pada hasil cek yang pertama tadi, error ataupun warningnya berkurang atau tidak.
Warning : Disarankan untuk membaca terlebih dahulu langkah-langkah di bawah ini, jika sobat setuju maka lakukan sesuai tutorial yang ada/petunjuk yang ada di blog ini dan untuk mengantisipasi eror pada template, disarankan untuk backup template sobat terlebih dahulu.
Bagaimana Cara Membuat Template Blogspot Valid XHTML 1.0? mari simak tutorialnya :
1. Menghapus widget, seperti yang tadi saya paparkan di atas, bahwa ada beberapa widget yang disediakan oleh flatform blogspot yang tidak valid xhtml, hapus kotak followers, dan rubah tampilan arsip menjadi flat list
2. Mulai edit html, cari kode dibawah ini (terletak paling awal dari kode template)
2. Mulai edit html, cari kode dibawah ini (terletak paling awal dari kode template)
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
Hapus kode diatas, dan ganti dengan kode di bawah ini :
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang='en' xml:lang='en' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
Kemudian kembali lagi ke situs http://validator.w3.org/ dengan result/hasil eror sebelum di edit, refresh dan lihat hasil erornya apakah berkurang atau tidak.
3. Menghapus comment declaration
Ini adalah koment yang ada di css sobat harus menghapusnya tanda yang seperti ini yang ada di css
-----------------------------------------------
Hapus seluruh tandanya tapi jangan di hapus sang pembuat template contoh:
3. Menghapus comment declaration
Ini adalah koment yang ada di css sobat harus menghapusnya tanda yang seperti ini yang ada di css
-----------------------------------------------
Hapus seluruh tandanya tapi jangan di hapus sang pembuat template contoh:
/*
-----------------------------------------------
Blogger Template Style
Name: Minima
Date: 26 Feb 2004
Updated by: Blogger Team
----------------------------------------------- */
Hapus ----------------------------------------------- (garis putus-putus) Maka hasilnya seperti di bawah
/*
Blogger Template Style
Name: Minima
Date: 26 Feb 2004
Updated by: Blogger Team
*/
Lalu kebawah lagi cari tanda yang sama dan hapus, setelah semua di hapus jangan lupa save template kemudian kembali lagi ke http://validator.w3.org/ refresh dan lihat apakah erornya berkurang.
4. Mulai memasuki Expand Widget Templates.
Sekarang silahkan di centang Expand Widget Templates Lalu masukan kode di bawah tepat di bawah </head> INI untuk menghilangkan navigasi bar
4. Mulai memasuki Expand Widget Templates.
Sekarang silahkan di centang Expand Widget Templates Lalu masukan kode di bawah tepat di bawah </head> INI untuk menghilangkan navigasi bar
<!-- <body><div></div> -->
Jangan lupa di save template
Nanti sobat temukan perintah apakah kita mau menghapus widget atau mempertahankan, (ini merupakan penghilangan navbar dari blogger "ternyata penggunaan navbar itu tidak valid lho") lalu pergi lagi ke http://validator.w3.org/ refresh dan lihat apakah erornya berkurang?
5. Hapus Quickedit
Hapus kode yang ada di bawah di dalam html, hapus semua kode <b:include name='quickedit'/> yang ditemukan dalam template :
Nanti sobat temukan perintah apakah kita mau menghapus widget atau mempertahankan, (ini merupakan penghilangan navbar dari blogger "ternyata penggunaan navbar itu tidak valid lho") lalu pergi lagi ke http://validator.w3.org/ refresh dan lihat apakah erornya berkurang?
5. Hapus Quickedit
Hapus kode yang ada di bawah di dalam html, hapus semua kode <b:include name='quickedit'/> yang ditemukan dalam template :
<b:include name='quickedit'/>
kembali lagi ke situs http://validator.w3.org/ refresh dan lihat hasil erornya apakah berkurang
(pengaruhnya tanda obeng pada tiap widget akan hilang, tapi tidak masalah karena masih bisa edit di page elements)
6.Menghapus post icon
Sekarang temukan kode di bawah:
(pengaruhnya tanda obeng pada tiap widget akan hilang, tapi tidak masalah karena masih bisa edit di page elements)
6.Menghapus post icon
Sekarang temukan kode di bawah:
<span class='post-icons'>
<!-- email post links -->
<b:if cond='data:post.emailPostUrl'>
<span class='item-action'>
<a expr:href='data:post.emailPostUrl' expr:title='data:top.emailPostMsg'>
<img alt='' class='icon-action' height='13' src='http://img1.blogblog.com/img/icon18_email.gif' width='18'/>
</a>
</span>
</b:if>
<!-- quickedit pencil -->
<b:include data='post' name='postQuickEdit'/>
</span> <div class='post-share-buttons'>
<b:include data='post' name='shareButtons'/>
</div> </div>
Kalau sudah ketemu hapus seluruh kode di atas dan ganti dengan kode di bawah:
<span class='post-icons'>
<!-- email post links -->
<b:if cond='data:post.emailPostUrl'>
</b:if>
</span>
</div>
(ini merupakan penghapusan icon gambar pensil yang secara default sudah ada dari blogger "ternyata tidak valid ")
Save template dan kembali lagi ke http://validator.w3.org/ jangan lupa di refresh maka hasilnya adalah
Save template dan kembali lagi ke http://validator.w3.org/ jangan lupa di refresh maka hasilnya adalah
Sampai disini semua tahapan telah selesai, apakah template yang di edit berkurang result erornya? semoga saja :)
-----Semoga Bermanfaat-----
