Posted by admin on 02 25th, 2009

Pengenalan Template Bag. 1

belajar_wordpress File template kayak blok bangunan yang membentuk situsmu. File itu bekerja secara bersama-sama untuk membuat halaman web. Beberapa file (kayak file header.php dan footer.php) selalu digunakan di semua halaman web. Sedangkan yang lain digunakan kalo diperlukan aja.

Halaman web yang sederhana terdiri dari dua file :

  • XHTML yang menangani struktur dan isi halaman.
  • CSS yang menangani style (gaya) penyajian sebuah halaman web.

Dalam wordpress, struktur XHTML dan CSS tetap digunakan, tapi isi halaman di hasilkan “dari belakang layar” lewat berbagai macam file template. File template dan CSS di simpan secara bersama-sama dan disebut sebagai Tema Wordpress. Kalo pengen belajar lebih banyak tentang membuat Tema, baca aja Pengembangan Tema

STRUKTUR HALAMAN WORDPRESS

Struktur halaman wordpress yang sederhana terdiri dari 3 bagian dasar yaitu header, content, dan footer. Setiap bagian itu dihasilkan oleh satu file template.

  • Bagian header berisi semua informasi yang di perlukan di bagian atas – di dalam tag <head> – dari halaman web XHTML, seperti <doctype>, <meta>, dan link ke CSS, termasuk tag <body> dan bagian visual dari header blog (seperti Judul blog, menu navigasi, logo, dll)
  • Bagian content berisi postingan dan halaman blog.
  • Bagian footer berisi informasi untuk bagian bawah blog seperti link ke halaman lain, kategori, copyright, kontak, dan informasi lainnya.

FILE TEMPLATE DASAR

Untuk menghasilkan sebuah struktur dalam sebuah Tema Wordpress, dimulai dari file index.php dalam direktori Tema. File ini mempunyai dua fungsi utama :

  • include ato memasukkan file template yang lain.
  • include Wordpress Loop untuk memperoleh informasi dari database (misalnya post, halaman, kategori, dll)

Untuk membuat struktur yang sederhana, kita hanya memerlukan dua file template yang lain. File header dan footer. File itu harus diberi nama header.php dan footer.php. Kode template kayak gini :

<?php get_header(); ?>

<?php get_footer(); ?>

Untuk menampilkan post dan halaman blog (dan untuk mengutak-atik tampilan), file index.php harus menjalankan Wordpress Loop antara header dan footer.

STRUKTUR HALAMAN YANG LEBIH KOMPLEKS

Banyak tema wordpress mencakup satu atau beberapa sidebar yang berisi navigasi dan informasi lainnya tentang sebuah situs. Sidebar ini dihasilkan oleh sebuah file template yang bernama sidebar.php. File itu dapat dipanggil melalui file index.php dengan kode kayak gini :

<?php get_sidebar(); ?>

WHERE’S THE BEEF?

Perhatikan, kita tidak menggunakan kode “get” untuk isi halaman web. Karena isi halaman dihasikan lewat Wordpress Loop, dalam file index.php

Style Tema juga ikut menentukan penampilan dan penempatan header, footer, sidebar, dan isi pada browser. Untuk informasi tentang Style Tema Wordpress dan halaman web, silahkan baca Blog Design and Layout….

FILE TEMPLATE DALAM FILE TEMPLATE

Kita udah ngerti tentang bagaimana Wordpress memasukkan file template standard (header, footer, dan sidebar) kedalam file template index.php. Kita juga bisa memasukkan file template yang lain ke dalam file template apa aja.

Misalnya, sidebar.php mungkin berisi file template untuk membuat form pencarian – searchform.php. Karena file ini bukan salah satu file standard template, kode untuk memasukkannya sedikit berbeda.

<?php include (TEMPLATEPATH . '/searchform.php'); ?>

Sebagai pengganti kode “get” untuk memasukkan file, kita akan menggunakan perintah PHP “include”, yang harus mengetahui dimana letak file yang akan digunakan (TEMPLATEPATH adalah variabel khusus dalam Wordpress untuk menunjukkan direktori file template.

Kebanyakan Tema Wordpress memasukkan berbagai macam file template kedalam file template yang lain untuk menghasilkan halaman web. File template berikut ini adalah yang biasanya di masukkan kedalam file template utama (index.php).

  • header.php
    • theloop.php (Isi web)
    • wp-comments.php
  • sidebar.php
    • searchform.php
  • footer.php

Akan tetapi, struktur di atas bisa berubah. Misalnya, kita bisa meletakkan form pencarian di header. Ato mungkin juga desain template tidak memerlukan footer, kita bisa kok tidak menggunakannya.

Nah, cukup sampai disini dulu. Kita akan lanjutkan ke bagian ke 2.

Post a Comment


2 Comments »

  1. [...] Stepping Into Templates (Pengenalan Template) [...]

    comment-bottom
  2. [...] Artikel ini merupakan lanjutan dari bagian 1. [...]

    comment-bottom

RSS feed for comments on this post. TrackBack URL

Leave a comment