Implementasi Penggunaan Blade Template Laravel
Apa itu AdminLTE?
Admin LTE merupakan sebuah template yang dibangun dengan framework css Bootstrap. Author template ini Abdullah Almsaeed membagikan Template Admin LTE ini secara gratis dengan lisensi MIT. MIT(Massachusetts Institute of Technology) artinya kita berhak untuk menggunakan, mengubah, menggandakan, menggabungkan, menerbitkan dan menjual duplikasi template ini. Lisensi ini hanya mewajibkan pengguna untuk menyertakan lisensi dan copyright si pembuat pada kode yang didistribusikan ulang dan tidak ada larangan untuk menggunakan trademark dari si pembuat asli.
Admin LTE merupakan sebuah template yang dibangun dengan framework css Bootstrap. Author template ini Abdullah Almsaeed membagikan Template Admin LTE ini secara gratis dengan lisensi MIT. MIT(Massachusetts Institute of Technology) artinya kita berhak untuk menggunakan, mengubah, menggandakan, menggabungkan, menerbitkan dan menjual duplikasi template ini. Lisensi ini hanya mewajibkan pengguna untuk menyertakan lisensi dan copyright si pembuat pada kode yang didistribusikan ulang dan tidak ada larangan untuk menggunakan trademark dari si pembuat asli.
1. Untuk mencoba nya kita harus mendownload adminltenya terlebih dahulu, bisa di download disini
https://github.com/almasaeed2010/AdminLTE
2. Unzip file nya lalu pindahkan file nya ke C:\xampp\htdocs\per3\public (folder installasi Laravel) dan ubah namanya menjadi Asset
https://github.com/almasaeed2010/AdminLTE
2. Unzip file nya lalu pindahkan file nya ke C:\xampp\htdocs\per3\public (folder installasi Laravel) dan ubah namanya menjadi Asset
3. Setelah itu kita buka file web.php yang berada di folder route dan masukan sintaks dibawah ini
4. buka file index.html di folder assets lalu copy semua sintaksnya, setelah itu buat file bernama adminlte.blade.php dan pastekan sintaksnya dan save ke C:\xampp\htdocs\per3\resources\views, jika berhasil bisa di check di browser dan masukan localhost/kel5/public/adminlte maka hasilnya akan seperti berikut
5. selanjutnya kita pisahkan beberapa sintaks yang ada di dalam adminlte.blade.php dan buat folder bernama "template" di C:\xampp\htdocs\per3\resources\views
6. lalu buat forlder bernama template di C:\xampp\htdocs\per3\resources\views
7. buka lagi file adminlte.blade.php dan perhatikan bagian atas sintaksnya disini kita akan mengubah href css nya dengan cara menambahkan "{{url(‘Asset/" di bagian awal dan " ’)}} " di bagian belakang seperti di bawah ini
6. lalu buat forlder bernama template di C:\xampp\htdocs\per3\resources\views
7. buka lagi file adminlte.blade.php dan perhatikan bagian atas sintaksnya disini kita akan mengubah href css nya dengan cara menambahkan "{{url(‘Asset/" di bagian awal dan " ’)}} " di bagian belakang seperti di bawah ini
8. di dalam <head> </head> cut sintaks dari <meta charset="utf-8"> sampai 400italic,600italic"> dan buat file bernapa head.blade.php (simpan di folder template yang di buat tadi)
9. lalu lakukan hal yang sama pada bagian headernya cut semua bagian dari <header class="main-header"> Sampai</header> buat lagi file bernama header.blade.php dan pastekan disitu
10. lalu cari <section class="sidebar"> sampai </section> dan cut semuanya lalu buat file bernama content.blade.php dan paste kan disitu
11. lalu panggil semua file yang tadi di cut di file adminlte.blade.php seperti di bawah ini
Sebernarnya hal ini hanya untuk menyederhanakan saja agar sintaks nya tidak teralalu panjang di satu file
Kita check lagi di browser maka sekarangnya akan kosong meskipun kosong sebenarnya template sudah jadi, kita tinggal kita perbaiki. Contohnya perbaiki isi nya, link-link nya dll. Yield ini nantinya akan diganti dengan section, jadi saat kita melakukan extends template maka yeald ini akan diisi dengan section content.
Karna isinya kosong kita akan isi sendiri dengan cara seperti berikut
1. buat routenya di web.php
2. setelah itu buat folder dengan nama data-barang di C:\xampp\htdocs\per3\resources\views dan buat file berana index.blade.php dan masukan sintaks seperti di bawah ini
Extends file adminlte nya lalu buat section content. Misalnya kita membuat heading dengan tag <h1></h1> dengan isi yaitu hanya kata ‘Ini Contoh Halaman Menggunakan Template.
3. setelah itu buka cmd lalu masuk ke folder Laravel dan masukan command di bwah ini
Bisa di check di C:\xampp\htdocs\per3\app\Http\Controllers akan ada file bernama DataBarangController.php kita buka dan isinya otomatis seperti dibawah ini
Dan kita tinggal check di browser dan tampilan kosong tadi akan terisi
"Ini Contoh Halaman Mengguna Template"
Jadi view ini akan sama tampilannya seperti pada adminlte awal, tapi isinya atau content-wrippernya sudah kita edit dan diganti dengan isi yang ada dalam section dalam file index.blade.php.
Saat kita membuka scriptnya yaitu dengan menekan ctrl+u kita akan menemuka isi contennya yaitu seperti gambar dibawah yang merupakan isi dari index.blade.php tadi.
Komentar
Posting Komentar