Kamis, 13 Desember 2012

[ Tutorial ] Cara Membuat Template Blog Sendiri


    Login ke Blogger.
    Masuk pada Edit HTML, jangan lupa Centang "Expand template...".
    Cari Kode di bawah ini.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

    Lalu ganti dengan Kode di bawah ini.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    Cari lagi Kode di bawah ini.

<b:skin><![CDATA[/*
--------------------------
Blogger Template Style Olala
Name : NN
Updated by: Blogger Team
------------------------- */

    Atau Seperti

<b:skin><![CDATA[/*
-----------------------------------------------
Blogger Template Style
Name:     Minima
Date:     26 Feb 2004
Updated by: Blogger Team
----------------------------------------------- */

    Pada kode di atas, Hapus tanda (--). Dan kalau kamu temukan ada tanda seperti itu pada template kamu hapus saja. Sehingga hasilnya seperti di bawah ini.

<b:skin><![CDATA[/*
Blogger Template Style

 Name : Minima

 Updated by: Blogger Team
*/

    Setelah itu, kamu cari lagi kode di bawah ini.

<b:include name='quickedit'/>

    Hapus semua Kode di atas pada Template kamu. Kode di atas bertujuan hanya utk menampilkan Icon Tang dan Obeng. Kalau kamu menambahkan Widget baru maka kode tersebut akan muncul kambali, dan jangan lupa untuk menghapusnya lagi.
    Cari lagi kode di bawah ini.

 <b:include data='blog' name='all-head-content'/>

    Hapus lagi kode di atas, namun resiko nya adalah Photo Profil pada Komentar Blog tidak akan muncul. Tapi demi Validasi hapus saja deh, :D dan Ganti dengan Kode di bawah ini lalu buat keterangan sesuai dengan Blog mu pada kata yg bertulis miring!

 <meta content='true' name='MSSmartTagsPreventParsing'/>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<link expr:href='data:blog.url' rel='canonical'/>
<link href='http://www.blogger.com/profile/Id Profile Blog Kamu' rel='me'/>
<link href='http://www.blogger.com/openid-server.g' rel='openid.server'/>
<link href='http://www.blogger.com/rsd.g?blogID=Id Profile Blog Kamu' rel='EditURI' title='RSD' type='application/rsd xml'/>
<link href='http://www.blogger.com/feeds/Id Profile Blog Kamu/posts/default' rel='service.post' title='Nama Blog Kamu - Atom' type='application/atom+xml'/>
<link href='http://NamaBlog.blogspot.com/feeds/posts/default' rel='alternate' title='Nama Blog Kamu - Atom' type='application/atom+xml'/>

     Berikutnya adalah kamu cari kode </head> dan letakkan Kode di bawah ini tepat di bawah Kode tadi.

<!-- <body><div></div> -->

    Selanjutnya akan beralih ke Meta tag. Saya sarankan pada Meta Tag kamu menulis dengan Huruf Kecil. Contoh : <Meta Content="INDEX, FOLLOW" name="Robots"> menjadi <meta content="index, follow" name="robots">
    Setelah itu kamu Tambahkan Jenis type="text/javascript" pada semua Kode JavaScript yang ada pada template atau Widget Blog. Contoh : <script type="text/javascript" src="http://b-l-o-g.googlecode.com/files/Script-Label.js"></script>
    Cara Selanjutnya adalah menyembunyikan Page Navigation di Halaman Utama Blog. Cari kode ini : <b:include name='nextprev'/> Lalu kamu Ganti dengan Kode di bawah ini.

 <b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:include name='nextprev'/>
</b:if>

    Trik terakhir ini adalah membuat atribut Alt dan Title untuk Semua gambar yang ada di Template, Widget dan Semua Artikel. Contoh penggunaannya lihat di bawah ini, atau masuk di [ Cara agar Gambar Terindex Search Engine ].

<a href="http://blogadexme.blogspot.com" title="Blogadexme | Tips Komputer | Download Lagu | Info terbaru"><img src="http://2.bp.blogspot.com/-T65Z5Pi_oNc/T8JqQkSbwBI/AAAAAAAABB0/dGTDDG7g_cY/s1600/b11.jpg" alt="Blogadexme | Tips Komputer | Download Lagu | Info terbaru"/></a>


    Dari Cara di atas sebenarnya masih ada lagi yang belum bisa saya berikan karena kode yang di cari tidak ketemu pada kebanyakan Template. Dan mungkin ini juga tidak menjamin kalau Blog kamu sudah Valid 100% di W3C karena masih ada Widget-widget yang belum di Validasi kan. Untuk Validasi Widget ditunggu aja artikel Selanjutnya. Sekian artikel Cara membuat Template

0 komentar:

Posting Komentar

Labels

Posting Populer