Anda sudah lama menggunakan wordpress, tapi tidak puas dengan tampilan theme gratis yang banyak beredar. Anda penasaran ingin membuat tema wordpress sendiri? Ingin tahu cara yang cepat? Silakan ikuti ulasan singkat berikut ini.
Langkah pertama: Siapkan bahannya
1. Program Editing web seperti Dreamweaver, GoLive, Frontpage. Saya sendiri lebih suka Dreamweaver.
2. Program Pengolah Grafis seperti Photoshop, Illustrator, Photopaint, Gimp. Saya suka memakai Photoshop.
3. Program webserver yang diinstall di komputer lokal Anda. Program ini penting dan mutlak dimiliki untuk mencoba hasil tampilan desain Anda. Banyak sekali pilihan program semacam ini, saya sendiri memakai XAMPP untuk Windows serta Apache2 di Linux. Jika Anda perlu XAMPP, gunakanlah
1. Program Editing web seperti Dreamweaver, GoLive, Frontpage. Saya sendiri lebih suka Dreamweaver.
2. Program Pengolah Grafis seperti Photoshop, Illustrator, Photopaint, Gimp. Saya suka memakai Photoshop.
3. Program webserver yang diinstall di komputer lokal Anda. Program ini penting dan mutlak dimiliki untuk mencoba hasil tampilan desain Anda. Banyak sekali pilihan program semacam ini, saya sendiri memakai XAMPP untuk Windows serta Apache2 di Linux. Jika Anda perlu XAMPP, gunakanlah
Langkah kedua:
Gambar Layout tema WordPress Anda, satu kolom, 2, 3 atau 4 kolom
Pilih warna tema Anda
Gambar Layout tema WordPress Anda, satu kolom, 2, 3 atau 4 kolom
Pilih warna tema Anda
Sudah? jika Anda sudah siap, mari lanjut ke langkah berikutnya. Berikut ini ilustrasi tampilan halaman WordPress dengan 3 kolom
Buka Program Pengolah Web Anda, buat sebuah file HTML yang berisi kurang lebih seperti ini:
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″ />
<title>Untitled Document</title>
</head><body>
</body></html>
Sekarang, buat Layout Anda..
<div id=”wrapper”><div id=”header”>My Header</div><div id=”navigation”>My Menu</div><div id=”main”><div id=”content”>
<div class=”entry”>My Entry</div>
</div><div id=”sidebar”>
<div id=”leftsidebar”>My Left Sidebar</div>
<div id=”rightsidebar”>My Right Sidebar</div>
</div></div><div id=”footer”>My Footer</div></div>
Akhir dari file HTML
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″ />
<title>My First WordPress Theme</title>
</head><body>
<!– begin frame–>
<div id=”wrapper”><!– begin header–>
<div id=”header”>
My Header
</div>
<!– end header–><!– begin navigation–>
<div id=”navigation”>
My Menu
</div>
<!– end navigation–><!– begin content frame–>
<div id=”main”><!– begin entry frame –>
<div id=”content”><!– begin entry box–>
<div class=”entry”>
My Entry
</div>
<!– end entry box–></div>
<!– end entry frame –><!– begin sidebar frame –>
<div id=”sidebar”><!– begin left sidebar box –>
<div id=”leftsidebar”>
My Left Sidebar
</div>
<!– end left sidebar box –><!– begin right sidebar box –>
<div id=”rightsidebar”>
My Right Sidebar
</div>
<!– end right sidebar box –></div>
<!– end sidebar frame –><!– end content frame–>
</div><!– begin footer–>
<div id=”footer”>
My Footer
</div>
<!– end footer–></div>
<!– end frame–>
</body>
</html>
Sekarang tampilan halaman WordPress Anda sudah selesai. Anda bisa kembangkan sesuai dengan keinginan dan preferensi Anda. Bagi yang suka memakai Dreamweaver, Sekarang sudah ada WordPress Template Kit untuk membuat theme WordPress. Dengan cara ini proses kreatif Anda akan semakin mudah dilakukan.
0 komentar:
Posting Komentar