
Hi sobat , kali ini saya masih akan membahas mengenai laravel dan masih menggunakan laravel. Namun kali ini saya akan menggunakan AdminLTE yang akan di integrasikan kedalam laravel.
Admin LTE merupakan salah satu template web berbasis bootstrap yang cocok digunakan untuk dashboard admin. Desain yang dipakai berbentuk flat yang memang menjadi tren disaat ini.
Sebelumnya download terlebih dahulu AdminLTE yang bisa di download disini. Dan akan mendapatkan hasil download berupa zip seperti ini.
Kemudian extract hasil download tersebut dan pindahkan ke directori C://xampp//htdocs//kel1//public dan ganti namanya menjadi “assets” sehingga isi folder “public” menjadi seperti berikut ini atau simplenya pindahkan ke folder public project laravel sobat

Kemudian buka dahsboard.html dengan teks editor seperti sublime text, notepad dll. Disini saya menggunakan Sublime Text editor.
Kemudian salin semua code yang ada pada dashboard.html ke file baru yang diberi nama adminlte.blade.php dan pindahkan ke folder resources\views.

Ubah script yang mengandung “.css” dan “.js” yang berfungsi untuk mendefrinisikan bahwa file-file AdminLTE disimpan di folder “assets” seperti dibawah ini
Sebelum diubah :


Setelah diubah :


Kemudian buka Xampp control panel dan start apache. Selanjutnya buka file web.php dan tambahkan script seperti berikut :

Kemudian buka browser dan ketikkan localhost/kel1/public/adminlte . kel1 bisa diganti dengan nama folder project laravel sobat sekalian. Maka akan menghasilkan tampilan seperti berikut 

Langkah mengitegrasikan AdminLTE ke laravel sebenarnya telah selesai. Namun disini saya akan memisahkan setiap code pada adminlte.blade.php menjadi file terpisah setiap codenya, untuk memudahkan kita mengedit script tersebut, karena script code pada file adminlte.blade.php terdapat lebih dari 1000 line dan tentunya akan bingung ketika akan mengedit bagian tertentunya dan mencari letaknya.
- Pertama yang kita lakukan membuka file adminlte.blade.php.
- Kemudian buat folder baru di resources\views dengan nama template

- Kemudian buat file baru dengan nama head.blade.php , dan pindahkan script code yang terdapat pada tag <head> pada adminlte.blade.php ke file baru tersebut dengan cara blok semua code yang terdapat pada tag <head> seperti ini

- Kemudian tambahkan include(template.head) didalam tag <head> di file adminlte.blade.php seperti ini

- Selanjutnya lakukan hal serupa pada serupa pada tag <header>, tag <footer> dan setiap tag lainnya yang terdapat pada adminlte.blade.php, sehingga akan menghasilkan file file baru seperti ini

- Langkah terakhir, buka browser, kemudian ketikkan lagi localhost/kel1/public/adminlte. Jika tampilannya sama dengan tampilan pertama tadi, maka proses integrasi AdminLTE dengan Laravel tepatnya dengan cara pemecahan beberapa bagian sudah berhasil. Namun jika yang muncul berupa pesan error, maka periksa kembali barangkali ada penulisan script yang salah atau pemecahan bagian-bagiannya ada yang tidak tepat.
Sekian tutorial integrasi adminlte pada laravel yang dapat saya jelaskan, semoga bermanfaat dan selamat mencoba :).

0 comments:
Post a Comment