Hallo teman teman balik lagi ditutorial Dumet School membahas segala bentuk programming khususnya di website, oke lanjutan dari yang kemarin yah yakni tentang Cara Membuat Login Dengan Hak Akses Menggunakan Codeigniter. kita sudah memasuki tahapan ke 2 yakni tentang bagaimana membuat sebuah view untuk halaman login, oke kita fokus ke view login.php oh yah jika pada tutorial
kemarin kita sudah membuat sebuah database beserta tablenya skrang kita fokus ke tampilan untuk halaman login, untuk membuat sebuah halaman login kita akan membuatnya menjadi dinamis yah, oh untuk templatenya kita akan menggunakan bantuan dari framework bootstrap 4 yah, jadi akan lebih cepat dalam membuat sebuah tampilan form loginnya, oke coba teman teman ikuti langkah berikut, pertama-tama teman buatkan sebuah folder baru dengan nama component didalam folder view lalu didalam folder component terdapat 2 file yakni header.php dan footer.php untuk header.php bisa ditambahkan seperti berikut :
Header.php
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<!doctype html> <html lang="en"> <head> <!-- Required meta tags --> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <!-- Bootstrap CSS --> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous"> <title>Latihan Membuat Login dengan Hak Akses</title> </head> <body> |
Dan untuk halaman footer.php bisa ditambahkan seperti ini:
|
1 2 3 4 5 6 7 |
<!-- Optional JavaScript --> <!-- jQuery first, then Popper.js, then Bootstrap JS --> <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script> </body> </html> |
Oke jika sudah coba buatkan file bernama login.php didalam folder view dan diluar dari folder component. Lalu tambahakn script berikut :
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 |
<?php $this->load->view('component/header'); ?> <div class="container"> <div class="row mt-3"> <div class="col-md-6 offset-3"> <div class="card"> <?php if($this->session->flashdata('failed')){ ?> <h3 class="ml-2"><code><?= $this->session->flashdata('failed'); ?></code></h3> <?php } ?> <div class="card-header">Login</div> <div class="card-body"> <?= form_open('login/login_proses'); ?> <div class="form-group"> <label for="">Username</label> <input type="text" name="username" class="form-control" id="" placeholder="Masukkan Username"> </div> <div class="form-group"> <label for="">Password</label> <input type="password" name="password" class="form-control" id="" placeholder="Masukkan Password"> </div> <button type="submit" name="login" class="btn btn-primary">LOGIN</button> <?= form_close(); ?> </div> </div> </div> </div> </div> <?php $this->load->view('component/footer'); ?> |
Untuk sintaq sintaq php nya mohon dituliskan saja itu adalah hasil dari controller yang pada artikel selanjutnya kita akan buat, oke jika berhasil maka tampilannya akan seperti ini :
Oke cukup mudah bukan, sekian tutorial tentang Bagaimana Cara Membuat Login Dengan Hak Akses Menggunakan Codeigniter PART II. Sampai bertemu diartikel selanjutnya dan sampai jumpa.
#KeepLearn
#IsmetMA