Anda di halaman 1dari 60

BAB IV

HASIL DAN PEMBAHASAN

4.1 Kebutuhan Non Fungsional Sistem

Kebutuhan non fungsional sistem yaitu diantaranya : hardware,

software, dan sumber daya manusia yang memadahi.

4.1.1 Kebutuhan Hardware

1) 1 Unit Komputer :

Processor : AMD A8-7410 APU

Memory : 4 GiB

Hardisk : 500 GB

CD Room : 52 X

Monitor : 14 Inc

2) 1 Unit Printer

Type : EPSON L360

4.1.2 Kebutuhan Software

1) Bahasa Pemrograman

Bahasa pemrograman yaitu bahasa yang digunakan atau

berfungsi sebagai alat pengembangan program aplikasi. Bahasa

menggunakan bahas pemograman PHP.

2) Software Sistem

Software sistem adalah program yang dirancang sebagai

perantara hardware dengan program aplikasi. Software sistem yang

50
51

digunakan untuk mendukung sistem informasi ini adalah Linux Mint

18.3 Cinnamon 64-bit.

3) Kebutuhan Sumber Daya Manusia

Untuk mendukung semua proses sistem yang berjalan, maka

kebutuhan sumber daya manusia dalam pengembangan sistem

informasi web profil sekolah adalah sebagai berikut :

a. Sistem Analis

Analis adalah seseorang yang mempunyai kemampuan

dalam menganalisis dan merancang suatu sistem komputerisasi

dan penyusunan spesifikasi sistem komputer dan program

aplikasi untuk selanjutnya digunakan program.

b. Programmer

Programmer adalah seseorang yang mempunyai

kemampuan dalam menyusun dan mengembangkan suatu

program aplikasi dalam salah satu bahasa pemrograman.

Progammer akan membuat suatu program aplikasi yang telah

dirancang oleh sistem analis.

c. Operator

Operator adalah seseorang yang mempunyai

kemampuan dalam mengoperasikan komputer ataupun

memasukkan data dengan baik dalam komputer. Operator dapat

diambil dari bagian yang terlibat dalam pengoperasian sistem

tersebut.
52

d. Teknisi Komputer

Teknisi komputer adalah seseorang yang mempunyai

pengetahuan dalam hal perawatan sistem dan perbaikan

komputer maupun sistem jaringan. Suatu instalasi yang

menggunakan sistem komputer sangat memerlukan adanya

teknisi komputer, karena jika terjadi kerusakan pada jaringan

komputer maka masalah dapat segera diatasi

4.2 Desain Form Program

Desain menu merupakan suatu tampilan program yang menampilkan

menu utama dari suatu sistem informasi. Sistem menu merupakan komunikasi

awal antara pengguna atau user dengan komputer. Desain menu terdiri dari

halaman admin dan pengguna.

4.2.1 Form Admin login

Merupakan form yang berfungsi sebagai pengaman sistem untuk

masuk ke halaman administrator

Tampilan form admin tersebut adalah :


53

Gambar 4.21 Form Login Admin

Source Code :

<form action="<?php echo base_url().'administrator/auth'?>"


method="post">
<div class="form-group has-feedback">
<input type="text" name="username" class="form-
control" placeholder="Username" required>
<span class="glyphicon glyphicon-user form-control-
feedback"></span>
</div>
<div class="form-group has-feedback">
<input type="password" name="password" class="form-
control" placeholder="Password" required>
<span class="glyphicon glyphicon-lock form-control-
feedback"></span>
</div>
<div class="row">
<div class="col-xs-8">
<div class="checkbox icheck">
<label>
<input type="checkbox"> Ingatkan Saya
</label>
</div>
</div>
<!-- /.col -->
<div class="col-xs-4">
<button type="submit" class="btn btn-primary btn-
block btn-flat">Masuk</button>
</div>
<!-- /.col -->
54

</div>
</form>

4.2.2 Form Admin Dashboard

Merupakan sebuah halaman yang pertama muncul dari Sistem

Informasi Web Profil Sekolah.

Tampilan halaman sebagai berikut:

Gambar 4.22 Form Admin Dashboard

Source Code :

