Thursday, April 18, 2013

Agar Templete Blogger Valid XHTML Terbaru

XHTML Css ValidationDalam meningkatkan kualitas seo pada blog kita , banyak cara yang bisa kita lakukan dan salah satunya adalah membuat templete blog kita valid xhtml atau valid html5 . Sesuai dengan judul postingan kali ini yaitu Agar Templete Blogger Valid XHTML Terbaru , kita akan mencoba mengurangi atau bahkan menghilangkan error pada Templete blogger kita dengan langkah-langkah yang akan saya jelaskan dibawah . Dengan mengurangi error pada templete blogger tersebut , diharapkan akan memberikan kemudahan pada mesin pencari google untuk menjelajahi blog kita dan secara otomatis meningkatkan kualitas seo dari blog kita tentunya.Agar mendapatkan hasil yang maksimal dan tanpa error pada templete blogger kita , mungkin ada baiknya kita menggunakan accout blogger baru sebagai percobaan dari templete yang akan kita buat dan valid xhtml atau valid html5 . Dan jika anda menggunakan account yang biasa anda gunakan dan dengan templete yang telah terpasang pastikan anda telah membackupnya terlebih dahulu serta menggkopi semua kode yang terdapat dalam widget kedalam notpad dan kemudian menghapus semua widget tersebut . Karena kebanyakan error templete biasanya di sebabkan oleh widget yang kita pasang pada templete kita . Untuk mengecek validasi dari blogger templete kita , ada dua buah tool yang bisa kita gunakan yaitu Markup Validation Service dan CSS Validation Service dari W3C . Dengan kedua tool tersebut kita akan mengetahui jumlah error serta penyebab timbulnya error pada templete dengan memasukan url blog kita , sehingga memudahkan kita untuk mengedit atau memperbaiki error tersebut.

Setelah kita mengetahui bagian penyebab error dari templete blogger kita , inilah saatnya melakukan perbaikan pada error tersebut . Ada beberapa bagian penyebab error yang biasa timbul pada kebanyakan templete blogger dan kali ini saya mencoba memberikan solusi serta cara mengurangi error tersebut.

Adapun langkah-langkah selanjutnya Agar Templete Blogger Valid XHTML Terbaru adalah:

1. Log in Ke Blogger dasbor dengan account anda.
2. Pilih Opsi lainya >>> Pilih Templete >>>Back Up dulu Templete Anda.
3. Klik Edit HTML >>>Centang Kotak Expand Template Widget .
4. Cari Kode seperti atau mirip kode dibawah ini .

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html 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>
5. Ganti kode diatas (no.4) dengan kode di bawah ini.
<!DOCTYPE html>
<HTML>
<head>
<meta charset='utf-8'/>
6. Selanjutnya Cari kode </html> dan ganti menjadi </HTML> .

7. Hapus semua bagian Meta tag yang menyebabkan error.

8. Cari Kode <b:include data=’blog’ name=’all-head-content’/> kemudian hapus kode tersebut.

9. Cari semua Comment Declaration pada bagian css ( /* ----------- ) dan hapus bagian kode ( ----------- ) atau dash.
/* ----------------------
    Name: Simple Faster Blogger Templates
    Date: 1 Maret 2013
    Edited by: Blogger Gubug
    -------------------------*/ 
Sehingga menjadi menjadi
/* Blogger Template Style
    Name: Simple Faster Blogger Templates
    Date: 1 Maret 2013
    Edited by: Blogger Gubug */
10. Cari kode <body> dan letakan kode di bawah ini di atas kode <body> tersebut.
<!-- <body><div></div> -->
Keterangan ;

* langkah ini untuk menghilangkan kode navbar bawaan dari blogger.
* Akan muncul peringatan untuk menghapus navbar, dan klik hapus .

11. Cari kode <b:include name='quickedit'/> kalo sudah ketemu hapus semua, jangan lupa jika kelak menambahkan widget baru hapus lagi kode tersebut.Ini untuk menghilangkan Icon Quickedit ( gambar kunci dan obeng).

12. Cari kode di bawah ini gunakan Ctrl+F atau F3 untuk memudahkan pencarian.
<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>
Ganti dengan kode berikut
<span class='post-icons'>
    <!-- email post links -->
    <b:if cond='data:post.emailPostUrl'>
    </b:if>
    </span>
    </div>
13. Tambahkan type="text/javascript" pada semua kode JavaScript. Baik pada templates, posting maupun pada widget.

contoh :
<script src='http://cilimoes-script-file.googlecode.com/files/IEmarginFix.js'/>
Sehingga menjadi:
<script src='http://cilimoes-script-file.googlecode.com/files/IEmarginFix.js' type='text/javascript'/>
14. Tambahkan type type="text/css" untuk semua kode css yang ada . Baik pada templates, posting maupun pada widget.

Contoh ;
<style>


<script src="https://bambangpage.googlecode.com/files/test.css"></script>
Sehingga menjadi :
<style type='text/css'>
<script src="https://bambangpage.googlecode.com/files/test.css" type="text/css" ></script>
15. Tambahkan atribut title dan alt pada setiap gambar.dan pada saat posting gambar hapus atribut Anchor='1' dan Border='0' .

Contoh :
<img src="http://newtemplete-project.googlecode.com/files/Bp_button.png/" />
Sehingga menjadi :
<img alt="BP_LOGO" src="http://newtemplete-project.googlecode.com/files/Bp_button.png/" title="Bp_LOGO" />
16. Jangan pernah menggunakan tag <center> untuk membuat tulisan ataupun gambar rata tengah, pakailah kode berikut jika tidak ingin mengakibatkan error html baik di postingan maupun di widget html.
<div style="text-align: center;">Isi Widget</div>
17. Untuk mengatasi masalah invlid xhtml yang disebabkan oleh adanya penggunaan url dalam template blog dengan tanda & , bisa kita selesaikan dengan mengganti setiap tanda & dengan kode dibawah ini.
&amp;

Sebenarnya masih banyak lagi langkah-langkah yang bisa kita lakukan Agar Templete Blogger Valid XHTML , namun kali ini saya mengambil point-point penyebab error pada templete blogger.

Selamat mencoba dan semoga bermanfaat.


Jika Anda Menyukai Artkel Seperti Di atas,Link back ke artikel ini dengan mengcopy salah satu kode di bawah ini

URL untuk Postingan:


HTML Link Code:

BB (forum) link code:



2 comments:

  1. Sebenarnya untuk membuat valid itu tidak mudah hingga hari ini saya juga masih belajar dan masih belum bisa valid, Saya cuma ingin tau kenapa code Seperti: application atom, application rss, dan application rsd dan beberapa Code function yang harus di konver tidak di sertakan...??

    ReplyDelete
  2. Kenapa tidak di sertakan karena tag-tag yang anda sebutkan tadi sering kali menyebab kan error pada W3C markup validation service maka dari itu tag-tag tersebut tidak di sertakan ..

    ReplyDelete

 

Copyright 2011 Bambang's Page is proudly powered by blogger.com | Design by Bambang's Page | Find us on Google+

Postingan Baru

Komentar Baru

Postingan Acak