Mengganti Layout YII2

Selamat pagi... Layout. Jika kita berbicara tentang layout, maka hal pertama yang terpikirkan adalah sebuah tampilan yang enak dilihat. Atau mungkin yang tiba-tiba muncul dalam benak kita karena mendengar kata layout adalah "Bagaimana kita mengganti layout halaman ini?". Atau mungkin yang lain. Untuk beberapa hari ini kita akan membahas tentang layout YII2.

Tapi... Kita bagi menjadi beberapa bagian ya. Yaitu:

• - Mengenal fungsi yang bertanggung jawab pada layout YII2, dan bagaimana mengganti layout pada halaman tertentu.
• - Mengenal kegunaan folder assets pada YII2 serta bagaimana menambahkan file tambahan (css,js atau yang lain) pada layout kita.
• - Implementasi dari kedua hal di atas. Yaitu membuat layout sendiri.

Hari ini kita akan mengikuti bahasan yang pertama, yaitu mengenal fungsi yang bertanggung jawab pada layout YII2, dan bagaimana mengganti layout pada halaman tertentu.

Apa fungsi yang bertanggung jawab pada layout YII2? Sebenarnya, kita mungkin tidak menemukan sebuah fungsi yang spesifik mengubah layout. Tapi, ada beberapa hal yang berhubungan dengan hal tersebut.

Yang pertama adalah file main.php yang ada pada direktori /views/layout/. Jika kita perhatikan, script yang ada pada file main.php inilah yang dijadikan layout pada aplikasi YII2 kita. Coba deh, kita sedikit obrak-abrik file tersebut, pasti layout kita juga akan terkena dampaknya. Dari sini, kita bisa mengubah layout aplikasi YII2 kita hanya dengan mengubah isi dari file ini. Sayangnya, semua halaman akan terkena dampaknya, alias semua halaman layoutnya akan berubah mengikuti file main.php.

Lalu timbul sebuah pertanyaan, bagaimana kita  mengubah layout sebuah halaman tanpa mempengaruhi layout halaman yang lain? Misalnya, kita ingin layout untuk halaman login berbeda dengan halaman yang lain. Tidak mungkin kita hanya mengubah file main.php, karena perubahan tersebut akan berdampak pada layout halaman yang lain. Kita juga tidak mungkin hanya mengubah file login.php yang ada pada direktori /views/site/, karena file tersebut hanya berpengaruh pada isi-nya saja, bukan layoutnya. Bagaimana dong?

Untuk permasalahan seperti itu, kita bisa membuat sebuah layout khusus yang hanya digunakan halaman login. Caranya?

1. Buat sebuah file php pada direktori /views/layout/ misalnya layoutLogin.php

2. Kemudian kita copy script dari file main.php ke dalam file layoutLogin.php

3. Lalu buka file SiteController.php yang ada pada direktori controllers, dan...

4. Karena yang kita ubah layoutnya adalah halaman login, maka kita alihkan pandangan kita menuju fungsi yang mempunyai peran terhadap halaman login, yaitu public function actionLogin.

5. Setelah itu, kita sisipkan script berikut:

$this->layout = 'layoutLogin';

Kemudian save. Script tambahan tersebut berfungsi untuk mengatur layout halaman login sesuai dengan file layoutLogin.php yang ada pada folder layout. Dengan kata lain, dengan mengubah file layoutLogin.php, maka layout pada halaman login akan berubah.

6. Sekarang, silahkan edit file layoutLogin.php untuk menghasilkan layout pada halaman login sesuai keinginan kita.

Dengan cara di atas, seharusnya kita sudah mengerti layout YII2 dan mampu untuk mengubah layout. Karena YII2 menggunakan css framework Bootstrap, maka akan lebih baik jika kita menguasai bootstrap.

Namun, timbul sebuah permasalahan. Yaitu, bagaimana kita menambahkan file css, js dan sebagainya pada layout kita? Kita akan membahas hal tersebut besok. Selamat menikmati...