8 Apr 2012

Membuat Template Wordpress


     Saya itu sebenernya kepikiran mau buat artikel seperti ini, namun mau gimana lagi niat mau sharing tapi karna penyakit malas ngetik lagi melanda (ceileeeeh) ya copas aja deh :D
Asumsi awal, kita telah mempunyai 1 (satu) halaman template (.html) yang siap dikonversi menjadi theme wordpress. Nah, sebelum ke teknis bagaimana membuat theme tersebut sebaiknya kita bahas terlebih dahulu tentang struktur direktori dari theme wordpress itu sendiri.
WordPress memiliki struktur direktori theme yang cukup mudah dimengerti, wordpress menyimpan semua file-file theme kedalam satu direktori yang ditempatkan di bagian wp-content -> themes. Jadi jika kita akan membuat satu theme buat satu direktori (contoh : 2133), kemudian simpan di direktori themes.
struktur-theme-wp
Sedangkan di dalam direktori theme itu sendiri setidaknya memiliki file-file berikut ini :
struk-wp
  1. style.css
    Ini untuk menyimpan style untuk theme kita. Tetapi ada hal yang penting disini, nama file harus tetap style karena engine wordpress hanya membaca nama file tersebut, kemudian di dalam file ini harus disimpan juga informasi tentang theme (akan dibahas selanjutnya).
  2. screenshot.png
    Adalah file gambar yang akan dibaca oleh engine WP.
  3. index.php
    File yang pertama kali akan di-render, biasanya untuk halaman utama blog.
  4. functions.php
    File yang berisi fungsi-fungsi yang ada pada theme kita, seperti fungsi untuk pengaturan widget, panel dan sebagainya.
  5. header.php
    File ini menyimpan header theme kita. Yang saya maksud header disini adalah bagian yang sering digunakan kembali dibagian lain (index, single, page, dsb).
  6. sidebar.php
    File ini akan ditempatkan sebagai sidebar blog kita. Pengaturan agar terhubung dengan widget terletak di file functions.php, file ini pun adalah bagian yang sering digunakan kembali.
  7. footer.php
    File untuk footer blog.
  8. single.php
    Adalah file untuk halaman detail sebuah posting.
  9. page.php
    Adalah file untuk halaman detail sebuah page.
  10. comments.php
    File untuk menyimpan list komentar dan form komentar.
Untuk lebih lengkapnya (tentang struktur theme wp) bisa dibaca di wordpress codex, site architecturedan template hierarchy. Selanjutnya kita langsung lakukan langkah-langkah berikutnya :
Step 1
Buat folder theme yang akan kita buat, salin file html (dan kelengkapannya) ke folder tersebut. Kemudian buat 10 (sepuluh) file yang disebutkan diatas (file kosong pun tidak masalah).
Step 2
File css yang telah dibuat, sesuaikan dengan ketentuan WordPress -rename menjadi style.css. Kemudian di baris paling atas tambahkan komentar berupa informasi theme yang akan dibuat. Contoh :
1
2
3
4
5
6
7
8
/*
Theme Name: t-simple
Description: 2 Column, CSS, xHTML, JQuery.
Version: 0.1
Author: Asep Sufyan Tsauri
Author URI: http://www.tsauri28.myhaley.com/
*/
/* css-nya dilanjut disini */
Komentar ini akan dibaca oleh engine sebagai informasi utama theme.

0 komentar:

Posting Komentar