<div class="row">
<div class="col-md-3 col-sm-6 col-xs-12">
<div class="info-box">
<span class="info-box-icon bg-aqua"><i class="fa
fa-chrome"></i></span>
<?php
$query=$this->db->query("SELECT * FROM
tbl_pengunjung WHERE pengunjung_perangkat='Chrome'");
$jml=$query->num_rows();
?>
<div class="info-box-content">
<span class="info-box-text">Chrome</span>
<span class="info-box-number"><?php echo
$jml;?></span>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
</div>
<!-- /.col -->
<div class="col-md-3 col-sm-6 col-xs-12">
55

<div class="info-box">
<span class="info-box-icon bg-red"><i class="fa
fa-firefox"></i></span>
<?php
$query=$this->db->query("SELECT * FROM
tbl_pengunjung WHERE pengunjung_perangkat='Firefox' OR
pengunjung_perangkat='Mozilla'");
$jml=$query->num_rows();
?>
<div class="info-box-content">
<span class="info-box-text">Mozilla
Firefox</span>
<span class="info-box-number"><?php echo
$jml;?></span>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
</div>
<!-- /.col -->
<!-- fix for small devices only -->
<div class="clearfix visible-sm-block"></div>
<div class="col-md-3 col-sm-6 col-xs-12">
<div class="info-box">
<span class="info-box-icon bg-green"><i class="fa
fa-bug"></i></span>
<?php
$query=$this->db->query("SELECT * FROM
tbl_pengunjung WHERE pengunjung_perangkat='Googlebot'");
$jml=$query->num_rows();
?>
<div class="info-box-content">
<span class="info-box-text">Googlebot</span>
<span class="info-box-number"><?php echo
$jml;?></span>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
</div>
<!-- /.col -->
<div class="col-md-3 col-sm-6 col-xs-12">
<div class="info-box">
<span class="info-box-icon bg-yellow"><i
class="fa fa-opera"></i></span>
<?php
$query=$this->db->query("SELECT * FROM
tbl_pengunjung WHERE pengunjung_perangkat='Opera'");
$jml=$query->num_rows();
?>
<div class="info-box-content">
<span class="info-box-text">Opera</span>
<span class="info-box-number"><?php echo
$jml;?></span>
</div>
<!-- /.info-box-content -->
56

</div>
<!-- /.info-box -->

4.2.3 Form Admin Berita

Merupakan form untuk memposting, menghapus dan

menambah berita-berita yang ada di sekolah.

Tampilan datanya sebagai berikut:

Gambar 4.23 Form Admin Berita

Source Code :

<section class="content">
<div class="row">
<div class="col-xs-12">
<div class="box">
<div class="box">
<div class="box-header">
<a class="btn btn-success btn-flat" href="<?php
echo base_url().'admin/tulisan/add_tulisan'?>"><span
class="fa fa-plus"></span> Post Tulisan</a>
</div>
<!-- /.box-header -->
<div class="box-body">
<table id="example1" class="table table-
striped" style="font-size:13px;">
<thead>
<tr>
<th>Gambar</th>
<th>Judul</th>
<th>Tanggal</th>
<th>Author</th>
<th>Baca</th>
<th>Kategori</th>
<th style="text-align:right;">Aksi</th>
57

</tr>
</thead>
<tbody>
<?php
$no=0;
foreach ($data-
>result_array() as $i) :
$no++;

$tulisan_id=$i['tulisan_id'];

$tulisan_judul=$i['tulisan_judul'];

$tulisan_isi=$i['tulisan_isi'];

$tulisan_tanggal=$i['tanggal'];

$tulisan_author=$i['tulisan_author'];

$tulisan_gambar=$i['tulisan_gambar'];

$tulisan_views=$i['tulisan_views'];

$kategori_id=$i['tulisan_kategori_id'];

$kategori_nama=$i['tulisan_kategori_nama'];
?>
<tr>
<td><img src="<?php echo
base_url().'assets/images/'.$tulisan_gambar;?>"
style="width:90px;"></td>
<td><?php echo $tulisan_judul;?></td>
<td><?php echo
$tulisan_tanggal;?></td>
<td><?php echo
$tulisan_author;?></td>
<td><?php echo
$tulisan_views;?></td>
<td><?php echo
$kategori_nama;?></td>
<td style="text-align:right;">
<a class="btn" href="<?php echo
base_url().'admin/tulisan/get_edit/'.$tulisan_id;?>"><span
class="fa fa-pencil"></span></a>
<a class="btn" data-toggle="modal"
data-target="#ModalHapus<?php echo $tulisan_id;?>"><span
class="fa fa-trash"></span></a>
</td>
</tr>
<?php endforeach;?>
</tbody>
</table>
</div>
<!-- /.box-body -->
</div>
<!-- /.box -->
58

</div>
<!-- /.col -->
</div>
<!-- /.row -->
</section>

4.2.4 Form Admin Guru

Merupakan form untuk menambah, mengedit dan menghapus

data guru

Tampilan datanya sebagai berikut:

Gambar 4.24 Form Admin Guru

Source Code :

<section class="content">
<div class="row">
<div class="col-xs-12">
<div class="box">
<div class="box">
<div class="box-header">
<a class="btn btn-success btn-flat" data-
toggle="modal" data-target="#myModal"><span class="fa fa-
plus"></span> Tambah Guru</a>
</div>
<!-- /.box-header -->
<div class="box-body">
<table id="example1" class="table table-
striped" style="font-size:13px;">
<thead>
<tr> <th>Photo</th>
<th>NIP</th>
<th>Nama</th>
<th>Tempat/Tgl
Lahir</th>
59

<th>Jenis Kelamin</th>
<th>Jabatan</th>
<th style="text-align:right;">Aksi</th>
</tr>
</thead>
<tbody>
<?php
$no=0;
foreach ($data-
>result_array() as $i) :
$no++;
$id=$i['guru_id'];
$nip=$i['guru_nip'];

$nama=$i['guru_nama'];

$jenkel=$i['guru_jenkel'];

$tmp_lahir=$i['guru_tmp_lahir'];

$tgl_lahir=$i['guru_tgl_lahir'];
$mapel=$i['guru_mapel'];
$photo=$i['guru_photo'];
?>
<tr>
<?php if(empty($photo)):?>
<td><img width="40" height="40" class="img-
circle" src="<?php echo
base_url().'assets/images/user_blank.png';?>"></td>
<?php else:?>
<td><img width="40" height="40" class="img-
circle" src="<?php echo
base_url().'assets/images/'.$photo;?>"></td>
<?php endif;?>
<td><?php echo $nip;?></td>
<td><?php echo $nama;?></td>
<td><?php echo $tmp_lahir.',
'.$tgl_lahir;?></td>
<?php if($jenkel=='L'):?>
<td>Laki-Laki</td>
<?php else:?>
<td>Perempuan</td>
<?php endif;?>
<td><?php echo $mapel;?></td>
<td style="text-align:right;">
<a class="btn" data-toggle="modal"
data-target="#ModalEdit<?php echo $id;?>"><span class="fa fa-
pencil"></span></a>
<a class="btn" data-toggle="modal"
data-target="#ModalHapus<?php echo $id;?>"><span class="fa
fa-trash"></span></a>
</td>
</tr>
<?php endforeach;?>
</tbody>
</table>
60

</div>
<!-- /.box-body -->
</div>
<!-- /.box -->
</div>
<!-- /.col -->
</div>
<!-- /.row -->
</section>

4.2.5 Form Admin Agenda

Merupakan form untuk menambah, mengedit dan menghapus

Agenda pada sekolah.

Tampilan formnya sebagai berikut:

Gambar 4.25 Form Admin Agenda

Source Code :

<section class="content">
<div class="row">
<div class="col-xs-12">
<div class="box">
<div class="box">
<div class="box-header">
<a class="btn btn-success btn-flat" data-
toggle="modal" data-target="#myModal"><span class="fa fa-
plus"></span> Add Agenda</a>
</div>
<!-- /.box-header -->
<div class="box-body">
<table id="example1" class="table table-
striped" style="font-size:12px;">
<thead>
<tr>
61

<th
style="width:70px;">#</th>
<th>Agenda</th>
<th>Tanggal</th>
<th>Tempat</th>
<th>Waktu</th>
<th>Author</th>
<th style="text-align:right;">Aksi</th>
</tr>
</thead>
<tbody>
<?php
$no=0;
foreach ($data->result_array()
as $i) :
$no++;
$agenda_id=$i['agenda_id'];
$agenda_nama=$i['agenda_nama'];

$agenda_deskripsi=$i['agenda_deskripsi'];
$agenda_mulai=$i['agenda_mulai'];
$agenda_selesai=$i['agenda_selesai'];
$agenda_tempat=$i['agenda_tempat'];
$agenda_waktu=$i['agenda_waktu'];

$agenda_keterangan=$i['agenda_keterangan'];
$agenda_author=$i['agenda_author'];
$tanggal=$i['tanggal'];
?>
<tr>
<td><?php echo $tanggal;?></td>
<td><?php echo $agenda_nama;?></td>
<td><?php echo $agenda_mulai.' s/d
'.$agenda_selesai;?></td>
<td><?php echo $agenda_tempat;?></td>
<td><?php echo $agenda_waktu;?></td>
<td><?php echo $agenda_author;?></td>
<td style="text-align:right;">
<a class="btn" data-toggle="modal"
data-target="#ModalEdit<?php echo $agenda_id;?>"><span
class="fa fa-pencil"></span></a>
<a class="btn" data-toggle="modal"
data-target="#ModalHapus<?php echo $agenda_id;?>"><span
class="fa fa-trash"></span></a>
</td>
</tr>
<?php endforeach;?>
</tbody>
</table>
</div>
<!-- /.box-body -->
</div>
<!-- /.box -->
</div>
<!-- /.col -->
</div>
62

<!-- /.row -->


</section>

4.2.6 Form Admin Pengumuman

Merupakan form menambah, mengedit dan menghapus

Pengumuman. dan terdapat form input data siswa, kelas dan mata

pelajaran

Tampilan datanya sebagai berikut:

Gambar 4.26 Form Admin Pengumuman

Source Code :

<section class="content">
<div class="row">
<div class="col-xs-12">
<div class="box">
<div class="box">
<div class="box-header">
<a class="btn btn-success btn-flat" data-
toggle="modal" data-target="#myModal"><span class="fa fa-
plus"></span> Add Pengumuman</a>
</div>
<!-- /.box-header -->
<div class="box-body">
<table id="example1" class="table table-striped" style="font-
size:12px;">
<thead>
<tr>
<th
style="width:70px;">#</th>
<th>Judul</th>
<th>Deskripsi</th>
<th>Tanggal Post</th>
63

<th>Author</th>
<th style="text-align:right;">Aksi</th>
</tr>
</thead>
<tbody>
<?php
$no=0;
foreach ($data->result_array()
as $i) :
$no++;
$id=$i['pengumuman_id'];
$judul=$i['pengumuman_judul'];

$deskripsi=$i['pengumuman_deskripsi'];
$author=$i['pengumuman_author'];
$tanggal=$i['tanggal'];
?>
<tr>
<td><?php echo $no;?></td>
<td><?php echo $judul;?></td>
<td><?php echo $deskripsi;?></td>
<td><?php echo $tanggal;?></td>
<td><?php echo $author;?></td>
<td style="text-align:right;">
<a class="btn" data-toggle="modal"
data-target="#ModalEdit<?php echo $id;?>"><span class="fa fa-
pencil"></span></a>
<a class="btn" data-toggle="modal"
data-target="#ModalHapus<?php echo $id;?>"><span class="fa
fa-trash"></span></a>
</td>
</tr>
<?php endforeach;?>
</tbody>
</table>
</div>
<!-- /.box-body -->
</div>
<!-- /.box -->
</div>
<!-- /.col -->
</div>
<!-- /.row -->
</section>

4.2.7 Form Admin Download

Merupakan form menambah, mengedit dan menghapus file

untuk di unduh pengunjung, siswa atau guru.

Tampilan formnya sebagai berikut:


64

Gambar 4.27 Form Admin Download

Source Code :

<section class="content">
<div class="row">
<div class="col-xs-12">
<div class="box">

<div class="box">
<div class="box-header">
<a class="btn btn-success btn-flat" data-
toggle="modal" data-target="#myModal"><span class="fa fa-
plus"></span> Add File</a>
</div>
<!-- /.box-header -->
<div class="box-body">
<table id="example1" class="table table-
striped" style="font-size:12px;">
<thead>
<tr>
<th
style="width:70px;">#</th>
<th>File</th>
<th>Tanggal Post</th>
<th>Oleh</th>
<th>Download</th>
<th style="text-align:right;">Aksi</th>
</tr>
</thead>
<tbody>
<?php
$no=0;
foreach ($data->result_array()
as $i) :
$no++;
$id=$i['file_id'];
$judul=$i['file_judul'];
$deskripsi=$i['file_deskripsi'];
$oleh=$i['file_oleh'];
$tanggal=$i['tanggal'];
$download=$i['file_download'];
65

$file=$i['file_data'];
?>
<tr>
<td><?php echo $no;?></td>
<td><a href="<?php echo
base_url().'admin/files/download/'.$id;?>"><?php echo
$judul;?></a></td>
<td><?php echo $tanggal;?></td>
<td><?php echo $oleh;?></td>
<td><?php echo $download;?></td>
<td style="text-align:right;">
<a class="btn" data-toggle="modal"
data-target="#ModalEdit<?php echo $id;?>"><span class="fa fa-
pencil"></span></a>
<a class="btn" data-toggle="modal"
data-target="#ModalHapus<?php echo $id;?>"><span class="fa
fa-trash"></span></a>
</td>
</tr>
<?php endforeach;?>
</tbody>
</table>
</div>
<!-- /.box-body -->
</div>
<!-- /.box -->
</div>
<!-- /.col -->
</div>
<!-- /.row -->
</section>
4.2.8 Form Admin Gallery

Merupakan Form menambah, mengedit dan menghapus foto-

foto maupun gallery.

Tampilan formnya sebagai berikut:

Gambar 4.28 Form Admin Gallery


66

Source Code :

<section class="content">
<div class="row">
<div class="col-xs-12">
<div class="box">
<div class="box">
<div class="box-header">
<a class="btn btn-success btn-flat" data-
toggle="modal" data-target="#myModal"><span class="fa fa-
plus"></span> Add Photo</a>
</div>
<!-- /.box-header -->
<div class="box-body">
<table id="example1" class="table table-
striped" style="font-size:13px;">
<thead>
<tr>
<th>Gambar</th>
<th>Judul</th>
<th>Tanggal</th>
<th>Album</th>
<th>Author</th>
<th style="text-align:right;">Aksi</th>
</tr>
</thead>
<tbody>
<?php
$no=0;
foreach ($data-
>result_array() as $i) :
$no++;

$galeri_id=$i['galeri_id'];

$galeri_judul=$i['galeri_judul'];

$galeri_tanggal=$i['tanggal'];

$galeri_author=$i['galeri_author'];
$galeri_gambar=$i['galeri_gambar'];
$galeri_album_id=$i['galeri_album_id'];
$galeri_album_nama=$i['album_nama'];
?>
<tr>
<td><img src="<?php echo
base_url().'assets/images/'.$galeri_gambar;?>"
style="width:80px;"></td>
<td><?php echo $galeri_judul;?></td>
<td><?php echo
$galeri_tanggal;?></td>
<td><?php echo
$galeri_album_nama;?></td>
<td><?php echo $galeri_author;?></td>
<td style="text-align:right;">
67

<a class="btn" data-toggle="modal"


data-target="#ModalEdit<?php echo $galeri_id;?>"><span
class="fa fa-pencil"></span></a>
<a class="btn" data-toggle="modal"
data-target="#ModalHapus<?php echo $galeri_id;?>"><span
class="fa fa-trash"></span></a>
</td>
</tr>
<?php endforeach;?>
</tbody>
</table>
</div>
<!-- /.box-body -->
</div>
<!-- /.box -->
</div>
<!-- /.col -->
</div>
<!-- /.row -->
</section>

4.2.9 Form Admin Guru

Merupakan Form menambah, mengedit dan menghapus data

guru.

Tampilan formnya sebagai berikut:

Gambar 4.29 Form Admin Guru

Source Code :

<section class="content">

<div class="row">

<div class="col-xs-12">
68

<div class="box">

<div class="box">

<div class="box-header">

<a class="btn btn-success btn-flat" data-

toggle="modal" data-target="#myModal"><span class="fa fa-

plus"></span> Tambah Guru</a>

</div>

<!-- /.box-header -->

<div class="box-body">

<table id="example1" class="table table-

striped" style="font-size:13px;">

<thead>

<tr>

<th>Photo</th>

<th>NIP</th>

<th>Nama</th>

<th>Tempat/Tgl

Lahir</th>

<th>Jenis Kelamin</th>

<th>Jabatan</th>

<th style="text-align:right;">Aksi</th>

</tr>

</thead>

<tbody>

<?php

$no=0;

foreach ($data-

>result_array() as $i) :
69

$no++;

$id=$i['guru_id'];

$nip=$i['guru_nip'];

$nama=$i['guru_nama'];

$jenkel=$i['guru_jenkel'];

$tmp_lahir=$i['guru_tmp_lahir'];

$tgl_lahir=$i['guru_tgl_lahir'];

$mapel=$i['guru_mapel'];

$photo=$i['guru_photo'];

?>

<tr>

<?php if(empty($photo)):?>

<td><img width="40" height="40" class="img-

circle" src="<?php echo

base_url().'assets/images/user_blank.png';?>"></td>

<?php else:?>

<td><img width="40" height="40" class="img-

circle" src="<?php echo

base_url().'assets/images/'.$photo;?>"></td>

<?php endif;?>

<td><?php echo $nip;?></td>

<td><?php echo $nama;?></td>

<td><?php echo $tmp_lahir.',

'.$tgl_lahir;?></td>

<?php if($jenkel=='L'):?>

<td>Laki-Laki</td>
70

<?php else:?>

<td>Perempuan</td>

<?php endif;?>

<td><?php echo $mapel;?></td>

<td style="text-align:right;">

<a class="btn" data-toggle="modal"

data-target="#ModalEdit<?php echo $id;?>"><span class="fa fa-

pencil"></span></a>

<a class="btn" data-toggle="modal"

data-target="#ModalHapus<?php echo $id;?>"><span class="fa

fa-trash"></span></a>

</td>

</tr>

<?php endforeach;?>

</tbody>

</table>

</div>

<!-- /.box-body -->

</div>

<!-- /.box -->

</div>

<!-- /.col -->

</div>

<!-- /.row -->

</section>

4.2.10 Form Admin Kesiswaan


71

Merupakan Form menambah, mengedit dan menghapus data

siswa.

Tampilan formnya sebagai berikut:

Gambar 4.30 Form Admin Kesiswaan

Source Code :

<section class="content">
<div class="row">
<div class="col-xs-12">
<div class="box">
<div class="box">
<div class="box-header">
<a class="btn btn-success btn-flat" data-
toggle="modal" data-target="#myModal"><span class="fa fa-
plus"></span> Tambah Siswa</a>
</div>
<!-- /.box-header -->
<div class="box-body">
<table id="example1" class="table table-striped"
style="font-size:13px;">
<thead>
<tr>
<th>Photo</th>
<th>NIS</th>
<th>Nama</th>
<th>Jenis Kelamin</th>
<th>Kelas</th>
<th style="text-align:right;">Aksi</th>
</tr>
</thead>
<tbody>
<?php
$no=0;
foreach ($data->result_array()
as $i) :
$no++;
72

$id=$i['siswa_id'];
$nis=$i['siswa_nis'];
$nama=$i['siswa_nama'];
$jenkel=$i['siswa_jenkel'];

$kelas_id=$i['siswa_kelas_id'];
$kelas_nama=$i['kelas_nama'];
$photo=$i['siswa_photo'];
?>
<tr>
<?php if(empty($photo)):?>
<td><img width="40" height="40" class="img-
circle" src="<?php echo
base_url().'assets/images/user_blank.png';?>"></td>
<?php else:?>
<td><img width="40" height="40" class="img-
circle" src="<?php echo
base_url().'assets/images/'.$photo;?>"></td>
<?php endif;?>
<td><?php echo $nis;?></td>
<td><?php echo $nama;?></td>
<?php if($jenkel=='L'):?>
<td>Laki-Laki</td>
<?php else:?>
<td>Perempuan</td>
<?php endif;?>
<td><?php echo $kelas_nama;?></td>
<td style="text-align:right;">
<a class="btn" data-toggle="modal" data-
target="#ModalEdit<?php echo $id;?>"><span class="fa fa-
pencil"></span></a>
<a class="btn" data-toggle="modal" data-
target="#ModalHapus<?php echo $id;?>"><span class="fa fa-
trash"></span></a>
</td>
</tr>
<?php endforeach;?>
</tbody>
</table>
</div>
<!-- /.box-body -->
</div>
<!-- /.box -->
</div>
<!-- /.col -->
</div>
<!-- /.row -->
</section>

4.2.11 Form Admin Inbox

Merupakan Form melihat dan menghapus pesan dari

pengunjung Web Site.


73

Tampilan formnya sebagai berikut:

Gambar 4.31 Form Admin Inbox

Source Code :

<section class="content">
<div class="row">
<div class="col-xs-12">
<div class="box">
<div class="box">
<!-- /.box-header -->
<div class="box-body">
<table id="example1" class="table table-
striped" style="font-size:12px;">
<thead>
<tr>
<th
style="width:70px;">#Tanggal</th>
<th>Nama</th>
<th>Email</th>
<th>Pesan</th>
<th style="text-align:right;">Aksi</th>
</tr>
</thead>
<tbody>
<?php
$no=0;
foreach ($data->result_array()
as $i) :
$no++;
$inbox_id=$i['inbox_id'];
$inbox_nama=$i['inbox_nama'];
$inbox_email=$i['inbox_email'];
$inbox_msg=$i['inbox_pesan'];
$tanggal=$i['tanggal'];
?>
<tr>
<td><?php echo $tanggal;?></td>
<td><?php echo $inbox_nama;?></td>
<td><?php echo $inbox_email;?></td>
74

<td><?php echo $inbox_msg;?></td>


<td style="text-align:right;">
<a class="btn" data-toggle="modal"
data-target="#ModalHapus<?php echo $inbox_id;?>"><span
class="fa fa-trash"></span></a>
</td>
</tr>
<?php endforeach;?>
</tbody>
</table>
</div>
<!-- /.box-body -->
</div>
<!-- /.box -->
</div>
<!-- /.col -->
</div>
<!-- /.row -->
</section>

4.2.12 Form Home

Menampilkan halaman pertama yang akan muncul.

Tampilan formnya sebagai berikut:

Gambar 4.32 Form Home

Source Code :

<div class="content_heading">
<div
class="heading"><h2>Selamat datang di M-Sekolah</h2> </div>
</div>
<p class="text">Website Profile
Sekolah adalah website yang dibangun untuk sekolah Sekolah
Dasar untuk menunjang transparasi informasi dan promosi
sekolah.
75

<p>Kami Menyambut baik


terbitnya Website Profile Sekolah yang baru , dengan harapan
dipublikasinya website ini sekolah berharap : Peningkatan
layanan pendidikan kepada siswa, orangtua, dan masyarakat pada
umumnya semakin meningkat. Sebaliknya orangtua dapat mengakses
informasi tentang kegiatan akademik dan non akademik putra -
puterinya di sekolah ini. Dengan fasilitas ini Siswa dapat
mengakses berbagai informasi pembelajaran dan informasi
akademik.</p>
</p>
<div class="clear"></div>
<!-- Content Block -->
<div class="contentblock">
<!-- Tabs -->
<div class="tabwrapper">
<div
class="tabs_links">
<ul>
<li><a
href="#tab1">Berita</a></li>
<li><a
href="#tab2">Pengumuman</a></li>
<li><a
href="#tab3">Agenda</a></li>
</ul>
</div>
<div
class="tab_content" id="tab1" style="display:none" >
<ul>

<?php

foreach ($berita->result_array() as $n) {

$berita_id=$n['tulisan_id'];

$berita_judul=$n['tulisan_judul'];

$berita_isi=$n['tulisan_isi'];

$berita_tgl=$n['tanggal'];
$berita_kategori=$n['tulisan_kategori_nama'];

$berita_gambar=$n['tulisan_gambar'];

$berita_author=$n['tulisan_author'];
?>
<li>
<div
class="thumb">

<a href="<?php echo


base_url().'berita/berita_detail/'.$berita_id;?>"><img
width="53" height="53" src="<?php echo
base_url().'assets/images/'.$berita_gambar;?>" alt=" "
/></a>
76

</div>

<div class="descripton">

<h6><a href="<?php echo


base_url().'berita/berita_detail/'.$berita_id;?>"><?php echo
$berita_judul;?></a></h6>

<em>(Tanggal <?php echo $berita_tgl;?> | by <?php echo


$berita_author;?>)</em>

<?php echo limit_words($berita_isi,12).'...';?>

</div>
</li>
<?php }
?>
</ul>
<div
class="clear"></div>
</div>
<div
class="tab_content" id="tab2" style="display:none" >
<ul>
<?php
$no=0;
foreach
($pengumuman->result_array() as $p) :

$no++;

$id=$p['pengumuman_id'];

$judul=$p['pengumuman_judul'];

$deskripsi=$p['pengumuman_deskripsi'];

$author=$p['pengumuman_author'];

$tanggal=$p['tanggal'];

?>
<li>
<div
class="thumb">

<a href="<?php echo base_url().'pengumuman'?>"><img


width="60" height="60" src="<?php echo
base_url().'template/images/pengumuman.png'?>" alt=" "
/></a>

</div>

<div class="descripton">
77

<h6><a href="<?php echo base_url().'pengumuman'?>"><?php echo


$judul;?></a></h6>

<em>(Posted on <?php echo $tanggal;?>)</em>

<p> <?php echo limit_words($deskripsi,10).'...';?></p>

</div>
</li>
<?php
endforeach; ?>
</ul>
<div
class="clear"></div>
</div>

<div
class="tab_content" id="tab3" style="display:none" >
<ul>
<?php
$no=0;

foreach ($agenda->result_array() as $g) :

$no++;

$agenda_id=$g['agenda_id'];

$agenda_nama=$g['agenda_nama'];
$agenda_deskripsi=$g['agenda_deskripsi'];

$agenda_mulai=$g['agenda_mulai'];

$agenda_selesai=$g['agenda_selesai'];

$agenda_tempat=$g['agenda_tempat'];

$agenda_waktu=$g['agenda_waktu'];
$agenda_keterangan=$g['agenda_keterangan'];

$agenda_author=$g['agenda_author'];

$tanggal=$g['tanggal'];
?>
<li>
<div
class="thumb">

<a href="<?php echo base_url().'agenda'?>"><img width="60"


height="60" src="<?php echo
base_url().'template/images/agenda.png'?>" alt=" " /></a>

</div>
78

<div class="descripton">

<h6><a href="<?php echo base_url().'agenda'?>"><?php echo


$agenda_nama;?></a></h6>

<em>(Posted on <?php echo $tanggal;?>)</em>

<p><?php echo limit_words($agenda_deskripsi,10).'...'?></p>

</div>
</li>
<?php
endforeach;?>
<li>
</ul>
<div
class="clear"></div>
</div>
</div>
<!-- Search Course -
->
<div
class="search_course">

<h4>Download</h4>
Silahkan
download file terbaru berikut:
<div
class="box">
<div
class="apply_now">
<a
class="aply_now" href="#">Download</a>
</div>
<!-- Degree
Type -->
<div
class="degree_type"><br/>
<ul>
<?php
$no=0;
foreach
($download->result_array() as $d) :

$no++;

$id=$d['file_id'];

$judul=$d['file_judul'];

$deskripsi=$d['file_deskripsi'];

$oleh=$d['file_oleh'];

$tanggal=$d['tanggal'];
79

$download=$d['file_download'];

$file=$d['file_data'];
?>
<li>
<span><a href="<?php echo
base_url().'download/get_file/'.$id;?>"><?php echo
$judul;?></a></span> <a class="btn right" href="<?php echo
base_url().'download/get_file/'.$id;?>">Download</a></li>
<?php
endforeach;?>
</ul>
</div>
<div
class="clear"></div>
<!--
apply now -->
<div
class="apply_now">
<a
class="aply_now" href="#"></a>
<a
class="find_out_how" href="<?php echo
base_url().'download'?>">Lihat Semua</a>
</div>
</div>
</div>
<div
class="clear"></div>
</div>
<div
class="clear"></div>

4.2.13 Form Profil

Menampilkan Form Kata Pengantar dan Visi Misi.

Tampilan formnya sebagai berikut:

Kata Pengantar Kepala Sekolah


80

Gambar 4.33 Form Kata Pengantar

Source Code :

<div id="content_section">
<div class="static_content pad2">
<div class="staticblock2">
<a href="#"><img src="<?php echo
base_url().'template/images/staticimge1.jpg'?>" alt=""
/></a>
<h4>Kata Sambutan Kepala
Sekolah</h4><br/>
<p align="justify">Alhamdulillahi
rabbil 'alamin, wash shalatu was salamu 'alaa asyrafil anbiyai
wal mursalin, wa 'ala aalihi wa ash-habihi ajma'in, imma
ba'du:</p>
<p align="justify">Para pengunjung situs yang berbahagia, kami
ucapkan selamat datang di situs SD NEGERI KROPAK II ini.
Bahwasanya kami sadar sepenuhnya dalam rangka memajukan
pendidikan di era berkembangnya Teknologi Informasi yang
begitu pesat, sangat diperlukan berbagai sarana prasarana yang
kondusif, kebutuhan berbagai informasi siswa, guru, orang tua
maupun masyarakat, sehingga kami berusaha mewujudkan hal
tersebut meskipun belum begitu maksimal dengan peluncuran
situs ini semoga dapat membantu dan bermanfaat, terutama
sekali informasi yang berhubungan dengan pendidikan, ilmu
pengetahuan dan informasi seputar SD NEGERI KROPAK II.</p>
<p align="justify">Kami berharap, dengan adanya media layanan
informasi situs ini semoga dapat mewujudkan hubungan
silaturrahmi yang lebih erat lagi, menambah wawasan,
mempermudah dan mempercepat proses dalam mendapatkan info yang
dibutuhkan.</p>
<p align="justify">Bahwasanya kami sadar sepenuhnya dalam
rangka memajukan pendidikan di era berkembangnya Teknologi
Informasi yang begitu pesat, sangat diperlukan berbagai sarana
prasarana yang kondusif.</p>
<p align="justify">Akhirnya, terima kasih kami atas
dikunjunginya situs ini, mudah-mudahan membawa manfaat bagi
kita semua.</p>
</div>
81

</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
</div>
</div>

Visi dan Misi

Gambar 4.34 Form Visi dan Misi

Source Code :

<div id="content_section">
<div class="static_content pad2">
<div class="staticblock2">
<a href="#"><img src="<?php echo
base_url().'template/images/staticimge2.jpg'?>" alt=""
/></a>
<h4>VISI</h4><br/>
<p>Terwujudnya Warga Sekolah yang
Cerdas, Berwawasan luas, Sehat dan Bertanggung jawab serta
peduli Lingkungan.</p><br/>
<h4>MISI</h4><br/>
<p>1. Meningkatkan kualitas sumber
daya Manusia yang Berilmu Pengetahuan, Mandiri dan Bertanggung
Jawab.</p>
<p>2. Meningkatkan penghayatan serta
Pengamalan Pancasila sebagai Dasar Negara.</p>
<p>3. Meningkatkan kesadaran akan
kepedulian terhadap Lingkungan</p>
<p>4. Membentuk Manusia yang Sehat
Jasmani dan Rohani.</p>
<p>5. Mengembangkan Sarana dan
Prasarana penunjang KBM guna memacu kecerdasan serta
keterampilan Siswa.</p>
</div>
</div>
<div class="clear"></div>
</div>
82

<div class="clear"></div>
</div>
</div>

Kurikulum

Gambar 4.35 Form Kurikulum

Source Code :

<div id="content_section">
<div class="static_content pad2">
<div class="staticblock2">
<h4><p align="justify">SD
Negeri Kropak II Menggunakan Kurikulum 2006 / KTSP
2006</p></h4>
<p align="justify">Kurikulum Tingkat Satuan Pendidikan
(KTSP) atau Kurikulum 2006 adalah sebuah kurikulum
operasional pendidikan yang disusun oleh, dan
dilaksanakan di masing-masing satuan pendidikan di
Indonesia. KTSP secara yuridis diamanatkan oleh Undang-
Undang Nomor 20 Tahun 2003 tentang Sistem Pendidikan
Nasional, dan Peraturan Pemerintah Republik Indonesia
Nomor 19 Tahun 2005 tentang Standar Nasional
Pendidikan. Penyusunan KTSP oleh sekolah dimulai tahun
ajaran 2007/2008 dengan mengacu pada Standar Isi (SI)
dan Standar Kompetensi Lulusan (SKL) untuk pendidikan
dasar, dan menengah sebagaimana yang diterbitkan
melalui Peraturan Menteri Pendidikan Nasional masing-
masing Nomor 22 Tahun 2006, dan Nomor 23 Tahun 2006,
serta Panduan Pengembangan KTSP yang dikeluarkan oleh
Badan Standar Nasional Pendidikan (BSNP).[1]</p>
</div>
<p align="justify">Salah satu perubahan yang menonjol
pada KTSP dibanding dengan kurikulum sebelumnya adalah
KTSP bersifat desentralistik. Artinya, segala tata
aturan yang dicantumkan dalam kurikulum, yang
sebelumnya dirancang dan ditetapkan oleh pemerintah
pusat, dalam KTSP sebagian tata aturan dalam kurikulum
diserahkan untuk dikembangkan dan diputuskan oleh pihak
83

di daerah atau sekolah. Meski terdapat kebebasan untuk


melakukan pengembangan pada tingkat satuan pendidikan,
namun pengembangan kurikulum harus mengacu pada Standar
Nasional Pendidikan yang telah ditetapkan oleh Badan
Standar Nasional Pendidikan (BSNP). Ketetapan ini
tercantum dalam Peraturan Menteri Pendidikan Nasional
nomor 23 tahun 2006 tentang Standar Kompetensi Lulusan
pada Satuan Pendidikan Dasar dan Menengah.[2] KTSP
terdiri dari tujuan pendidikan tingkat satuan
pendidikan, struktur, dan muatan kurikulum tingkat
satuan pendidikan, kalender pendidikan, dan silabus.
Pelaksanaan KTSP mengacu pada Permendiknas Nomor 24
Tahun 2006 tentang Pelaksanaan SI dan SKL.</p>
</div>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
</div>
</div>

Fasilitas

Gambar 4.36 Form Fasilitas

Source Code :

<div id="content_section">
<div class="static_content pad2">
<div class="staticblock2">
<h4>Ruang Kelas</h4>
<p align="justify">Ruang kelas dilengkapi pendingin
ruangan kipas dan didesain agar anak merasa nyaman dan
dapat berinteraksi dengan guru serta teman-temannya
dengan leluasa. Selain meja-kursi, disediakan karpet
untuk kegiatan circle time dan pembelajaran di dalam
kelas. Letak meja dan kursi dapat dirubah sesuai dengan
kebutuhan pembelajaran. Masing-masing kelas dilengkapi
dengan Library Corner untuk menunjang program membaca
siswa.</p>
84

<h4>Ruang Kesehatan</h4>
<p align="justify">Demi mengantisipasi adanya siswa
yang kurang sehat saat di sekolah, ruang kesehatan
dilengkapi dengan obat-obatan, P3K, ranjang dan ruangan
ber-AC.</p>
<h4>Kantin Sekolah</h4>
<p align="justify">Kantin sekolah Smart School Al
Haamidiyah menyediakan makanan dan minuman ringan yang
sudah terjamin ke-halal-annya dan aman dikonsumsi untuk
para siswa.</p>

<h4>Perpustakaan</h4>
<p align="justify">Perpustakaan digunakan dalam
pembelajaran bahasa, social dan lainnya. Dalam
perpustakaan dikondisikan kegiatan membaca, mencari
sumber belajar maupun tugas mandiri. Koleksi buku dan
referensi disediakan dengan memperhitungkan kebutuhan
sumber belajar anak di sekolah.</p>
<p align="justify">Sekolah memiliki perpustakaan
(Library Media Center) yang dipadukan dengan ruang
kreativitas siswa. Jenis koleksi yang tersedia
bervariasi antara lain berupa buku-buku pengetahuan,
fiksi, referensi, ensiklopedia, majalah dan surat
kabar. Disamping itu tersedia pula koleksi yang berupa
CD pembelajaran dan video untuk pengembangan proses
belajar siswa di kelas, serta permainan edukatif
seperti puzzle, balok, logico dan sebagainya.</p>
<h4>Mushola</h4>
<p align="justify">Mushola berada di dalam area
sekolah. Untuk mendukung pelayanan terhadap jamaah,
mushola dilengkapi dengan peralatan sound system yang
memadai, yang sekaligus merupakan tempat aktifitas
keagamaan.</p>
<h4>Lapangan Olahraga</h4>
<p align="justify">Lapangan olahraga telah didesain
untuk beragam pelajaran olahraga seperti bola basket,
footsal, volley dan atletik. Lapangan yang luas dan
sarana olahraga yang beragam memberi peluang lebih
besar untuk dapat mengembangkan motorik kasar dan bakat
anak. Lapangan dan sarana olahraga yang ada terdiri
dari basket, badminton dan futsal.</p>
<h4>Play Ground</h4>
<p align="justify">Demi memastikan para siswa bermain
dengan aman dan dapat mengeksplore kemampuan motorik
secara baik. Sekolah menyediakan taman bermain khusus
untuk para siswa.</p>
<h4>Keamanan</h4>
<p align="justify">Berada dalam lingkungan yang asri
dan nyaman, sekolah ini dilengkapi oleh personil
keamanan yang professional (Satpam). Dengan kelengkapan
keamanan tersebut, mampu menciptakan keamanan dan
kenyamanan kegiatan pembelajaran maupun kenyamanan
lingkungan di sekitar sekolah.</p>
</div>
</div>
<div class="clear"></div>
85

</div>
<div class="clear"></div>
</div>
</div>

4.2.14 Form Guru

Menampilkan data guru.

Tampilan formnya sebagai berikut:

Gambar 4.37 Form Guru

Source Code :

<div id="content2">
<h2 class="pad8">Data
Guru</h2>
<!-- Blog Listing -->
<ul class="listing">
<?php
$no=0;
foreach ($data-
>result_array() as $i) :
$no++;
$id=$i['guru_id'];
$nip=$i['guru_nip'];
$nama=$i['guru_nama'];

$jenkel=$i['guru_jenkel'];

$tmp_lahir=$i['guru_tmp_lahir'];

$tgl_lahir=$i['guru_tgl_lahir'];
86

$mapel=$i['guru_mapel'];

$photo=$i['guru_photo'];

?>
<li>
<div
class="thumb">
<?php
if(empty($photo)):?>
<img width="100"
height="100" src="<?php echo
base_url().'assets/images/user_blank.png';?>" alt="" />
<?php else:?>
<img width="100"
height="100" src="<?php echo
base_url().'assets/images/'.$photo;?>" alt="" />
<?php endif;?>
</div>
<div
class="description">
<table
style="font-size:12px;">
<tr>
<td>NIP</td>
<td>:</td>
<td><?php
echo $nip;?></td>
</tr>
<tr>

<td>Nama</td>
<td>:</td>
<td><?php
echo $nama;?></td>
</tr>
<tr>
<td>Jenis
Kelamin</td>
<td>:</td>
<?php
if($jenkel=='L'):?>
<td>Laki-
Laki</td>
<?php
else:?>

<td>Perempuan</td>
<?php
endif;?>
</tr>
<tr>

<td>Kelahiran</td>
<td>:</td>
87

<td><?php
echo $tmp_lahir.', '.$tgl_lahir;?></td>
</tr>
<tr>

<td>Jabatan</td>
<td>:</td>
<td><?php
echo $mapel;?></td>
</tr>
</table>
</div>
<div
class="clear"></div>
</li>
<?php endforeach;?>
</ul>
<div class="clear"></div>
<!-- pagination Listing -->
<div
class="pginaiton pad9">
<ul>
<li><?php
echo $page;?></li>

</ul>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
</div>

4.2.15 Form Kesiswaan

Menampilkan Form data siswa dan prestasi.

Tampilan formnya sebagai berikut:

Data Siswa
88

Gambar 4.38 Form Data Siswa

Source Code :

<div id="content_section">

<div class="clear"></div>
<!-- Col1 -->
<div class="col1">
<!-- Banner -->
<div id="banner1">

<a href="#"><img src="<?php echo


base_url().'template/images/sampulmurid.jpg'?>" alt="" /></a>
<div class="heading">
<h1>Data Siswa</h1>
</div>
</div>
<!-- Content Heading -->
<div id="content2">
<h2 class="pad8">Data
Siswa</h2>
<!-- Blog Listing -->
<ul class="listing">
<?php
$no=0;
foreach ($data-
>result_array() as $i) :
$no++;
$id=$i['siswa_id'];
$nis=$i['siswa_nis'];
$nama=$i['siswa_nama'];

$jenkel=$i['siswa_jenkel'];

$kelas_id=$i['siswa_kelas_id'];

$kelas_nama=$i['kelas_nama'];

$photo=$i['siswa_photo'];
89

?>
<li>
<div
class="thumb">
<?php
if(empty($photo)):?>
<img width="100"
height="100" src="<?php echo
base_url().'assets/images/user_blank.png';?>" alt="" />
<?php else:?>
<img width="100"
height="100" src="<?php echo
base_url().'assets/images/'.$photo;?>" alt="" />
<?php endif;?>
</div>
<div
class="description">
<table
style="font-size:14px;">
<tr>
<td>NIS</td>
<td>:</td>
<td><?php
echo $nis;?></td>
</tr>
<tr>

<td>Nama</td>
<td>:</td>
<td><?php
echo $nama;?></td>
</tr>
<tr>
<td>Jenis
Kelamin</td>
<td>:</td>
<?php
if($jenkel=='L'):?>
<td>Laki-
Laki</td>
<?php
else:?>

<td>Perempuan</td>
<?php
endif;?>
</tr>
<tr>

<td>Kelas</td>
<td>:</td>
<td><?php
echo $kelas_nama;?></td>
</tr>
</table>
</div>
90

<div
class="clear"></div>
</li>
<?php endforeach;?>
</ul>
<div class="clear"></div>
<!-- pagination Listing -->
<div
class="pginaiton pad9">
<ul>
<li><?php
echo $page;?></li>
</ul>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
</div>

Prestasi Siswa

Gambar 4.39 Form Prestasi Siswa

Source Code :

<div id="content_section">
<div class="clear"></div>
<!-- Col1 -->
<div class="col1">
<!-- Banner -->
<div id="banner1">
<a
href="#"><img src="<?php echo
base_url().'template/images/prestasimurid.jpg'?>" alt=""
/></a>
<div class="heading">
<h1>Prestasi Siswa</h1>
</div>
</div>
<!-- Content Heading -->
91

<div id="content2">
<h2 class="pad8">Prestasi
Siswa Terbaru</h2>
<!-- Blog Listing -->
<ul class="listing">
<?php
$no=0;
foreach ($data-
>result_array() as $i) :
$no++;

$id=$i['prestasi_siswa_id'];

$judul=$i['prestasi_siswa_judul'];

$deskripsi=$i['prestasi_siswa_deskripsi'];

$author=$i['prestasi_siswa_author'];
$tanggal=$i['tanggal'];
?>
<li>
<div
class="thumb"><a href=""><img width="126" height="106"
src="<?php echo
base_url().'template/images/prestasi_siswa.png'?>" alt=""
/></a></div>
<div
class="description">
<h6><a href=""
class="colr"><?php echo $judul;?></a></h6>
<?php echo
$deskripsi;?>
<div
class="clear"></div>
<div
class="info">
<span
class="postedby">Di Post Oleh: <?php echo $author;?></span>
<span
class="lastupdte">Tanggal: <i><?php echo
$tanggal;?></i></span>
</div>
</div>
<div
class="clear"></div>
</li>
<?php endforeach;?>

</ul>
<div class="clear"></div>
<!-- pagination Listing -->
<div
class="pginaiton pad9">
<ul>
<li><?php
echo $page;?></li>
92

</ul>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
</div>

4.2.16 Form Berita

Menampilkan Berita-Berita yang ada pada sekolah dan

sekitarnya.

Tampilan formnya sebagai berikut:

Gambar 4.40 Form Berita

Source Code :

<div id="content_section">
<!-- News Updates -->
<div class="clear"></div>
<!-- Col1 -->
<div class="col1">
<!-- Banner -->
<div id="banner1">
<a href="#"><img
src="<?php echo base_url().'template/images/berita.jpg'?>"
alt="" /></a>
<div class="heading">
<h1>Berita /
Artikel</h1>
</div>
</div>
<!-- Content Heading -->
<div id="content2">
93

<h2 class="pad8">Berita /
Artikel</h2>
<!-- Blog Listing -->
<ul class="listing">
<?php
$no=0;
foreach ($data-
>result_array() as $i) :
$no++;

$tulisan_id=$i['tulisan_id'];

$tulisan_judul=$i['tulisan_judul'];

$tulisan_isi=$i['tulisan_isi'];

$tulisan_tanggal=$i['tanggal'];

$tulisan_author=$i['tulisan_author'];

$tulisan_gambar=$i['tulisan_gambar'];

$tulisan_views=$i['tulisan_views'];

$kategori_id=$i['tulisan_kategori_id'];

$kategori_nama=$i['tulisan_kategori_nama'];
?>
<li>
<div
class="thumb"><a href="<?php echo
base_url().'berita/berita_detail/'.$tulisan_id;?>"><img
width="126" height="106" src="<?php echo
base_url().'assets/images/'.$tulisan_gambar;?>" alt=""
/></a></div>
<div
class="description">
<h6><a href="<?php
echo base_url().'berita/berita_detail/'.$tulisan_id;?>"
class="colr"><?php echo $tulisan_judul;?></a></h6>
<?php echo
limit_words($tulisan_isi,30).'...'?>
<div
class="clear"></div>
<div
class="info">
<span
class="postedby">Di Post Oleh: <?php echo
$tulisan_author;?></span>
<span
class="lastupdte"> Tanggal:<i><?php echo
$tulisan_tanggal;?></i></span>
<span
class="comments">Dibaca: <strong><?php echo
$tulisan_views;?></strong> Kali</span>
94

<a
class="moreinfo" href="<?php echo
base_url().'berita/berita_detail/'.$tulisan_id;?>">Baca
Selengkapnya</a>
</div>
</div>
<div
class="clear"></div>
</li>
<?php endforeach;?>
</ul>
<div class="clear"></div>
<!-- pagination Listing -->
<div class="pginaiton pad9">
<ul>
<li><?php
echo $page;?></li>
</ul>
</div> <div
class="clear"></div>
</div>
<div class="clear"></div>
</div>

4.2.17 Form Pengumuman

Menampilkan Pengumuman untuk murid-murid.

Tampilan formnya sebagai berikut:

Gambar 4.41 Form Pengumuman

Source Code :

<div id="content_section">
<div class="clear"></div>
<!-- Col1 -->
<div class="col1">
<!-- Banner -->
95

<div id="banner1">
<a
href="#"><img src="<?php echo
base_url().'template/images/pengumuman.jpg'?>" alt="" /></a>
<div class="heading">
<h1>Pengumuman</h1>
</div>
</div>
<!-- Content Heading -->
<div id="content2">
<h2 class="pad8">Pengumuman
Terbaru</h2>
<!-- Blog Listing -->
<ul class="listing">
<?php
$no=0;
foreach ($data-
>result_array() as $i) :
$no++;

$id=$i['pengumuman_id'];

$judul=$i['pengumuman_judul'];

$deskripsi=$i['pengumuman_deskripsi'];

$author=$i['pengumuman_author'];
$tanggal=$i['tanggal'];
?>
<li>
<div
class="thumb"><a href=""><img width="126" height="106"
src="<?php echo
base_url().'template/images/pengumuman.png'?>" alt=""
/></a></div>
<div
class="description">
<h6><a href=""
class="colr"><?php echo $judul;?></a></h6>
<?php echo
$deskripsi;?>
<div
class="clear"></div>
<div
class="info">
<span
class="postedby">Di Post Oleh: <?php echo $author;?></span>
<span
class="lastupdte">Tanggal: <i><?php echo
$tanggal;?></i></span>
</div>
</div>
<div
class="clear"></div>
</li>
<?php endforeach;?>
96

</ul>
<div class="clear"></div>
<!-- pagination Listing -->
<div
class="pginaiton pad9">
<ul>
<li><?php
echo $page;?></li>
</ul>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
</div>

4.2.18 Form Agenda

Menampilkan kegiatan-kegiatan yang akan diadakan di sekolah.

Tampilan formnya sebagai berikut:

Gambar 4.42 Form Agenda

Source Code :

<div id="content_section">
<!-- News Updates -->
<div class="clear"></div>
<!-- Col1 -->
<div class="col1">
<!-- Banner -->
<div id="banner1">
<a
href="#"><img src="<?php echo
base_url().'template/images/agenda.jpg'?>" alt="" /></a>
<div class="heading">
<h1>Agenda Kegiatan</h1>
</div>
</div>
97

<!-- Content Links -->

<!-- Content Heading -->


<div id="content2">
<h2 class="pad8">Agenda
Kegiatan</h2>
<!-- Blog Listing -->
<ul class="listing">
<?php
$no=0;
foreach ($data-
>result_array() as $i) :
$no++;

$agenda_id=$i['agenda_id'];

$agenda_nama=$i['agenda_nama'];

$agenda_deskripsi=$i['agenda_deskripsi'];

$agenda_mulai=$i['agenda_mulai'];

$agenda_selesai=$i['agenda_selesai'];

$agenda_tempat=$i['agenda_tempat'];

$agenda_waktu=$i['agenda_waktu'];

$agenda_keterangan=$i['agenda_keterangan'];

$agenda_author=$i['agenda_author'];
$tanggal=$i['tanggal'];

?>
<li>
<div
class="thumb"><a href=""><img width="126" height="106"
src="<?php echo base_url().'template/images/agenda.png'?>"
alt="" /></a></div>
<div
class="description">
<h6><a href=""
class="colr"><?php echo $agenda_nama;?></a></h6>
<?php echo
$agenda_deskripsi;?>
<div
class="clear"></div>
<div
class="info">
<span
class="postedby">Di Post Oleh: <?php echo
$agenda_author;?></span>
<span
class="lastupdte">Tanggal: <i><?php echo
$tanggal;?></i></span>
</div>
98

</div>
<div
class="clear"></div>
</li>
<?php endforeach;?>
</ul>
<div class="clear"></div>
<!-- pagination Listing -->
<div
class="pginaiton pad9">
<ul>
<li><?php
echo $page;?></li>
</ul>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
</div>

4.2.19 Form Gallery

Menampilkan foto-foto kegiatan.

Tampilan formnya sebagai berikut:

Gambar 4.43 Form Gallery

Source Code :

<div id="content_section">
<!-- News Updates -->
<div class="clear"></div>
<!-- Gallery -->
<div class="gallery">
<div class="gallery_top">
<div class="gallery_heading">
<h2>Gallery Photo</h2>
99

</div>
<div class="select_gallery">

</div>
<div class="clear"></div>
</div>
<!-- Col1 -->
<div class="categorydiv">
<ul>
<li><a
class="selected" href="#">Semua</a></li>
<?php
foreach ($alb-
>result_array() as $i) {

$alb_id=$i['album_id'];

$alb_nama=$i['album_nama'];
?>
<li><a href="<?php echo
base_url().'galeri/album/'.$alb_id;?>"><?php echo
$alb_nama;?></a></li>
<?php } ?>
</ul>
</div>
<div class="thumbdiv">
<ul>
<?php
foreach ($all_galeri-
>result_array() as $a) {
$id=$a['galeri_id'];

$judul=$a['galeri_judul'];

$gambar=$a['galeri_gambar'];
?>
<li><a href="<?php
echo base_url().'assets/images/'.$gambar?>" rel="galleryimg"
class="galleryimg" title="<?php echo $judul;?>" ><img
width="108" height="101" src="<?php echo
base_url().'assets/images/'.$gambar?>" alt="" /></a></li>
<?php } ?>
</ul>
<div class="hdiv">&nbsp;</div>
</div>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
</div>
</div>

4.2.20 Form Download

Menampilkan Form untuk mengunduh file.


100

Tampilan formnya sebagai berikut:

Gambar 4.44 Form Download

Source Code :

<div id="content_section">
<div class="clear"></div>
<!-- Col1 -->
<div class="col1">
<!-- Content Links -->

<div id="banner1">
<a href="#"><img src="<?php echo
base_url().'template/images/download.jpg'?>" alt="" /></a>
<div class="heading">
<h1>Download</h1>
</div>
</div>
<!-- Content Heading -->
<div class="content_heading">
<div
class="heading"><h2>Download file yang Anda butuhkan.</h2>
</div>
</div>
<div class="clear"></div>
<!-- Content Block -->
<div class="listingblock">

<div
class="clear"></div>
<div class="course_listing">
<ul class="listheading">
<li class="code
colr">No</li>
<li class="coursename
colr">Judul</li>
<li class="time
colr">Tanggal</li>
101

<li class="location
colr">Oleh</li>
<li class="instructor
colr">Aksi</li>
</ul>
<?php
$no=0;
foreach ($data-
>result_array() as $d) :
$no++;
$id=$d['file_id'];

$judul=$d['file_judul'];

$deskripsi=$d['file_deskripsi'];

$oleh=$d['file_oleh'];

$tanggal=$d['tanggal'];

$download=$d['file_download'];

$file=$d['file_data'];
?>
<ul class="courselisting">
<li class="code"><?php
echo $no;?></li>
<li
class="coursename"><?php echo $judul;?></li>
<li class="time"><?php
echo $tanggal;?></li>
<li
class="location"><?php echo $oleh;?></li>
<li
class="instructor"><a href="<?php echo
base_url().'admin/files/download/'.$id;?>">Download</a></li>
</ul>
<?php endforeach;?>
<div class="clear"></div>
</div>
</div>
<!-- Note -->
<div class="note">
<a href="#"
class="close">&nbsp;</a>
<p>
<strong>
NB:</strong> Silahkan download file yang sesuai dengan
kebutuhan Anda!.
</p>
</div>
<div class="clear"></div>
<!-- col1 ends -->
</div>
102

4.2.21 Form Hubungi Kami

Menampilkan lokasi dan kontak person sekolah.

Tampilan formnya sebagai berikut:

Gambar 4.45 Form Hubungi Kami

Source Code :

<div id="content_section">
<div class="clear"></div>
<!-- Col1 -->
<div class="col1">
<div class="clear"></div>
<!-- Note -->

<div class="clear"></div>
<div class="contactblock">
<!-- Contact block -->
<?php echo $map['html'];?>
<div class="clear"></div>
</div>
<div class="contactblock">
<?php echo $this->session-
>flashdata('msg');?>
<div class="block1">
<h5>Kirim Pesan</h5>
<form action="<?php echo
base_url().'kontak/kirim_pesan'?>" method="post">
<ul class="inquiry">
<li><input
name="xnama" type="text" placeholder="Nama" required/></li>
<li><input
name="xemail" type="email" placeholder="Email"
required/></li>
<li><input
name="xkontak" type="text" placeholder="Kontak Person"
required/></li>
103

<li>
<textarea
rows="0" cols="0" name="xpesan" class="txtarea"
placeholder="Tinggalkan Pesan disini" required></textarea>
</li>
</ul>
<div class="action">

<button class="btn1 left" type="submit">Kirim</button>


</form>

</div>
</div>
<div class="block2">
<!-- Visit Address -->
<h5>Alamat</h5>
<div
class="mailingaddress">
<p>Jalan Raya
Bantaran Desa Kropak Kecamatan Bantaran</p>
<p>Kabupaten
Probolinggo,</p>
<p>Jawa Timur</p>
</div>
<div class="teleno
colr">+6281334585454</div>
<div class="emailaddress">
<a
href="#">sdnkropak2@gmail.com</a>
<a
href="#">www.sdnkropak2.com</a>
</div>
<div class="contacticon
colr"> 67261</div>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
<div class="clear"></div>
<!-- col1 ends -->
</div>

4.2

4.3 Hasil Pengujian

Pengujian merupakan bagian yang penting dalam siklus pembangunan

perangkat lunak. Pengujian dilakukan untuk menjamin kualitas dan juga


104

mengetahui kelemahan dari perangkat lunak. Tujuan dari pengujian adalah

menjamin bahwa perangkat lunak yang dibangun memiliki kualitas yang

handal yaitu mampu mempretasikan kajian pokok dari spesifikasi, analisis,

perancangan dan pengekodean dari perangkat lunak itu sendiri.

Adapun kriteria pengujian tersebut dimaksudkan untuk mengetahui

kebenaran perangkat lunak dan kesesuaian dengan spesifikasinya dinyatakan

berhasil jika aplikasi mampu menjalankan fungsi-fungsi berdasarkan

spesifikasi secara benar. Sebaliknya pengujian dinyatakan gagal jika terdapat

fungsi dari perangkat lunak dalam spesifikasi yang tidak dapat dijalankan pada

proses pengujian.

Pengujian perangkat lunak ini menggunakan metode pengujian Black

Box. Pengujian Black Box berfokus pada persyaratan fungsional perangkat

lunak yang dibuat. Adapun hasil pengujian adalah sebagai berikut :

4.3.1 Tahap Pengujian Halaman Login

Tabel 4.18 : Pengujian Halaman Login

No Penguji Status
1 Tampilan Halaman Login Baik
2 Akses Login Baik

4.3.2 Tahap Pengujian Halaman Utama

Tabel 4.19 : Pengujian Tampilan Halaman Utama

No Penguji Status
105

1 Tampilan Halaman Dashboard Baik


2 Tampilan Halaman Berita Baik
3 Tampilan Halaman Pengguna Baik
4 Tampilan Halaman Agenda Baik
5 Tampilan Halaman Pengumuman Baik
6 Tampilan Halaman Download Baik
7 Tampilan Halaman Gallery Baik
8 Tampilan Halaman Data Guru Baik
9 Tampilan Halaman Kesiswaan Baik
10 Tampilan Halaman Inbox Baik
11 Tampilan Halaman Sign Out Baik

4.3.3 Tahap Pengujian Halaman Admin

Tabel 4.20 : Pengujian Halaman Admin

No Penguji Status
1 Fungsi Dashboard Baik
2 Tambah Berita Baik
3 Ubah Berita Baik
4 Hapus Berita Baik
5 Tambah Pengguna Baik
6 Ubah Pengguna Baik
7 Hapus Pengguna Baik
8 Tambah Agenda Baik
9 Ubah Agenda Baik
10 Hapus Agenda Baik
11 Tambah Pengumuman Baik
12 Ubah Pengumuman Baik
13 Hapus Pengumuman Baik
14 Tambah Download Baik
106

15 Ubah Download Baik


16 Hapus Download Baik
17 Tambah Gallery Baik
18 Ubah Gallery Baik
19 Hapus Gallery Baik
20 Tambah Data Guru Baik
21 Ubah Data Guru Baik
22 Hapus Data Guru Baik
23 Tambah Kesiswaan Baik
24 Ubah Kesiswaan Baik
25 Hapus Kesiswaan Baik
26 Fungsi Inbox Baik
27 Fungsi Sign Out Baik

Berdasarkan tabel hasil pengujian black box diatas yang dilakukan oleh

admin dapat disimpulkan bahwa pengujian telah berhasil dan sistem berjalan

dengan baik sesuai yang diharapkan.

4.3.4 Pengujian menggunakan Browser

Dalam pengujian menggunakan browser peneliti menggunakan Google

Chrome, Mozila Firefox, dan Internet Explorer sebagai sarana uji coba sistem,

dan sistem berjalan dengan baik.

4.3.5 Kuisioner
107

Berikut adalah daftar pertanyaan yang diberikan kepada responden

mengenai tampilan Sistem Informasi Web Profil Sekolah di SD Negeri Kropak

II Berbasis Web.

Tabel 4.21 : Pengujian Halaman Admin

Jawaban
No Pernyataan
SS S N TS STS
1 Tulisan pada website informasi
sekolah mudah dibaca dan dipahami.
2 Tampilan pada website menarik dan
nyaman untuk dilihat.
3 Website mudah diakses oleh semua
orang.
4 Website memberikan kemudahan
bagi masyarakat dalam mencari
informasi sekolah.
5 Kategori jenjang sekolah sudah
terbagi sehingga memberikan
informasi yang tepat.
6 Website menampilkan peta lokasi
sekolah.
7 Website memberikan informasi
mengenai profil sekolah dan
keunggulan sekolah secara lengkap
dan detail.
8 Website ini pantas untuk
dipublikasikan

Keterangan Jawaban:
108

SS : Sangat Setuju

TS : Tidak Setuju

S : Setuju

STS : Sangat Tidak Setuju

N : Netral

Bagaimana pendapat Anda tentang website informasi sekolah ini dan berikan

kritik dan saran?

Jawab : ................................................................................................................

Kuisioner dibagikan kepada 20 responden untuk mengetahui efektivitas

sistem informasi sekolah berbasis website di SD Negeri Kropak II yang telah

dibuat. Dengan rumus perhitungan sebagai berikut :

Z : P / ∑n × 100%

Keterangan :

Z : Presentasi Penilaian

P : nilai pada penilaian

∑n : jumlah responden

Hasil perhitungan dapat dilihat pada Tabel dibawah ini :


109

Tabel 4.22 : Hasil Penghitungan Kuisioner

Nilai Jawaban Presentase % Nilai Jawaban

Pernyataan 5 4 3 2 1 5 4 3 2 1

SS S N TS STS SS S N TS STS

P1 8 12 0 0 0 40 60 0 0 0

P2 4 14 2 0 0 20 70 10 0 0

P3 5 14 1 0 0 25 70 5 0 0

P4 5 14 1 0 0 25 70 5 0 0

P5 6 9 5 0 0 30 45 25 0 0

P6 4 14 2 0 0 20 70 10 0 0

P7 4 8 8 0 0 20 40 45 0 0

P8 4 13 3 0 0 20 65 15 0 0

Jumlah 200 490 110 0 0

Rata-Rata% 25 61,25 13,75 0 0

Berdasarkan tabel diatas menunjukan bahwa 25% menjawab “Sangat

Setuju” dengan sistem yang dibuat. 61.25% menjawab “Setuju” dengan sistem yang

telah dibuat, dan 13.75% menjawab “Netral/Cukup”, serta 0% untuk jawaban

“Tidak Setuju” dan “Sangat Tidak Setuju”. Sehingga secara keseluruhan Sistem

Informasi Sekolah Di SD Negeri Kropak II Berbasis Website efektif dalam

penyampaian informasi sekolah ke masyarakat.