Bagaimana cara membuat template blogger lebih valid XTHML? ikuti step demi step berikut!
- Login ke akun blogger sobat
- Masuk Rancangan/Layout
- Pilih Edit HTML
- Klik "Download Template Lengkap" (ini untuk memBackUp template sobat)
- Beri tanda centang "Expand Template Widget"
- 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">
- Cari kode semacam 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:
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
*/ - Cari kode dibawah ini:
<b:include name='quickedit'/>
Hapus saja semua kode diatas yang ada dalam template kamu,dan ingat! kode diatas akan muncul jika kamu menambah gadget pada blog kamu,jadi selalulah menghapusnya ketika sesudah kamu menambah gadget.
- Cari kode dibawah ini:
<b:include data='blog' name='all-head-content'/>
Dan hapus saja juga! tapi buat kamu yang memberi foto profile pada komentar blog maka berisiko foto-foto profile komentar tidak muncul,tapi terserah ke kamu,kalau ingin valid maka sikat aja.
- Langkah selanjutnya silahkan kamu cari kode </head> dan letakkan kode dibawah ini tepat dibawah kode </head>
<!-- <body>
<div></div> --> - Jika Sobat meng-upload sebuah gambar, berilah tambahan alt pada gambar tersebut. contoh kode alt seperti ini:
<a href="http://validator.w3.org/"><img alt="Markup Validation Service" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbiv43KWt1T3esGnIdDJVGiyFuD8GC1yv5pDK-jqQuPWqoNWYs7eeOrF7IIl6rdqpeOVUijoAQO-VDbmSWcR6yFrANgsZq-qugz1VtsC62BBm8WBrXRkJFgbG_DCwdFkjkSPelFWRbgeQ/s320/valid-html.gif" /></a>
- Jika sobat menemukan penulisan meta content dengan huruf besar, rubahlah menjadi huruf kecil,contoh:
<META content='blogger' name='generator'/>ubah menjadi:<meta content='blogger' name='generator'/> - Menghapus Post icon,adapun kode post icon atau pensil kodenya mirip kode seperti ini:
<span class='post-icons'>
Ganti kode diatas dengan kode berikut:
<!-- 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://www.blogger.com/img/icon18_email.gif' width='18'/>
</a>
</span>
</b:if>
<!-- quickedit pencil -->
<b:include data='post' name='postQuickEdit'/>
</span>
<span class='post-icons'>
<!-- email post links -->
<b:if cond='data:post.emailPostUrl'>
</span>
</div> - Menambahkan jenis type="text/javascript" pada semua kode JavaScript yang ada. Contoh:
<script src="http://infonetmu.googlecode.com/files/SakuraRain.js"></script>Tambahkan kode berwarna merah seperti dbawah ini:
<script type="text/javascript" src="http://infonetmu.googlecode.com/files/SakuraRain.js"></script> - Menyembunyikan page navigation di halaman utama
cari kode:
<b:include name='nextprev'/>
ganti kode diatas dengan kode dibawah ini!
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<!-- navigation --><b:include name='nextprev'/></b:if> - Memperbaiki attribut title dan alt pada link gambar.sebagai contoh:
<a href="http://infonetmu.blogspot.com" alt="free backlink generator" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHuXj5LWtBZA29J7zs-L2NI8xZtb8x8h72Iq5jyFOOmTlrTQu53x3JPsbaKDCZMJajQ4XGhEw95soBH6BzFJ3Qnk6BqUD1xeR8INZjt5XoKMO7lzsCxi-J6jOAUKa5OefMzVH8DjF6RwGX/s1600/aang-vs-naruto+%281%29.jpg" title="Free backlinks generator" border="0" /></a>
Rubah menjadi:
<a href="http://infonetmu.blogspot.com" title="free backlink generator" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHuXj5LWtBZA29J7zs-L2NI8xZtb8x8h72Iq5jyFOOmTlrTQu53x3JPsbaKDCZMJajQ4XGhEw95soBH6BzFJ3Qnk6BqUD1xeR8INZjt5XoKMO7lzsCxi-J6jOAUKa5OefMzVH8DjF6RwGX/s1600/aang-vs-naruto+%281%29.jpg" alt="Free backlinks generator" border="0" /></a>
Untuk kasus diatas jangan lupa untuk link atributnya title dan target, untuk gambar alt dan border jagan sampe terbalik-balik.
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. Untuk hasil silahkan cek sebelum dan sesudah kamu edit menjadi valid XHTML, silahkan cek disini http://validator.w3.org
sumber
0 komentar:
Posting Komentar