Pada postingan kali ini, mari kita lanjutkan dengan pembahasan mengenai cara memecah template adminlte yang menjadi halaman utama template menjadi beberapa bagian, diantara nya header, sidebar, content dan footer.
Mengapa harus membagi template menjadi beberapa bagian? Hal tersebut agar menghemat source yang digunakan dengan kata lain, kita cukup sekali membuat source tersebut dan selanjutnya tinggal dipanggil saat aplikasi dijalankan dan agar saat melakukan pengeditan cukup mengedit source tertentu saja.
Bagi teman-teman yang baru saja membaca postingan ini, dianjurkan untuk membaca dari postingan sebelumnya dikarenakan antara satu postingan dengan postingan selanjutnya saling keterkaitan. Dan ini lanjutan dari postingan sebelumnya yang berjudul cara mengganti template default laravel menjadi template yang kita inginkan.
1. Buka VS Code anda dan panggil file project yang akan dijadikan beberapa bagian.
2. Setelah itu buka file welcome.blade.php yang berada di resource/views
3. Buat 2 (dua) buah folder baru dengan nama layout dan include, yang mana kedua folder tersebut berada dilokasi resource/views.
4. Kemudian didalam folder layout buat 1 (satu) file baru bernama master.blade.php dan didalam folder include buat 3 (tiga) buah file bernama header.blade.php, sidebar.blade.php dan footer.blade.php
5. Sebelum kita memecah template, buat 1 (satu) buah file baru dilokasi resource/views dengan nama main.blade.php
6. Setelah itu kita ke route dengan alamat routes/web.php dan ganti script dari welcome ke main
7. Sekarang buka halaman master.blade.php yang berada dilokasi resources/view/layout dan copy paste seluruh script yang ada di halaman welcome.blade.php ke file yang bernama master.blade.php
8. Sekarang pada halaman master.blade.php ini kita akan memecah script menjadi beberapa bagian, pertama sekali cut script yang ada keterangan <head> sampai dengan </head> dan pastekan ke file yang bernama header.blade.php yang berada dilokasi resources/views/include
9. Kemudian buka kembali file master.blade.php dan ketikkan script @include('include.header') script ini berfungsi untuk memanggil file header.blade.php yang telah kita pisahkan.
10. Kemudian buka kembali file master.blade.php dan cut script yang ada keterangan <aside class="main-sidebar sidebar-dark-primary elevation-4"> sampai dengan </aside> dan pastekan ke file yang bernama sidebar.blade.php yang berada dilokasi resources/views/include
11. Kemudian buka kembali file master.blade.php dan ketikkan script @include('include.sidebar') script ini berfungsi untuk memanggil file sidebar.blade.php yang telah kita pisahkan.
12. Kemudian buka kembali file blade.php dan cut script yang ada keterangan <footer class=”main-footer”> sampai dengan </footer> dan pastekan ke file yang bernama footer.blade.php yang berada dilokasi resources/views/include
13. Kemudian buka kembali file master.blade.php dan ketikkan script @include('layout.footer') script ini berfungsi untuk memanggil file footer.blade.php yang telah kita pisahkan.
14. Dan Langkah terakhir, buka kembali file master.blade.php dan cut script yang ada keterangan <div class=”content-wrapper”> sampai dengan </div> dan pastekan ke file yang bernama main.blade.php yang berada dilokasi resources/views
15. Sekarang buka kembali file master.blade.php dan ketikkan script @yield('content') script ini berfungsi untuk memanggil content yang akan kita gunakan.
16. Setelah itu sekarang kita buka file main.blade.php yang berada di lokasi resource/views dan tambahkan script ini @extends(layout.master) @section('content') dan @endsection.
17. Sampai disini kita telah berhasil memecahkan template adminlte menjadi beberapa bagian. Sekarang anda tinggal jalankan service dan coba buka browser dan panggil projek anda, jika telah berjalan dengan normal maka akan terlihat seperti gambar dibawah ini
Sekian tutorial mengenai bagaimana memecahkan template adminlte menjadi beberapa bagian dan selanjutnya kita akan membahas cara membuat menu login pada laravel versi 8.0
Semoga artikel sederhana ini dapat menambah referensi bagi anda yang membutuhkan dan tetap semangat.
email dan website anda tidak akan dipublikasi. Terimakasih
Untuk berlangganan artikel terbaru, silahkan masukkan email aktif anda. Kami akan mengirim secara otomatis. Terimakasih
