Cataloged Autobiography
BERKENAAN SAYA
Hello. Saya adalah self-taught web designer yang banyak menghabiskan masa meneroka penggunaan CSS dan HTML. Blogging hanyalah hobi. Teruskan membaca..
The Readable Journal
MENEROKA ARTIKEL
Teroka artikel berhubung dengan tutorial, contoh dan penggunaan CSS dan HTML dalam web design di ruang ini. Web design menyeronokan. Ke tutorial...Klik sini
Astrolab Tool
KATEGORI ARTIKEL
Suatu sistem yang berfungsi untuk membantu menjelajahi topik-topik terkait dan menyenaraikan pelbagai sub-bahagian artikel...Klik sini



3. DEFAULT HTML TEMPLATE
December 28, 2009
Posted by: Fauzie


Untuk membina sesuatu template semua kod akan ditulis dalam text editor. Terdapat banyak text editor untuk tujuan ini. Yang paling mudah ialah Notepad.

Untuk latihan ini saya tidak akan menggunakan Notepad. Ini adalah kerana kita akan menggunakan kod jQuery dan saya dapati terdapat sedikit masaalah browsing apabila kod-kod HTML dan CSS ditulis di dalam Notepad.

Cara yang paling sesuai ialah dengan menulis terus di dalam bahagian "Edit Html" blogger (blogspot). Sila sign up blogger atau create satu blog baru khas untuk latihan ini. Anda bolehlah namakan blog ini sebagai blog latihan atau test blog atau sebagainya. Gunakan template yang disediakan dari jenis minima. Kita sebenarnya tidak akan menggunakan template ini, ia hanya untuk tujuan blog site creation sahaja.

Apabila anda telah bersedia dengan satu test blog, sila copy dan paste kod-kod seperti di bawah ini ke dalam notepad, save dengan memberi satu nama yang mana diikuti dengan extension .html (dot html). Sebagai contoh testblog.html

File ini akan diupload kemudian ke dalam blogger anda bagi menggantikan minima template yang ada di dalam blog test anda itu.


<?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 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>
<b:include data='blog' name='all-head-content'/>
<title><data:blog.pageTitle/></title>
<b:skin><![CDATA[/*
-----------------------------------------------
Blogger Template Style
Name: Fauzi Mustafa
Designer:
URL: http://tip-buat-blog.blogspot.com
Date: 28 Dec 2009

----------------------------------------------- */


]]></b:skin>
</head>

<body>
</body>
</html>


Sekarang buka dashboard blog test anda. Klik Layout->klik Edit HTML->klik Browse dan klik nama fail yang anda simpan dalam Notepad dan klik upload.

Apabila fail telah di upload, anda akan dapati ayat berikut: "Widgets are about to be deleted", sila klik "Confirm & Save" untuk save template baru ini.

Klik View dan jika bowser hanya menunjukkan ruang kosong, ini bermakna anda telah berjaya upload fail yang anda copy di atas.

Ok, mari kita teruskan latihan ini kerana selepas ini kita akan berhadapan dengan cabaran sebenar!!