Nanaz's Blog

Pada tutorial 2 kita sudah mempelajari cara pembuatan themes dari silverstripe. Selanjutnya kita akan mempelajari cara pembuatan tipe halaman yang baru. Struktur themes yang kita gunakan pada tutorial ini menggunakan struktur themes1 yang sudah kita buat pada tutorial 2.

Sebelumnya perlu kita ketahui pada saat pertama kali kita menginstall silverstripe, sudah disediakan beberapa tipe halaman standar yang bisa kita pakai. Tipe halaman tersebut adalah :

1. Page : halaman ini adalah tipe halaman standar untuk setiap halaman yang ditampilkan.
2. ErrorPage : halaman ini adalah halaman untuk menampilkan kondisi error secara kostumisasi. Misalnya kita dapat menggunakan tipe ini untuk membuat halaman 404 (page not found) dengan tampilan sesuai dengan yang kita inginkan
3. RedirectorPage : halaman ini adalah halaman untuk meredirect (berpindah ke halaman lain), baik itu yang ada di web kita atau yang ada di luar web kita
4. VirtualPage : sama halnya dengan redirector page namun hanya dikhususkan untuk halaman yang ada di web kita saja dengan penggunaan link yang berbeda dari halaman tujuan

Selain dari empat tipe halaman tersebut kita juga bisa membuat tipe halaman sendiri sesuai dengan kebutuhan kita. Misalkan kita ingin membuat sebuah tipe halaman yang isinya terdiri dari judul, tanggal, foto dan isi yang kita beri nama tipe ArticlePage. Caranya cukup mudah dan tidak memakan banyak waktu.

Pembuatan sebuah tipe halaman pada silverstripe tetap mengacu pada konsep MVC development framework. Dimana pada konsep ini sebuah tipe halaman selalu akan memiliki komponen Model, View dan Controller. Untuk itu halaman ArticlePage yang akan kita buat nantinya akan memiliki ketiga komponen tersebut.

Model dan Controller

Model dan Controller pada silverstripe untuk sebuah tipe halaman tersimpan pada sebuah file yang terletak pada direktori mysite/code dan memiliki ekstensi .php. Jika kita ingin membuat tipe halaman ArticlePage maka kita harus membuat sebuah file php bernama ArticlePage.php yang kurang lebih isinya sebagai berikut :

mysite/code/ArticlePage.php

 <?php

class ArticlePage extends Page { // Model
    static $db = array(
       'Tanggal' => 'Date',
    );
    public static $has_one = array(
        'Foto' => 'Image',
    );    
    function getCMSFields() {
       $fields = parent::getCMSFields();
    
       $fields->addFieldToTab('Root.Content.Main', new CalendarDateField('Tanggal'), 'Content');
       $fields->addFieldToTab("Root.Content.Main", new ImageField('Foto'));
            
       return $fields;
    }    
}
/* controller */
class ArticlePage_Controller extends Page_Controller {
}

?>

Susunan model dan controller pada silverstripe menggunakan konsep pemrograman Object Oriented dimana setiap halaman akan memiliki hirarki seperti gambar dibawah ini:

Sehingga pada setiap pembuatan tipe halaman baru harus menurunkan tipe halaman Page. Pada tipe halaman page sendiri sebenarnya sudah menyediakan field data berupa judul dan isi sehingga  secara otomatis ini juga akan terdapat pada setiap tipe halaman yang diturunkan dari tipe halaman page. Kita hanya perlu membuat dua field tambahan yaitu tanggal dan foto. Maka pada file controller ArticlePage kita perlu menambahkan variabel :
   
    static $db = array(
       'Tanggal' => 'Date'
    );
    public static $has_one = array(
        'Foto' => 'Image'
    );   

Static $db merupakan sebuah variabel basis data yang akan di generate oleh silverstripe yang isinya berupa array dari field. Disini pada static $db kita menambahkan sebuah field Tanggal yang bertipe Date.  Jika ingin menambahkan field lainnya anda bisa menambahkan sendiri nama field pada variabel array $db dengan jenis tipe datanya. Daftar tipe data lainnya dapat anda lihat pada alamat http://doc.silverstripe.com/doku.php?id=data-types.

Mungkin anda bertanya-tanya kenapa pada variabel $db tidak langsung mencantumkan Foto yang bertipe Image? Sebenarnya pada silverstripe setiap image/file disimpan menggunakan sebuah tabel tersendiri terpisah dari tabel halaman. Karena hal tersebut apabila kita ingin menggunakan image/file pada halaman kita, kita hanya perlu merelasikan halaman kita tersebut ke tabel image/file. Disini kita menggunakan variabel $has_one yang artinya setiap ArticlePage memiliki satu Foto dengan tipe file Image.

Setelah mendeklarasikan field kita harus menambahkan field tersebut kedalam form CMS. Method getCMSFields() adalah method yang digunakan untuk menampilkan field pada CMS. Untuk itu kita perlu meng-override method ini untuk menampilkan form sesuai dengan field yang kita miliki.

View
Selanjutnya kita tinggal membuat view dari tipe halaman ArticlePage yang akan kita buat. Caranya dengan membuat file ArticlePage.ss yang disimpan pada direktori themes/themes1/templates/. Isinya kurang lebih seperti berikut ini :

themes/themes1/templates/ArticlePage.ss
<html>
    <head>
        <title>Themes Silverstripe 1</title>
    </head>
    <body>
    <ul>
        <% control Menu(1) %>
        <li><a href="$Link">$MenuTitle</a></li>
        <% end_control %>
    </ul>
    <div>
        <h1>$Title</h1>
        <div>Tanggal : $Tanggal.nice</div>
        <div>$Foto</div>
        $Content
        $Form
    </div>
    </body>
</html>

Jika Model, View dan Controller selesai dibuat, akses halaman http://localhost/silverstripe/db/build/?flush=1 (jika silverstripe diinstall pada komputer local di direktori silverstripe) pada browser. Nanti pada halaman admin akan muncul ArticlePage pada pilihan saat pembuatan halaman dengan field-field yang sudah kita tentukan.

Sangat mudah bukan.

-Nz-