Cara Membuat Template Blog Valid XHTML - Sekarang ini para blogger banyak mencari template blogger yang responsive, valid XHTML dan seo friendly karena template blog seo friendly katanya disenangi google, apa bener gitu? Lalu apa saja yang perlu diotak-atik supaya template blog bisa menjadi valid? Ermawati akan share cara mengotimal seo blog yang salah satunya dengan memvalidkan template blogspot.
Blog dikatakan valid kalau tidak ada unsur-unsur yang membuat error dan untuk mengecek apakah blog sudah valid bisa langsung menuju ke The W3C Markup Validation Service atau langsung di http://validator.w3.org/.
Cara Membuat Valid XHTML pada Blogspot :
1. Penulisan kode javascript yang tidak valid seperti ini : <script type='https://sites.google.com/site/lintastutor/rudy/daun.js'></script>
Penulisan yang benar dengan menambahan type='text/javascript' seperti dibawah ini.
<script type='text/javascript' src='https://sites.google.com/site/lintastutor/rudy/daun.js'></script>
2. Untuk upload gambar di dalam postingan biasanya kodenya seperti ini
<a href="url gambar" imageanchor="1" ><img border="0" src="url gambar" /></a>
Supaya kode gambar menjadi valid silahkan hapus kode warna merah diatas dan perlu ditambahkan title dan alt contohnya seperti dibawah ini
<a href="url gambar" title="isi dengan judul"><img alt="isi dengan judul" src="url gambar" /></a></div>
3. Jika anda memasang kode embed video youtube di dalam postingan / homepage biasanya kode yang diberikan seperti dibawah ini.
<iframe width="560" height="315" src="http://www.youtube.com/embed/56ogvcBnIqY" frameborder="0" allowfullscreen></iframe>
Silahkan hapus tulisan "allowfullscreen"
Cara Membuat Template Blogspot Lebih Valid XHTML
Pilih Template => Edit HTML dan Tekan Ctrl + F
1. Cari kode seperti dibawah ini :
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<div class='mobile-link-button' id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
</div>
</b:if>
<b:if cond='data:olderPageUrl'>
<div class='mobile-link-button' id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
</div>
</b:if>
<div class='mobile-link-button' id='blog-pager-home-link'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
</div>
<div class='mobile-desktop-link'>
<a class='home-link' expr:href='data:desktopLinkUrl'><data:desktopLinkMsg/></a>
</div>
</div>
<div class='clear'/>
Silahkan anda hapus semua kode diatas
2. Cari kode seperti dibawah ini
<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>
Silahkan dihapus semua kode diatas dan ganti dengan kode dibawah ini
<span class='post-icons'>
<!-- email post links -->
<b:if cond='data:post.emailPostUrl'>
</b:if>
</span>
</div>
3. Letakkan kode berikut diatas <body> untuk menghilangkan Navbar
<!-- <body><div></div> -->
4. Kalau menemukan kode seperti ini (------------------------) silahkan dihapus
5. Cari kode <b:include name='nextprev'/> dan hapus untuk diganti dengan kode dibawah ini
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<!-- navigation -->
<b:include name='nextprev'/>
</b:if>
6. Cari kode <b:include name='quickedit'/> dan hapus semua
7. Mengganti deklarasi DOCTYPE seperti dibawah ini
<?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'>
Silahkan hapus kode diatas dan ganti degan kode dibawah 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'>
Demikianlah tutorial Cara Bikin Template Blogspot Valid XHTML, semoga bermanfaat.
