Listing Program. A. Config 1. Koneksi.php. <? $server = "localhost"; $username = "root"; $password = "12345"; $database = "dbsma";

Size: px
Start display at page:

Download "Listing Program. A. Config 1. Koneksi.php. <? $server = "localhost"; $username = "root"; $password = "12345"; $database = "dbsma";"

Transcription

1 Listing Program A. Config 1. Koneksi.php <? $server = "localhost"; $username = "root"; $password = "12345"; $database = "dbsma"; // Koneksi dan memilih database di server mysql_connect($server,$username,$password) or die("koneksi gagal"); mysql_select_db($database) or die("database tidak bisa dibuka");?> 2. Tanggal.php <?php $engdate=date("l F d, Y H:i:s A"); switch (date("w")) { case "0" : $hari="minggu";break; case "1" : $hari="senin";break; case "2" : $hari="selasa break; "; case "3" : $hari="rabu";break; case "4" : $hari="kamis";break; case "5" : $hari="jumat";break; case "6" : $hari="sabtu";break; switch (date("m")) { case "1" : $bulan="januari";break; case "2" : $bulan="februari";break; case "3" : $bulan="maret";break; case "4" : $bulan="april";break; case "5" : $bulan="mei";break; case "6" : $bulan="juni";break; case "7" : $bulan="juli";break; case "8" : $bulan="agustus";break; case "9" : $bulan="september break; "; case "10" : $bulan="oktober";break;

2 case "11" : $bulan="november";break; case "12" : $bulan="desember";break; $inddate="$hari ".", ". date("d")." $bulan". date(" Y "); echo $inddate;?> 3. Default.css body { margin: 0; padding: 0; background: # repeat left top; font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; font-size: 13px; color: #AF9371; h1, h2, h3 { margin-top: 0; h1 { font-size: 1.6em; font-weight: normal; h2 { font-size: 1.6em;

3 h3 { font-size: 1em; ul { font: "Courier New", Courier, monospace; a { text-decoration: none; color: #AF9371; a:hover { border-bottom: none; a img { border: none; img.left { float: left; margin: 0 20px 0 0; img.right {

4 float: right; margin: px; /* Header */ #header { width: 1024px; margin: 0 auto; height: 190px; background: url(images/header.jpg) repeat-x left top; #logo { width: 970px; height: 150px; margin: 0 auto; padding: 0 10px; /* Menu */ #menu { width: 1000px; margin: 0 auto; padding: 10px 0; height: 30px;

5 #menu ul { margin: 0; padding: 0; list-style: none; #menu li { display: inline; #menu a { display: block; float: left; margin: 0 3px 0 0; padding: 6px 15px 10px 20px; border-right: 1px # solid; text-decoration: none; text-transform: uppercase; font-family: Arial, Helvetica, sans-serif; font-size: 10px; color: #AF9371; #menu a:hover { margin: 0 3px 0 0;

6 color: #AF9371; #menu.current_page_item a { margin: 0 3px 0 0; color: #AF9371; /* Wrapper */ #wrapper { /* Page */ #page { width: 1024px; margin: 0 auto; padding: 15px 0 0 0; background: #000000; #page-bg { /* Latest Post */

7 #latest-post { padding: 20px; border: 1px solid #E7E7E7; /* Content */ #cape { float: center; width: 560px; #content { float: left; width: 580px;.post { padding-bottom: 15px; line-height: 200%;.post h1 { font-weight: normal;.title {

8 margin: 0; padding: 10px px; font-weight: normal;.title a { border-bottom: none; color: #AF9371;.title a:hover { border-bottom: 1px dotted #000000;.byline { border-bottom: 2px solid #000000; margin: -10px 20px 20px 20px;.tag { padding: 0 15px;.entry { padding: 0 20px; text-align: justify;

9 .links { padding: 4px 20px; text-align: left; font-weight: bold; background: #000000;.links a { border: none;.links a:hover { /* Sidebars */ #sidebar1 { float: left; #sidebar2 { float: right;.sidebar { float: left;

10 width: 200px; padding: 0; font-size: 12px;.sidebar ul { margin: 0; padding: 0; list-style: none;.sidebar li { padding: px 0;.sidebar li ul { padding: 5px 5px;.sidebar li li { margin: 0 20px 0 15px; padding: 8px 0px; border-bottom: 1px # dashed;.sidebar li h2 {

11 margin: ; padding: 3px 3px; background: #423525; font-size: 12px; color: #AF9371;.sidebar a { color: #AF9371; /* Search */ #searchform { margin: 0; padding: ; #searchform br { display: none; /* Footer */ #footer { width: 1024px;

12 height: 60px; margin: 0 auto; background: url(images/footer.jpg) repeat-x left bottom; border-top: 2px solid #423525; #footer p { margin: 0; padding: 20px 0 0 0; text-align: center; font-size: smaller; color: #FFFFFF; #footer a { color: #FFFFFF; B. Menu Utama 1. Index.php <?php header('location:media.php?media=home');?> 2. Media.php <?php include "./config/koneksi.php";?> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" />

13 <link href="images/osis.jpg" rel="icon" type="image/jpg"/> <title>sma Negeri 1 Julok</title> <meta name="keywords" content="" /> <meta name="cool Black" content="" /> <link href="./default.css" rel="stylesheet" type="text/css" media="screen" /> <style type="text/css">.style1 {color: #AF9371 </style> </head> <body> <div id="header"> <div id="logo"> <div id="menu"> <ul id="main"> <li class="current_page_item"><a href="index.php">homepage</a></li> <li><a href="?media=terbaru">pengumuman Terbaru</a></li> <li><a href="?media=calender">kalender Akademik</a></li> <li><a href="?media=gallery">galeri Photo</a></li> <li><a href="?media=contact">contact Us</a></li> </ul> <p align="right"> <div id="wrapper"> <div id="page"> <div id="sidebar1" class="sidebar"> <ul> <li> <h2><strong>profil Sekolah</strong></h2> <ul> <? include "profil.php"?> </ul>

14 Pelajaran</a></li> </li> </ul> <h2><strong>fasilitas SMA</strong></h2> <ul> <? include "fasilitas.php"?> </ul> <h2><strong>personalia SMA</strong></h2> <ul> <? include "personalia.php"?> </ul> <h2><strong>kesiswaan</strong></h2> <ul> <? include "kesiswaan.php"?> <li><a href="./files/roster.xls">roster </ul> <div id="content"> <div class="entry"> <? include "modul.php"?> <div id="sidebar2" class="sidebar"> <ul> <div class="widget-content"> <?php include "./config/tanggal.php";?> <center> <embed src="images/clock.swf" wmode="transparent" type="application/x-shockwave-flash" width="150" height="100"> </center> <li> <h2>pengumuman Terbaru</h2> <ul> <? include "pengumuman2.php"?> </ul> </li> <li>

15 <h2>artikel</h2> <ul> <? include "artikel.php"?> <center> <embed src="images/ikram.swf" wmode="transparent" type="application/x-shockwave-flash" width="150" height="45"> </center> </ul> </li> </li> <div style="clear: both;"> <div id="footer"> <p class="copyright">created by <a href="">teuku Muarrif Ikramullah» </a>alumni 2004 SMA 1» Julok</p> <div style="text-align: center; font-size: 0.75em;"> Tugas Akhir» " Web Sekolah </body> </html> 3. Pengumuman.php <?php include "config/koneksi.php"; //artikel $pengumuman=mysql_query("select * FROM pengumuman ORDER BY urutan DESC limit 3"); while($r=mysql_fetch_array($pengumuman)){ { $isi = $r['isi']; $cuplikan = array(); $pecahan_kata = explode(" ", $isi);

16 for ($i=0; $i<20; $i++) $cuplikan[$i] = $pecahan_kata[$i]; $cuplikan = implode(" ", $cuplikan); echo '<h3><em><strong><br><li><a href="media.php'.$r['link'].'">'.$r['judul'].' </a></li></br></em></strong></h3>'.'<p>'.$cuplikan.'...</h5></p>'.'<p class="links"><a href="media.php'.$r['link'].'"><blink>...selengkapnya</blink></a></p>'.'<h5>posted '.$r['tanggal'].' By Administrator</h5><hr>';?> 4. Gallery.php <h1 class='title' align='center'>gallery<br>sma Negeri 1 Julok</h1> <br> <table border="0" cellpadding="0"> <caption><strong></strong></caption> <tr> <td width="100%" align="center"><img src="images/1.jpg" name="photoslider" width="580" height="300"></td> </tr> <tr> <td width="100%"><form method="post" name="rotater"> <div align="center"><center><p> <script language="javascript1.1"> var photos=new Array() var which=0 var what=0 //Change the below variables to reference your own images. You may have as many images in the slider as you wish photos[0]="images/1.jpg" photos[1]="images/2.jpg"

17 photos[2]="images/3.jpg" photos[3]="images/4.jpg" photos[4]="images/5.jpg" photos[5]="images/6.jpg" photos[6]="images/7.jpg" photos[7]="images/8.jpg" photos[8]="images/9.jpg" photos[9]="images/10.jpg" photos[10]="images/11.jpg" photos[11]="images/12.jpg" photos[12]="images/13.jpg" photos[13]="images/14.jpg" photos[14]="images/15.jpg" photos[15]="images/16.jpg" photos[16]="images/17.jpg" window.onload=new Function("document.rotater.description.value=text[0]") function backward(){ if (which>0){ window.status='' which-- document.images.photoslider.src=photos[which]; what-- document.rotater.description.value=text[what]; function forward(){ if (which<photos.length-1){ which++ document.images.photoslider.src=photos[which] what++ document.rotater.description.value=text[what]; else window.status='end of gallery' function type() { alert("this textbox will only display default comments")

18 </script> <p><input type="button" value="kembali" name="b2" onclick="backward()"> <input type="button" value="selanjutnya" name="b1" onclick="forward()"><br /> <a href="#" onclick="which=1;what=1;backward();return false"><blink>mulai Dari Awal</blink></a></p> </center> </form> </tr> </td> </table> <p> </p> <p> </p> <p class="links"> </p> <p class="links"> </p> 5. Contact.php <?php include "./config/koneksi.php";?> <div id="content"> <h2 align="center" class="style3"><span class="style7">contact Us</span></h2> <p align="center" class="style3">kritik, Saran atau pengaduan tentang situs SMA N 1 Julok dapat disampaikan kepada kami. Anda bisa meninggalkan pesan lewat formulir di bawah ini.</p> <FORM action="contact3.php" method="post"> <table width="375" height="153" align="center" cellpadding="3" cellspacing="3" bgcolor="#000000"> <tr> <td width="37"><span class="style25 style3">nama</span></td><br> <td width="8"><span class="style25 style3">:</span></td>

19 <td width="298" bgcolor="#000000"><input name="name" type="text" id="name" size="50" maxlength="255"></td> </tr> <tr> <td><span class="style25 style3"> </span></td> <td><span class="style25 style3">:</span></td> <td bgcolor="#000000"><input name=" " type="text" id=" " size="50" maxlength="255"></td> </tr> <tr> <td valign="top"><span class="style25 style3">pesan</span></td> <td valign="top"><span class="style25 style3">:</span></td> <td bgcolor="#000000"><textarea name="message" cols="60" rows="5" id="message"></textarea></td> </tr> <tr> <td> </td> <td> </td> <td><fieldset><legend><input type="submit" name="submit" value="kirim e_mail"></legend></fieldset> </td> </tr> </form> </table> C. Sidebar Kiri 1. Modul.php <?php //home if($_get[media]=='home'){ echo "<div id='content'> <div class='post'> <h1 class='title' align='center'>welcome To SMA N 1 Julok<br>Via Online</h1>

20 <p align='left' class='style13'>assalamu'alaikum Wr. Wb.</p> <p>selamat Datang di Website resmi SMA Negeri 1 Julok. Diharapkan web ini menjadi media informasi bagi semua pihak yang berkepentingan. Kami sangat berkeinginan, keluarga besar SMA Negeri 1 Julok, mulai dari siswa, dewan guru, pegawai, staf pimpinan, komite sekolah, alumni, serta orang tua siswa punya kontribusi kepada web ini. Jadikanlah web ini sebagai media integrasi kita bersama, dikala waktu dan kesempatan tidak memberikan izin kepada kita untuk bertemu. Saran dan kritik yang membangun sangat kami harapkan untuk kemajuan SMA Negeri 1 Julok kedepannya</p> <p align='left' class='style13'>wassalamu'alaikum Wr. Wb.</p> <p align='right' class='style13'>kepala Sekolah</p> <p align='right' class='style13'>dra. Hj. Nursalamah </p> "; elseif($_get[media]=='home') { include "media.php"; //sejarah sma elseif($_get[media]==sejarah){ $menu=mysql_query("select * FROM profil WHERE id='1'"); while($r=mysql_fetch_array($menu)){ echo "<div id='content'> <div class='post'> <h1 class='title' align='center'>sejarah<br>sma Negeri 1 Julok</h1> <p align='justify' class='style13'>$r[static_content]</p> "; //biodata sma elseif($_get[media]==biodata){

21 $menu=mysql_query("select * FROM profil WHERE id='3'"); while($r=mysql_fetch_array($menu)){ echo "<div id='content'> <div class='post'> <h1 class='title' align='center'>identitas<br>sma Negeri 1 Julok</h1> <table width='400' align='center' border='1'> <tr> <td width='112'>nama</td> <td width='201'>: SMA Negeri 1 Julok </td> </tr> <tr> <td>jalan </td> <td>: Buket Siraja </td> </tr> <tr> <td>desa</td> <td>: Buket Siraja</td> </tr> <tr> <td>kecamatan</td> <td>: Julok </td> </tr> <tr> <td>kabupaten</td> <td>: Aceh Timur </td> </tr> <tr> <td>provinsi</td> <td>: Nanggroe Aceh Darussalam </td> </tr> <tr> <td>kode Pos </td> <td>: </td> </tr> <tr> <td>status Sekolah </td> <td>: Negeri </td> </tr> <tr>

22 <td>n S S </td> <td>: </td> </tr> <tr> <td>tipe Sekolah </td> <td>: B </td> </tr> <tr> <td>tahun Didirikan </td> <td>: 1985 </td> </tr> <tr> <td>status Tanah </td> <td>: Hak Milik </td> </tr> </table> <p align='justify' class='style13'>$r[static_content]</p> "; //visi Misi elseif($_get[media]==visimisi){ $menu=mysql_query("select * FROM profil WHERE id='2'"); while($r=mysql_fetch_array($menu)){ echo "<div id='content'> <div class='post'> <h1 class='title' align='center'>visi Dan Misi<br>SMA Negeri 1 Julok</h1> <p align='justify' class='style13'>$r[static_content]</p> "; //fasilitas perpustakaan

23 elseif($_get[media]==perpustakaan){ $menu=mysql_query("select * FROM fasilitas WHERE id='1'"); while($r=mysql_fetch_array($menu)){ echo "<div id='content'> <div class='post'> <h1 class='title' align='center'>perpustakaan<br>sma Negeri 1 Julok</h1> <p align='center' class='style13'><img src='images/$r[gambar]' hspace='10' align='left' width='200' height='100'></p> <p align='justify' class='style13'>$r[static_content]</p> "; //fasilitas laboratorium elseif($_get[media]==laboratorium){ $menu=mysql_query("select * FROM fasilitas WHERE id='2'"); while($r=mysql_fetch_array($menu)){ echo "<div id='content'> <div class='post'> <h1 class='title' align='center'>laboratorium<br>sma Negeri 1 Julok</h1> <p align='center' class='style13'><img src='images/$r[gambar]' hspace='10' align='left' width='200' height='100'></p> <p align='justify' class='style13'>$r[static_content]</p> "; //fasilitas mushalla elseif($_get[media]==mushalla){ $menu=mysql_query("select * FROM fasilitas WHERE id='3'"); while($r=mysql_fetch_array($menu)){ echo "<div id='content'> <div class='post'>

24 <h1 class='title' align='center'>mushalla<br>sma Negeri 1 Julok</h1> <p align='center' class='style13'><img src='images/$r[gambar]' hspace='10' align='left' width='200' height='100'></p> <p align='justify' class='style13'>$r[static_content]</p> "; //struktur organisasi elseif($_get[media]==struktur){ $menu=mysql_query("select * FROM personalia WHERE id='1'"); while($r=mysql_fetch_array($menu)){ echo "<div id='content'> <div class='post'> <h1 class='title' align='center'>struktur Organisasi<br>SMA Negeri 1 Julok</h1> <p align='center' class='style13'><img src='images/$r[gambar]' hspace='10' align='center' width='500' height='300'></p> "; //data kepsek elseif($_get[media]==datakepsek){ $menu=mysql_query("select * FROM dbguru WHERE id='1'"); while($r=mysql_fetch_array($menu)){ echo "<div id='content'> <div class='post'> <h1 align='center' class='title' >Kepala Sekolah<br>SMA Negeri 1 Julok</h1> <p align='center' class='style13'><img src='images/$r[gambar]' hspace='10' align='left' width='100' height='175'></p> <table width='380' align='left' border='0'> <tr>

25 <td width='160'>nama</td> <td width='200'>: Dra. Hj. Nursalamah </td> </tr> <tr> <td>nip </td> <td>: </td> </tr> <tr> <td>tempat,tanggal Lahir</td> <td>: Blang Pauh, </td> </tr> <tr> <td>jenis Kelamin</td> <td>: Perempuan </td> </tr> <tr> <td>agama</td> <td>: Islam </td> </tr> <tr> <td>pendidikan Terakhir</td> <td>: S-1 </td> </tr> <tr> <td>golongan </td> <td>: IV /a </td> </tr> </table> "; //Daftar staff dan pegawai elseif($_get[media]==guru){ include "guru.php"; //Daftar siswa elseif($_get[media]==siswa){ include "siswa.php";

26 //calender elseif($_get[media]==calender){ $menu=mysql_query("select * FROM calender"); while($r=mysql_fetch_array($menu)){ echo "<div id='content'> <div class='post'> <h1 class='title' align='center'>$r[judul]</h1> <p align='center' class='style13'><img src='images/$r[gambar]' hspace='10' align='center' width='500' height='600'></p> "; //pengumuman terbaru elseif($_get[media]==terbaru){ include "pengumuman.php"; //artikel dan pengumuman elseif($_get[media]==sdsd){ $menu=mysql_query("select * FROM pengumuman WHERE id='4'"); while($r=mysql_fetch_array($menu)){ echo "<div id='content'> <div class='post'> <h1 class='title' align='center'><ul>$r[judul]</ul></h1> <p align='justify' class='style13'>$r[isi]</p> "; elseif($_get[media]==un){ $menu=mysql_query("select * FROM pengumuman WHERE id='1'");

27 while($r=mysql_fetch_array($menu)){ echo "<div id='content'> <div class='post'> <h1 class='title' align='center'>$r[judul]</h1> <p align='justify' class='style13'>$r[isi]</p> "; elseif($_get[media]==pengumuman){ $menu=mysql_query("select * FROM pengumuman WHERE id='2'"); while($r=mysql_fetch_array($menu)){ echo "<div id='content'> <div class='post'> <h1 class='title' align='center'>$r[judul]</h1> <p align='justify' class='style13'>$r[isi]</p> "; elseif($_get[media]==set){ $menu=mysql_query("select * FROM pengumuman WHERE id='3'"); while($r=mysql_fetch_array($menu)){ echo "<div id='content'> <div class='post'> <h1 class='title' align='center'>$r[judul]</h1> <p align='justify' class='style13'>$r[isi]</p> "; elseif($_get[media]==nge){ $menu=mysql_query("select * FROM artikel WHERE id='1'"); while($r=mysql_fetch_array($menu)){ echo "<div id='content'> <div class='post'> <h1 class='title' align='center'>$r[judul]</h1>

28 <p align='justify' class='style13'>$r[isi]</p> "; elseif($_get[media]==asa){ $menu=mysql_query("select * FROM artikel WHERE id='2'"); while($r=mysql_fetch_array($menu)){ echo "<div id='content'> <div class='post'> <h1 class='title' align='center'>$r[judul]</h1> <p align='justify' class='style13'>$r[isi]</p> "; //gallery elseif($_get[media]==gallery){ include "gallery.php"; elseif($_get[media]==gallery){ $menu=mysql_query("select * FROM gallery"); while($r=mysql_fetch_array($menu)){ echo "<div id='content'> <div class='post'> <p align='justify' class='style13'>$r[nama]</p> "; //bimbingan konseling elseif($_get[media]==konseling){ $menu=mysql_query("select * FROM kesiswaan WHERE id='4'"); while($r=mysql_fetch_array($menu)){ echo "<div id='content'> <div class='post'>

29 <h1 class='title' align='center'>bimbingan Konseling<br>SMA Negeri 1 Julok</h1> <p align='justify' class='style13'>$r[static_content]</p> "; //Prestasi elseif($_get[media]==prestasi){ $menu=mysql_query("select * FROM kesiswaan WHERE id='2'"); while($r=mysql_fetch_array($menu)){ echo "<div id='content'> <div class='post'> <h1 class='title' align='center'>$r[nama]<br>sma Negeri 1 Julok</h1> <p align='justify' class='style13'>$r[static_content]</p> "; //contact us elseif($_get[media]==login) { include "login.php"; //contact us elseif($_get[media]==contact) { include "contact.php"; ]</td></tr>"; echo "</tr></table>"; echo "<tr><td class=back><br> [ <a href=javascript:history.go(-1)>kembali</a>?>

30 2. Profil.php <?php //profil $profil=mysql_query("select * FROM profil ORDER BY urutan"); while($r=mysql_fetch_array($profil)){ echo "<li><a href=$r[link]> $r[nama]</a></li>";?> 3. Fasilitas.php <?php //fasilitas $fasilitas=mysql_query("select * FROM fasilitas ORDER BY urutan"); while($r=mysql_fetch_array($fasilitas)){ echo "<li><a href=$r[link]> $r[nama]</a></li>";?> 4. Personalia.php <?php //personalia $personalia=mysql_query("select * FROM personalia ORDER BY urutan"); while($r=mysql_fetch_array($personalia)){ echo "<li><a href=$r[link]> $r[nama]</a></li>";?> 5. Kesiswaan.php <?php //kesiswaan $kesiswaan=mysql_query("select * FROM kesiswaan ORDER BY urutan"); while($r=mysql_fetch_array($kesiswaan)){

31 echo "<li><a href=$r[link]> $r[nama]</a></li>";?> D. Sidebar Kanan 1. Pengumuman2.php <?php include "config/koneksi.php"; //pengumuman $pengumuman=mysql_query("select * FROM pengumuman ORDER BY urutan DESC LIMIT 2"); while($r=mysql_fetch_array($pengumuman)){ echo "<li><a href=$r[link]> $r[judul]</a></li>";?> 2. Artikel.php <?php include "config/koneksi.php"; //artikel $berita=mysql_query("select * FROM artikel ORDER BY urutan"); while($r=mysql_fetch_array($berita)){ echo "<li><a href=$r[link]> $r[judul]</a></li>";?> E. Admin 1. Index.php <?php include "../config/koneksi.php"; include "./check.php"; $admin_id=$_session['admin']; $isi=$_get['isi']; session_start();?> <html> <head>

32 <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <link href="../images/osis.jpg" rel="icon" type="image/jpg"/> <title>sma Negeri 1 Julok</title> <meta name="keywords" content="" /> <meta name="cool Black" content="" /> <link href="../default.css" rel="stylesheet" type="text/css" media="screen" /> <style type="text/css"> <!--.style1 {color: #AF > </style> </head> <body> <div id="header"> <div id="logo"> <div id="menu"> <ul id="main"> </ul> <p align="right"> <div id="wrapper" align="center"> <div id="page"> <center> <div id="content"> <div class="entry"> </center> <br> <br> <?php include "../config/tanggal.php";?> <center>

33 <embed src="../images/5010-blue.swf" wmode="transparent" type="application/x-shockwave-flash" width="150" height="45"> </center> <h2>administrator Login Area </h2> <form action="check.php" method="post" name="login"> <table width="192" height="79" border="0"> <tr> <a> <td width="54" height="40">username</td> </a> <td width="10"><b>:</b></td> <td width="159"><input name="username" type="text" size="20" maxlength="20" /></td> </tr> <tr> <a> <td height="31">password</td> </a> <td><b>:</b></td> <td><input name="password" type="password" size="20" maxlength="20" /></td> </tr> </table> <legend><p align="center"><input name="login" type="submit" id="login" value=" Login "></p></legend> <p>* This Page Just For Admin</p> </p></form> <div id="sidebar2" class="sidebar"> <ul> <br> <br> <br> <br> <br>

34 <br> </li> <div style="clear: both;"> <div id="footer"> <p class="copyright">created by <a href="teuku_muarrif_ikramullah.php">teuku Muarrif Ikramullah» </a>alumni 2004 SMA 1» Julok</p> <div style="text-align: center; font-size: 0.75em;"> Tugas Akhir» " Web Sekolah </body> </html> 2. Media <?php include "../config/koneksi.php"; include "./check.php"; $admin_id=$_session['admin']; $isi=$_get['isi']; session_start();?> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <link href="../images/osis.jpg" rel="icon" type="image/jpg"/> <title>sma Negeri 1 Julok</title> <meta name="keywords" content="" /> <meta name="cool Black" content="" /> <link href="../default.css" rel="stylesheet" type="text/css" media="screen" /> <style type="text/css">

35 <!--.style1 {color: #AF > </style> </head> <body> <div id="header"> <div id="logo"> <div id="menu"> <ul id="main"> <li class="current_page_item"><a href="?media=home">homepage</a></li> <li> <a href="?media=kepsek">manage Kepala Sekolah</a></li> <li> <a href="?media=guru">manage Guru</a> </li> <li> <a href="?media=pengumuman">manage Pengumuman</a></li> <li> <a href="?media=artikel">manage Artikel</a></li> <li> <a href="?media=contact">manage Contact</a></li> <li> <a href="?media=logout">log Out</a></li> </ul> <p align="right"> <div id="wrapper"> <div id="page"> <div id="content"> <div class="entry"> <?php include "modul.php";?>

36 <div id="sidebar2" class="sidebar"> <ul> <div class="widget-content"> <?php include "../config/tanggal.php";?> <embed src="../images/clock.swf" wmode="transparent" type="application/x-shockwave-flash" width="150" height="100"> <li> <a href="?media=kepsek">manage Kepala Sekolah</a></li> <li> <a href="?media=guru">manage Guru</a> </li> <li> <a href="?media=pengumuman">manage Pengumuman</a></li> <li> <a href="?media=artikel">manage Artikel</a></li> <li> <a href="?media=contact">manage Contact</a></li> </li> <div style="clear: both;"> <div id="footer"> <p class="copyright">created by <a href="teuku_muarrif_ikramullah.php">teuku Muarrif Ikramullah» </a>alumni 2004 SMA 1» Julok</p> <div style="text-align: center; font-size: 0.75em;"> Tugas Akhir» " Web Sekolah </body> </html>

37 3. Modul.php <?php include "../config/koneksi.php"; //home if($_get[media]=='home'){ echo "<div id='content'> <div class='entry'> <br><br><br><br><br><br> <h1 align='center' class='style1'>selamat Datang Di Admin Area</h1> <h1 align='center' class='style1'>manage Semua Data dari Menu-menu di Samping</h1> "; elseif ($_GET[media]=='home'){ include "media.php"; elseif ($_GET[media]=='guru'){ include "data_guru.php"; elseif ($_GET[media]=='kepsek'){ include "data_kepsek.php"; elseif ($_GET[media]=='pengumuman'){ include "data_pengumuman.php"; elseif ($_GET[media]=='contact'){ include "data_contact.php"; elseif ($_GET[media]=='logout'){ include "logout.php";?> 4. Check.php <?php session_start(); include "../config/koneksi.php"; if(isset($_post['login'])) {

38 $username = $_POST['username']; $password = $_POST['password']; $sql = mysql_query("select * FROM admin WHERE username='$username' && password='$password'"); $num = mysql_num_rows($sql); $hsl=mysql_fetch_array($sql); if($username==admin) { $username="$hsl[username]"; $password="$hsl[password]"; session_register("admin","password");?><script language="javascript">alert('anda Berada Dalam Kawasan Admin Area'); document.location='media.php?media=home'</script><? else {?><script language="javascript">alert('username Atau Password Salah'); document.location='index.php'</script><??> 5. Data_Artikel.php <?php include "../config/koneksi.php"; $proses = $_GET['media']; if ($proses == 'artikel') $proses = 'media'; switch ($proses) { case 'media': echo '<table border="1" width="600" align="center">'.'<tr align="center" bgcolor="#ffffff">'.'<th>no</th>'

39 .'<th>judul</th>'.'<th>link</th>'.'<th>hapus</th>'.'<th>edit</th>'.'</tr>'; $query=mysql_query("select * from artikel ORDER BY id"); while($a=mysql_fetch_array($query)) { $hapus='<a href="artikel.php?proses=hapus&id='.$a['id'].'">hapus</a>'; $edit='<a href="artikel.php?proses=edit&id='.$a['id'].'">edit</a>'; echo '<tr align="center">'.'<td>'.$a['urutan'].'</td>'.'<td align="left">'.$a['judul'].'</td>'.'<td align="left">'.$a['link'].'</td>'.'<td>'.$hapus.'</td>'.'<td>'.$edit.'</td>'.'</tr>'; echo '</table>'; echo '<br><a href="artikel.php?proses=tambah"><b>tambah Data</b></a>'.'<br>'; break; case 'hapus': $id = $_GET['id']; $hasil = mysql_query("delete FROM artikel WHERE id='$id'"); if (!$hasil) echo "Error: Gagal menghapus dari database."; else echo 'berhasil di hapus <p><a href="home.php?proses=artikel">klik di sini</a></p>'; break; case 'edit': $id = $_GET['id']; $hasil = mysql_query("select * FROM artikel WHERE id='$id'"); $data = mysql_fetch_array($hasil);

40 echo '<h2>edit </h2><hr>'.'<form action="artikel.php?proses=proses_edit&id='.$id.'" method="post">'.'<input type="hidden" name"id" value="'.$data['id'].'">'.'nama : <br>'.'<textarea name="nama" cols=50 rows=1>'.$data['nama'].'</textarea><br><br>'.'link : <br>'.'<input type="text" name="link" size="50" value='.$data['link'].'><br><br>'.'keterangan : <br>'.'<textarea name=keterangan cols=94 rows=25>'.$data['keterangan'].'</textarea><br><br>'.'<input type="submit" value="edit Data"><br>'.'</form>'.'<p><a href="home.php?proses=artikel"> Tampilkan Daftar </a></p>'; break; case 'proses_edit': $id = $_GET['id']; $nama = $_POST['nama']; $link = $_POST['link']; $keterangan = $_POST['keterangan']; $query = "UPDATE artikel SET nama='$nama', link='$link', keterangan='$keterangan' WHERE id='$id'"; $hasil = mysql_query($query); if (!$hasil) echo 'Error: Gagal mengupdate database'; else echo " $nama"; echo 'Berhasil diupdate. <a href="home.php?proses=artikel">tampilkan Daftar</a>'; break; case 'tambah': echo '<h2>tambah</h2><hr>'.'<form action="artikel.php?proses=proses_tambah" method="post">'.'nama : <br>'.'<input type="text" name="nama" size="50"><br><br>'

41 .'Link : <br>'.'<input type="text" name="link" size="50"><br><br>'.'urutan : <br>'.'<input type="text" name="urutan" size="50"><br><br>'.'keterangan : <br>'.'<textarea name="keterangan" cols=94 rows=30></textarea><br><br>'.'<tr><td><input type="submit" value="tambah"></td></tr>'.'</form>'.'<p><a href="home.php?proses=artikel">tampilkan Daftar</a></p>'; break; case 'proses_tambah': $nama = $_POST['nama']; $link = $_POST['link']; $urutan = $_POST['urutan']; $keterangan = $_POST['keterangan']; foreach ($_POST as $field) { if ($field == ''!isset($field)) exit ('Error : Ada data yang masih kosong'); $query = "INSERT INTO artikel (nama, link, urutan, keterangan) VALUES ('$nama', '$link', '$urutan', '$keterangan')"; $hasil = mysql_query($query); if (!$hasil) echo 'Error: Tidak dapat memasukkan ke dalam database.'; else echo 'Berita berhasil ditambah ke database. <a href="home.php?proses=artikel">lihat</a>'; break; mysql_close();?> 6. Data_Contact.php

42 <?php include '../config/koneksi.php'; $table = contact; $hal = $_GET[hal]; if(!isset($_get['hal'])){ $page = 1; else { $page = $_GET['hal']; $max_results = 10; $from = (($page * $max_results) - $max_results); $sql = mysql_query("select * FROM $table ORDER BY id LIMIT $from, $max_results "); $hapus='<a href="data_contact.php?media=hapus&id='.$a['id'].'">hapus</a>'; $edit='<a href="data_contact.php?media=edit&id='.$a['id'].'">edit</a>'; while($row = mysql_fetch_array($sql)){?> <?php echo $row[1]?><br> <?php echo $row[2]?></a><br /> <?php echo $row[3]?> <hr> <?php $total_results = mysql_result(mysql_query("select COUNT(*) as Num FROM $table"),0); $total_pages = ceil($total_results / $max_results); echo "<center>select a Page<br />"; if($hal > 1){ $prev = ($page - 1);

43 echo "<a href=$_server[php_self]?hal=$prev> <-Previous </a> "; for($i = 1; $i <= $total_pages; $i++){ if(($hal) == $i){ echo "$i "; else { echo "<a href=$_server[php_self]?hal=$i>$i</a> "; // Build Next Link if($hal < $total_pages){ $next = ($page + 1); echo "<a href=$_server[php_self]?hal=$next>next-></a>"; echo "</center>";?> 7. Data_Guru.php <?php include "../config/koneksi.php"; $proses = $_GET['media']; if ($proses == 'guru') $proses = 'media'; switch ($proses) { case 'media': echo '<table border="1" width="800" align="center">'.'<tr align="center" bgcolor="#ffffff">'.'<th>nama </th>'.'<th>nip</th>'.'<th>ttl</th>'.'<th>jk</th>'.'<th>agama</th>'.'<th>edit</th>'.'<th>hapus</th>'.'</tr>'; $query=mysql_query("select * from dbguru ORDER BY id"); while($a=mysql_fetch_array($query))

44 { $hapus='<a href="data_guru.php?media=hapus&id='.$a['id'].'">hapus</a>'; $edit='<a href="data_guru.php?media=edit&id='.$a['id'].'">edit</a>'; echo '<tr align="center">'.'<td>'.$a['nama'].'</td>'.'<td>'.$a['nip'].'</td>'.'<td>'.$a['ttl'].'</td>'.'<td>'.$a['jk'].'</td>'.'<td>'.$a['agama'].'</td>'.'<td>'.$edit.'</td>'.'<td>'.$hapus.'</td>'.'</tr>'; echo '</table>'; echo '<br><a href="data_guru.php?media=tambah"><b>tambah Data</b></a>'; break; case 'hapus': $nm = $_GET['id']; $hasil = mysql_query("delete FROM dbguru WHERE id='$id'"); if (!$hasil) echo "Error: Gagal menghapus dari database."; else echo 'berhasil di hapus <p><a href="media.php?media=guru">klik di sini</a></p>'; break; case 'edit': $id = $_GET['id']; $hasil = mysql_query("select * FROM dbguru WHERE id='$id'"); $data = mysql_fetch_array($hasil); echo '<h2>edit </h2><hr>'.'<form action="data_guru.php?media=media_edit&id='.$id.'" method="post">'

45 .'<input type="hidden" name"id" value="'.$data['id'].'">'.'nama: <br>'.'<input type="text" name="nama" size="50" maxlength="100" value='.$data['nama'].'><br><br>'.'nip: <br>'.'<input type="text" name="nip" size="50" value='.$data['nip'].'><br><br>'.'ttl: <br>'.'<input type="text" name="ttl" size="50" value='.$data['ttl'].'><br><br>'.'jk: <br>'.'<input type="text" name="jk" size="50" value='.$data['jk'].'><br><br>'.'agama: <br>'.'<input type="text" name="agama" size="50" value='.$data['agama'].'><br><br>'.'pendidikan Terakhir: <br>'.'<input type="text" name="pendidikan" size="50" value='.$data['pendidikan'].'><br><br>'.'jabatan: <br>'.'<input type="text" name="jabatan" size="50" value='.$data['jabatan'].'><br><br>'.'golongan: <br>'.'<input type="text" name="gol" size="50" value='.$data['gol'].'><br><br>'.'gaji: <br>'.'<input type="text" name="gaji" size="50" value='.$data['gaji'].'><br><br>'.'mulai Tanggal: <br>'.'<input type="text" name="mulai" size="50" value='.$data['mulai'].'><br><br>'.'<input type="submit" value="edit Data"><br>'.'</form>'; break; case 'media_edit': $id = $_GET['id']; $nama = $_POST['nama']; $nip = $_POST['nip']; $ttl = $_POST['ttl']; $jk = $_GET['jk'];

46 $agama = $_POST['agama']; $pendidikan = $_POST['pendidikan']; $jabatan = $_POST['jabatan']; $gol = $_GET['gol']; $gaji = $_POST['gaji']; $mulai = $_POST['mulai']; $query = "UPDATE dbguru SET nama='$nama', nip='$nip', ttl='$ttl', jk='jk', agama='agama', pendidikan='pendidikan', jabatan='jabatan', gol='gol', gaji='gaji', mulai='mulai' WHERE id='$id'"; $hasil = mysql_query($query); if (!$hasil) echo 'Error: Gagal mengupdate database'; else echo 'Berhasil diupdate. <a href="media.php?media=guru">tampilkan Data Guru</a>'; break; case 'tambah': echo '<h2>tambah</h2><hr>'.'<form action="data_guru.php?media=guru" method="post">'.'name: <br><input type="text" name="nama" size="50"><br><br>'.'nip: <br><input type="text" name="nip" size="50"><br><br>'.'ttl: <br><input type="text" name="ttl" size="50"><br><br>'.'jk: <br><input type="text" name="jk" size="50"><br><br>'.'agama: <br><input type="text" name="agama" size="50"><br><br>'.'pendidikan: <br><input type="text" name="pendidikan" size="50"><br><br>'.'jabatan: <br><input type="text" name="jabatan" size="50"><br><br>'.'gol: <br><input type="text" name="gol" size="50"><br><br>'.'gaji: <br><input type="text" name="gaji" size="50"><br><br>'.'mulai: <br><input type="text" name="mulai" size="50"><br><br>'.'<tr><td><input type="submit" value="tambah"></td></tr>'

47 break;.'</form>' ; case 'media_tambah': $nama = $_POST['nama']; $nip = $_POST['nip']; $ttl = $_POST['ttl']; $jk = $_POST['jk']; $agama = $_POST['agama']; $pendidikan = $_POST['pendidikan']; $jabatan = $_POST['jabatan']; $gol = $_POST['gol']; $gaji = $_POST['gaji']; $mulai = $_POST['mulai']; foreach ($_POST as $field) { if ($field == ''!isset($field)) exit ('Error : Ada data yang masih kosong'); $query = "INSERT INTO dbguru (nama, nip, ttl, jk, agama, pendidikan, jabatan, gol, gaji, mulai) VALUES ('$nama', '$nip', '$ttl', '$jk', '$agama', '$pendidikan', '$jabatan', '$gol', '$gaji', '$mulai')"; $hasil = mysql_query($query); if (!$hasil) echo 'Error: Tidak dapat memasukkan ke dalam database.'; else echo 'Berita berhasil ditambah ke database. <a href="media.php?media=guru">lihat</a>'; break; mysql_close();?> 8. Data_Kepsek.php <?php include "../config/koneksi.php";

48 $proses = $_GET['media']; if ($proses == 'kepsek') $proses = 'media'; switch ($proses) { case 'media': echo '<table border="1" width="800" align="center">'.'<tr align="center" bgcolor="#ffffff">'.'<th>nama </th>'.'<th>nip</th>'.'<th>ttl</th>'.'<th>jk</th>'.'<th>agama</th>'.'<th>edit</th>'.'<th>hapus</th>'.'</tr>'; $query=mysql_query("select * from dbguru WHERE jabatan='kepala Sekolah'"); while($a=mysql_fetch_array($query)) { $hapus='<a href="data_kepsek.php?media=hapus&id='.$a['id'].'">hapus</a>'; $edit='<a href="data_kepsek.php?media=edit&id='.$a['id'].'">edit</a>'; echo '<tr align="center">'.'<td>'.$a['nama'].'</td>'.'<td>'.$a['nip'].'</td>'.'<td>'.$a['ttl'].'</td>'.'<td>'.$a['jk'].'</td>'.'<td>'.$a['agama'].'</td>'.'<td>'.$edit.'</td>'.'<td>'.$hapus.'</td>'.'</tr>'; echo '</table>'; echo '<br><a href="data_kepsek.php?media=tambah"><b>tambah Data</b></a>';

49 break; case 'hapus': $nm = $_GET['id']; $hasil = mysql_query("delete FROM dbguru WHERE id='$id'"); if (!$hasil) echo "Error: Gagal menghapus dari database."; else echo 'berhasil di hapus <p><a href="data_kepsek.php">klik di sini</a></p>'; break; case 'edit': $id = $_GET['id']; $hasil = mysql_query("select * FROM dbguru WHERE id='$id'"); $data = mysql_fetch_array($hasil); echo '<h2>edit </h2><hr>'.'<form action="data_kepsek.php?media=media_edit&id='.$id.'" method="post">'.'<input type="hidden" name"id" value="'.$data['id'].'">'.'nama: <br>'.'<input type="text" name="nama" size="50" maxlength="100" value='.$data['nama'].'><br><br>'.'nip: <br>'.'<input type="text" name="nip" size="50" value='.$data['nip'].'><br><br>'.'ttl: <br>'.'<input type="text" name="ttl" size="50" value='.$data['ttl'].'><br><br>'.'jk: <br>'.'<input type="text" name="jk" size="50" value='.$data['jk'].'><br><br>'.'agama: <br>'.'<input type="text" name="agama" size="50" value='.$data['agama'].'><br><br>'.'pendidikan Terakhir: <br>'.'<input type="text" name="pendidikan" size="50" value='.$data['pendidikan'].'><br><br>'

50 .'Jabatan: <br>'.'<input type="text" name="jabatan" size="50" value='.$data['jabatan'].'><br><br>'.'golongan: <br>'.'<input type="text" name="gol" size="50" value='.$data['gol'].'><br><br>'.'gaji: <br>'.'<input type="text" name="gaji" size="50" value='.$data['gaji'].'><br><br>'.'mulai Tanggal: <br>'.'<input type="text" name="mulai" size="50" value='.$data['mulai'].'><br><br>'.'<input type="submit" value="edit Data"><br>'.'</form>'.'<p><a href="data_kepsek.php"> Tampilkan Daftar Guru</a></p>'; break; case 'media_edit': $id = $_GET['id']; $nama = $_POST['nama']; $mata_pelajaran = $_POST['nip']; $unit = $_POST['ttl']; $id = $_GET['jk']; $nama = $_POST['agama']; $mata_pelajaran = $_POST['pendidikan']; $unit = $_POST['jabatan']; $id = $_GET['gol']; $nama = $_POST['gaji']; $mata_pelajaran = $_POST['mulai']; $query = "UPDATE dbguru SET nama='$nama', nip='$nip', ttl='$ttl', jk='jk', agama='agama', pendidikan='pendidikan', jabatan='jabatan', gol='gol', gaji='gaji', mulai='mulai' WHERE id='$id'"; $hasil = mysql_query($query); if (!$hasil) echo 'Error: Gagal mengupdate database'; else echo 'Berhasil diupdate. <a href="data_kepsek.php">tampilkan Daftar Guru</a>'; break;

51 case 'tambah': echo '<h2>tambah</h2><hr>'.'<form action="data_kepsek.php?media=kepsek" method="post">'.'name: <br><input type="text" name="nama" size="50"><br><br>'.'nip: <br><input type="text" name="nip" size="50"><br><br>'.'ttl: <br><input type="text" name="ttl" size="50"><br><br>'.'jk: <br><input type="text" name="jk" size="50"><br><br>'.'agama: <br><input type="text" name="agama" size="50"><br><br>'.'pendidikan: <br><input type="text" name="pendidikan" size="50"><br><br>'.'jabatan: <br><input type="text" name="jabatan" size="50"><br><br>'.'gol: <br><input type="text" name="gol" size="50"><br><br>'.'gaji: <br><input type="text" name="gaji" size="50"><br><br>'.'mulai: <br><input type="text" name="mulai" size="50"><br><br>'.'<tr><td><input type="submit" value="tambah"></td></tr>'.'</form>' ; break; case 'media_tambah': $nama = $_POST['nama']; $nip = $_POST['nip']; $ttl = $_POST['ttl']; $jk = $_POST['jk']; $agama = $_POST['agama']; $pendidikan = $_POST['pendidikan']; $jabatan = $_POST['jabatan']; $gol = $_POST['gol']; $gaji = $_POST['gaji']; $mulai = $_POST['mulai']; foreach ($_POST as $field)

52 { if ($field == ''!isset($field)) exit ('Error : Ada data yang masih kosong'); $query = "INSERT INTO dbguru (nama, nip, ttl, jk, agama, pendidikan, jabatan, gol, gaji, mulai) VALUES ('$nama', '$nip', '$ttl', '$jk', '$agama', '$pendidikan', '$jabatan', '$gol', '$gaji', '$mulai')"; $hasil = mysql_query($query); if (!$hasil) echo 'Error: Tidak dapat memasukkan ke dalam database.'; else echo 'Berita berhasil ditambah ke database. <a href="media.php?media=kepsek">lihat</a>'; break; mysql_close();?> 9. Data_Pengumuman.php <?php include "../config/koneksi.php"; $proses = $_GET['media']; if ($proses == 'pengumuman') $proses = 'media'; switch ($proses) { case 'media': echo '<table border="1" width="600" align="center">'.'<tr align="center" bgcolor="#ffffff">'.'<th>no</th>'.'<th>judul</th>'.'<th>link</th>'.'<th>hapus</th>'.'<th>edit</th>'.'</tr>'; $query=mysql_query("select * from pengumuman ORDER BY id");

53 while($a=mysql_fetch_array($query)) { $hapus='<a href="data_pengumuman.php?proses=hapus&id='.$a['id'].'">hapus</a>'; $edit='<a href="data_pengumuman.php?proses=edit&id='.$a['id'].'">edit</a>'; echo '<tr align="center">'.'<td>'.$a['urutan'].'</td>'.'<td align="left">'.$a['judul'].'</td>'.'<td align="left">'.$a['link'].'</td>'.'<td>'.$hapus.'</td>'.'<td>'.$edit.'</td>'.'</tr>'; echo '</table>'; echo '<br><a href="data_pengumuman.php?proses=tambah"><b>tambah Data</b></a>'.'<br>'; break; case 'hapus': $id = $_GET['id']; $hasil = mysql_query("delete FROM pengumuman WHERE id='$id'"); if (!$hasil) echo "Error: Gagal menghapus dari database."; else echo 'berhasil di hapus <p><a href="media.php?proses=pengumuman">klik di sini</a></p>'; break; case 'edit': $id = $_GET['id']; $hasil = mysql_query("select * FROM pengumuman WHERE id='$id'"); $data = mysql_fetch_array($hasil); echo '<h2>edit </h2><hr>'

54 .'<form action="data_pengumuman.php?proses=proses_edit&id='.$id.'" method="post">'.'<input type="hidden" name"id" value="'.$data['id'].'">'.'judul : <br>'.'<textarea name="judul" cols=50 rows=1>'.$data['judul'].'</textarea><br><br>'.'link : <br>'.'<input type="text" name="link" size="50" value='.$data['link'].'><br><br>'.'keterangan : <br>'.'<textarea name=keterangan cols=94 rows=25>'.$data['keterangan'].'</textarea><br><br>'.'<input type="submit" value="edit Data"><br>'.'</form>'.'<p><a href="media.php?proses=pengumuman"> Tampilkan Daftar </a></p>'; break; case 'proses_edit': $id = $_GET['id']; $judul = $_POST['judul']; $link = $_POST['link']; $keterangan = $_POST['keterangan']; $query = "UPDATE pengumuman SET judul='$judul', link='$link', keterangan='$keterangan' WHERE id='$id'"; $hasil = mysql_query($query); if (!$hasil) echo 'Error: Gagal mengupdate database'; else echo " $judul"; echo 'Berhasil diupdate. <a href="media.php?proses=pengumuman">tampilkan Daftar</a>'; break; case 'tambah': echo '<h2>tambah</h2><hr>'.'<form action="data_pengumuman.php?proses=proses_tambah" method="post">'.'judul : <br>'.'<input type="text" name="judul" size="50"><br><br>'

55 .'Link : <br>'.'<input type="text" name="link" size="50"><br><br>'.'urutan : <br>'.'<input type="text" name="urutan" size="50"><br><br>'.'keterangan : <br>'.'<textarea name="keterangan" cols=94 rows=30></textarea><br><br>'.'<tr><td><input type="submit" value="tambah"></td></tr>'.'</form>'.'<p><a href="media.php?proses=pengumuman">tampilkan Daftar</a></p>'; break; case 'proses_tambah': $judul = $_POST['judul']; $link = $_POST['link']; $urutan = $_POST['urutan']; $keterangan = $_POST['keterangan']; foreach ($_POST as $field) { if ($field == ''!isset($field)) exit ('Error : Ada data yang masih kosong'); $query = "INSERT INTO pengumuman (judul, link, urutan, keterangan) VALUES ('$judul', '$link', '$urutan', '$keterangan')"; $hasil = mysql_query($query); if (!$hasil) echo 'Error: Tidak dapat memasukkan ke dalam database.'; else echo 'Berita berhasil ditambah ke database. <a href="data_pengumuman.php?proses=pengumuman">lihat</a>'; break; mysql_close();?> 10. Logout.php

56 <?php session_start(); session_destroy();?> <script language="javascript"> location.href="../index.php"; </script>

HTML Summary. All of the following are containers. Structure. Italics Bold. Line Break. Horizontal Rule. Non-break (hard) space.

HTML Summary. All of the following are containers. Structure. Italics Bold. Line Break. Horizontal Rule. Non-break (hard) space. HTML Summary Structure All of the following are containers. Structure Contains the entire web page. Contains information

More information

L A M P I R A N. Universitas Sumatera Utara

L A M P I R A N. Universitas Sumatera Utara L A M P I R A N LAMPIRAN 1. Listing Program Aplikasi e-election Berbasis SMS Gateway index.php

More information

Multimedia Systems and Technologies Lab class 6 HTML 5 + CSS 3

Multimedia Systems and Technologies Lab class 6 HTML 5 + CSS 3 Multimedia Systems and Technologies Lab class 6 HTML 5 + CSS 3 Instructions to use the laboratory computers (room B2): 1. If the computer is off, start it with Windows (all computers have a Linux-Windows

More information

LAMPIRAN Kode Program

LAMPIRAN Kode Program 73 LAMPIRAN Kode Program 1. Index.php

More information

<style type="text/css"> <!-- body {font-family: Verdana, Arial, sans-serif} ***set font family for entire Web page***

<style type=text/css> <!-- body {font-family: Verdana, Arial, sans-serif} ***set font family for entire Web page*** Chapter 7 Using Advanced Cascading Style Sheets HTML is limited in its ability to define the appearance, or style, across one or mare Web pages. We use Cascading style sheets to accomplish this. Remember

More information

LAMPIRAN. Index.php. <?php. unset($_session["status"]); //session_destroy(); //session_destroy();

LAMPIRAN. Index.php. <?php. unset($_session[status]); //session_destroy(); //session_destroy(); LAMPIRAN Index.php unset($_session["status"]); //session_destroy(); //session_destroy();?>

More information

5 Snowdonia. 94 Web Applications with C#.ASP

5 Snowdonia. 94 Web Applications with C#.ASP 94 Web Applications with C#.ASP 5 Snowdonia In this and the following three chapters we will explore the use of particular programming techniques, before combining these methods to create two substantial

More information

Web Publishing Intermediate 2

Web Publishing Intermediate 2 Web Publishing Intermediate 2 Building a Three Column Site with divs and float Jeff Pankin Information Services and Technology Table of Contents Course Objectives... 2 The CIG Web Site... 3 Using the Div

More information

CSS Cascading Style Sheets

CSS Cascading Style Sheets CSS Cascading Style Sheets site root index.html about.html services.html stylesheet.css images boris.jpg Types of CSS External Internal Inline External CSS An external style sheet is a text document with

More information

Lab 7 Introduction to MySQL

Lab 7 Introduction to MySQL Lab 7 Introduction to MySQL Objectives: During this lab session, you will - Learn how to access the MySQL Server - Get hand-on experience on data manipulation and some PHP-to-MySQL technique that is often

More information

Santa Tracker. Release Notes Version 1.0

Santa Tracker. Release Notes Version 1.0 Santa Tracker Release Notes Version 1.0 App Parameters and Styling In your Caspio account, go to the App s Overview screen and on the right sidebar click on Manage in the App Parameters area. Edit any

More information

P - 13 Bab 10 : PHP MySQL Lanjut (Studi Kasus)

P - 13 Bab 10 : PHP MySQL Lanjut (Studi Kasus) P - 13 Bab 10 : PHP MySQL Lanjut (Studi Kasus) 10.1 Tujuan Mahasiswa mampu : Mengetahui dan Memahami Integrasi PHP dengan MySQL Mengetahui dan Memahami Relasi Dengan phpmyadmin Designer Mengetahui dan

More information

ToDoList. 1.2 * allow custom user list to be passed in * publish changes to a channel ***/

ToDoList. 1.2 * allow custom user list to be passed in * publish changes to a channel ***/ /*** USAGE: ToDoList() Embed a TODO-list into a page. The TODO list allows users to create new items, assign them to other users, and set deadlines. Items that are due are highlighted in yellow, items

More information

ゼミ Wiki の再構築について 資料編 加納さおり

ゼミ Wiki の再構築について 資料編 加納さおり Wiki [ Fukuda Semi Wiki] [ 2 wiki] [ 3 ] [ 4 ] [ 5 ] [ 6 ] [ 7 ] [ 8 ] [ 9 ] [ 10 ] [ 11 ] [ 12 ] [ 13 ] [ 14 Menu1] [ 15 Menu2] [ 16 Menu3] [ 17 wiki Menu] [ 18 TOP ] [ 19 ] [ 20 ] [ 20] [ 21 ] [ 22 (

More information

APLIKASI BERITA DENGAN PHP DAN MYSQL

APLIKASI BERITA DENGAN PHP DAN MYSQL APLIKASI BERITA DENGAN PHP DAN MYSQL Merancang Struktur Database Membuat File Koneksi Database Membuat Halaman Input Berita Menampilkan Berita Terbaru di Halaman Depan Menampilkan Berita Lengkap Membuat

More information

HTML HTML5. DOM(Document Object Model) CSS CSS

HTML HTML5. DOM(Document Object Model) CSS CSS HTML HTML5 DOM(Document Object Model) CSS CSS HTML html img jpg png gif jpg png gif

More information

1.2 * allow custom user list to be passed in * publish changes to a channel

1.2 * allow custom user list to be passed in * publish changes to a channel ToDoList /*** USAGE: ToDoList() Embed a TODO-list into a page. The TODO list allows users to cre Items that are due are highlighted in yellow, items passed due ar list can be added to any page. The information

More information

CSS: Layout Part 2. clear. CSS for layout and formatting: clear

CSS: Layout Part 2. clear. CSS for layout and formatting: clear CSS: Layout Part 2 Robert A. Fulkerson College of Information Science and Technology http://www.ist.unomaha.edu/ University of Nebraska at Omaha http://www.unomaha.edu/ CSS for layout and formatting: clear

More information

HTML TAG SUMMARY HTML REFERENCE 18 TAG/ATTRIBUTE DESCRIPTION PAGE REFERENCES TAG/ATTRIBUTE DESCRIPTION PAGE REFERENCES MOST TAGS

HTML TAG SUMMARY HTML REFERENCE 18 TAG/ATTRIBUTE DESCRIPTION PAGE REFERENCES TAG/ATTRIBUTE DESCRIPTION PAGE REFERENCES MOST TAGS MOST TAGS CLASS Divides tags into groups for applying styles 202 ID Identifies a specific tag 201 STYLE Applies a style locally 200 TITLE Adds tool tips to elements 181 Identifies the HTML version

More information

Exam II CIS 228: The Internet Prof. St. John Lehman College City University of New York 5 November 2009

Exam II CIS 228: The Internet Prof. St. John Lehman College City University of New York 5 November 2009 Exam II CIS 228: The Internet Prof. St. John Lehman College City University of New York 5 November 2009 NAME (Printed) NAME (Signed) E-mail Exam Rules Show all your work. Your grade will be based on the

More information

Introduction to Web Design CSS Reference

Introduction to Web Design CSS Reference Inline Style Syntax: Introduction to Web Design CSS Reference Example: text Internal Style Sheet Syntax: selector {property: value; Example:

More information

Psychology Experiments on the Web Using PHP and MySQL

Psychology Experiments on the Web Using PHP and MySQL Psychology Experiments on the Web Using PHP and MySQL Lisa M. DeBruine August 14, 2008 Contents 1 Basic Web Authoring 2 1.1 Setting up your webpage....................... 2 1.2 HTML.................................

More information

Introduction to Web Design CSS Reference

Introduction to Web Design CSS Reference Inline Style Syntax: Introduction to Web Design CSS Reference Example: text Internal Style Sheet Syntax: selector {property: value; Example:

More information

Basic CSS Lecture 17

Basic CSS Lecture 17 Basic CSS Lecture 17 Robb T. Koether Hampden-Sydney College Wed, Feb 21, 2018 Robb T. Koether (Hampden-Sydney College) Basic CSSLecture 17 Wed, Feb 21, 2018 1 / 22 1 CSS 2 Background Styles 3 Text Styles

More information

CSS CSS how to display to solve a problem External Style Sheets CSS files CSS Syntax

CSS CSS how to display to solve a problem External Style Sheets CSS files CSS Syntax CSS CSS stands for Cascading Style Sheets Styles define how to display HTML elements Styles were added to HTML 4.0 to solve a problem External Style Sheets can save a lot of work External Style Sheets

More information

GIMP WEB 2.0 MENUS. Web 2.0 Menus: Horizontal Navigation Bar

GIMP WEB 2.0 MENUS. Web 2.0 Menus: Horizontal Navigation Bar GIMP WEB 2.0 MENUS Web 2.0 Menus: Horizontal Navigation Bar WEB 2.0 MENUS: HORIZONTAL NAVIGATION BAR Hover effect: You may create your button in GIMP. Mine is 122 pixels by 48 pixels. You can use whatever

More information

CSS. Lecture 16 COMPSCI 111/111G SS 2018

CSS. Lecture 16 COMPSCI 111/111G SS 2018 CSS Lecture 16 COMPSCI 111/111G SS 2018 No CSS Styles A style changes the way the HTML code is displayed Same page displayed using different styles http://csszengarden.com Same page with a style sheet

More information

Zen Garden. CSS Zen Garden

Zen Garden. CSS Zen Garden CSS Patrick Behr CSS HTML = content CSS = display It s important to keep them separated Less code in your HTML Easy maintenance Allows for different mediums Desktop Mobile Print Braille Zen Garden CSS

More information

recall: a Web page is a text document that contains additional formatting information in the HyperText Markup Language (HTML)

recall: a Web page is a text document that contains additional formatting information in the HyperText Markup Language (HTML) HTML & Web Pages recall: a Web page is a text document that contains additional formatting information in the HyperText Markup Language (HTML) HTML specifies formatting within a page using tags in its

More information

Wireframe :: tistory wireframe tistory.

Wireframe :: tistory wireframe tistory. Page 1 of 45 Wireframe :: tistory wireframe tistory Daum Tistory GO Home Location Tags Media Guestbook Admin 'XHTML+CSS' 7 1 2009/09/20 [ ] XHTML CSS - 6 (2) 2 2009/07/23 [ ] XHTML CSS - 5 (6) 3 2009/07/17

More information

Creating a Job Aid using HTML and CSS

Creating a Job Aid using HTML and CSS Creating a Job Aid using HTML and CSS In this tutorial we will apply what we have learned about HTML and CSS. We will create a web page containing a job aid about how to buy from a vending machine. Optionally,

More information

2004 WebGUI Users Conference

2004 WebGUI Users Conference WebGUI Site Design 2004 WebGUI Users Conference General Rules of Web Design Content is King good content is more important than anything else. keeps people interested. even if your design is bad, content

More information

CSS Lecture 16 COMPSCI 111/111G SS 2018

CSS Lecture 16 COMPSCI 111/111G SS 2018 No CSS CSS Lecture 16 COMPSCI 111/111G SS 2018 Styles Astyle changes the way the HTML code is displayed Same page displayed using different styles Same page with a style sheet body font-family: sans-serif;

More information

CSC 121 Computers and Scientific Thinking

CSC 121 Computers and Scientific Thinking CSC 121 Computers and Scientific Thinking Fall 2005 HTML and Web Pages 1 HTML & Web Pages recall: a Web page is a text document that contains additional formatting information in the HyperText Markup Language

More information

Hoster: openload.co - Free PLUGIN_DEFECT-Error: 08d a1830b60ab13ddec9a2ff6

Hoster: openload.co - Free PLUGIN_DEFECT-Error: 08d a1830b60ab13ddec9a2ff6 JDownloader - Bug #80273 Bug # 75914 (Closed): Hoster: openload.co - Free Hoster: openload.co - Free PLUGIN_DEFECT-Error: 08d9453425a1830b60ab13ddec9a2ff6 08/18/2016 02:13 AM - StatServ Status: Closed

More information

LAMPIRAN. a. Kode Program Untuk Halaman Cari Data Proyek

LAMPIRAN. a. Kode Program Untuk Halaman Cari Data Proyek LAMPIRAN 1. Kode Program a. Kode Program Untuk Halaman Cari Data Proyek

More information

User's Guide Visual Profile Appendix L Version 7.5.2

User's Guide Visual Profile Appendix L Version 7.5.2 User's Guide Visual Profile Appendix L Version 7.5.2 MobilityGuard AB Appendix L Visual Profile v 7.4 Table of Contents 1 Introduction...3 2 Configuration...3 2.1 Select a theme to use...3 2.2 The theme

More information

Signs of Spring App. Release Notes Version 1.0

Signs of Spring App. Release Notes Version 1.0 Signs of Spring App Release Notes Version 1.0 App Parameters and Styling In your Caspio account, go to the App s Overview screen. On the right sidebar, click on Manage in the App Parameters area. Edit

More information

HTML Tags Chart. To use any of the following HTML tags, simply select the HTML code you'd like and copy and paste it into your web page.

HTML Tags Chart. To use any of the following HTML tags, simply select the HTML code you'd like and copy and paste it into your web page. HTML Tags Chart To use any of the following HTML tags, simply select the HTML code you'd like and copy and paste it into your web page. Tag Name Code Example Browser View

More information

Sample Exam 2 (Version 1) CIS 228: The Internet Prof. St. John Lehman College City University of New York 7 November 2007

Sample Exam 2 (Version 1) CIS 228: The Internet Prof. St. John Lehman College City University of New York 7 November 2007 Sample Exam 2 (Version 1) CIS 228: The Internet Prof. St. John Lehman College City University of New York 7 November 2007 NAME (Printed) NAME (Signed) E-mail Exam Rules Show all your work. Your grade will

More information

CS 350 COMPUTER/HUMAN INTERACTION. Lecture 6

CS 350 COMPUTER/HUMAN INTERACTION. Lecture 6 CS 350 COMPUTER/HUMAN INTERACTION Lecture 6 Setting up PPP webpage Log into lab Linux client or into csserver directly Webspace (www_home) should be set up Change directory for CS 350 assignments cp r

More information

Lab 4 CSS CISC1600, Spring 2012

Lab 4 CSS CISC1600, Spring 2012 Lab 4 CSS CISC1600, Spring 2012 Part 1 Introduction 1.1 Cascading Style Sheets or CSS files provide a way to control the look and feel of your web page that is more convenient, more flexible and more comprehensive

More information

Session 4. Style Sheets (CSS) Reading & References. A reference containing tables of CSS properties

Session 4. Style Sheets (CSS) Reading & References.   A reference containing tables of CSS properties Session 4 Style Sheets (CSS) 1 Reading Reading & References en.wikipedia.org/wiki/css Style Sheet Tutorials www.htmldog.com/guides/cssbeginner/ A reference containing tables of CSS properties web.simmons.edu/~grabiner/comm244/weekthree/css-basic-properties.html

More information

A Balanced Introduction to Computer Science, 3/E

A Balanced Introduction to Computer Science, 3/E A Balanced Introduction to Computer Science, 3/E David Reed, Creighton University 2011 Pearson Prentice Hall ISBN 978-0-13-216675-1 Chapter 2 HTML and Web Pages 1 HTML & Web Pages recall: a Web page is

More information

Html basics Course Outline

Html basics Course Outline Html basics Course Outline Description Learn the essential skills you will need to create your web pages with HTML. Topics include: adding text any hyperlinks, images and backgrounds, lists, tables, and

More information

Chapter4: HTML Table and Script page, HTML5 new forms. Asst. Prof. Dr. Supakit Nootyaskool Information Technology, KMITL

Chapter4: HTML Table and Script page, HTML5 new forms. Asst. Prof. Dr. Supakit Nootyaskool Information Technology, KMITL Chapter4: HTML Table and Script page, HTML5 new forms Asst. Prof. Dr. Supakit Nootyaskool Information Technology, KMITL Objective To know HTML5 creating a new style form. To understand HTML table benefits

More information

Chapter 7 BMIS335 Web Design & Development

Chapter 7 BMIS335 Web Design & Development Chapter 7 BMIS335 Web Design & Development Site Organization Use relative links to navigate between folders within your own site o Sometimes dividing your site into folders makes maintenance and updating

More information

GIMP WEB 2.0 MENUS WEB 2.0 MENUS: HORIZONTAL NAVIGATION BAR CREATING AN HTML LIST

GIMP WEB 2.0 MENUS WEB 2.0 MENUS: HORIZONTAL NAVIGATION BAR CREATING AN HTML LIST GIMP WEB 2.0 MENUS Web 2.0 Menus: Horizontal Navigation Bar WEB 2.0 MENUS: HORIZONTAL NAVIGATION BAR Hover effect: CREATING AN HTML LIST Most horizontal or vertical navigation bars begin with a simple

More information

In the early days of the Web, designers just had the original 91 HTML tags to work with.

In the early days of the Web, designers just had the original 91 HTML tags to work with. Web Design Lesson 4 Cascading Style Sheets In the early days of the Web, designers just had the original 91 HTML tags to work with. Using HTML, they could make headings, paragraphs, and basic text formatting,

More information

CSS: Cascading Style Sheets

CSS: Cascading Style Sheets CSS: Cascading Style Sheets Computer Science and Engineering College of Engineering The Ohio State University Lecture 13 Evolution of CSS MIME type: text/css CSS 1 ('96): early recognition of value CSS

More information

Getting your work online. behance.net cargo collective krop coroflot

Getting your work online. behance.net cargo collective krop coroflot Getting your work online behance.net cargo collective krop coroflot behance online presence behance.net has a free and pro version. The free version is fine for getting internships. Free Version Pros networked

More information

Technical Guide Login Page Customization

Technical Guide Login Page Customization Released: 2017-11-15 Doc Rev No: R2 Copyright Notification Edgecore Networks Corporation Copyright 2019 Edgecore Networks Corporation. The information contained herein is subject to change without notice.

More information

EM208: Web Development I 1. EM208: Web Development I. Final Project. Trina VanderLouw. Professor John Basco. Colorado Technical University

EM208: Web Development I 1. EM208: Web Development I. Final Project. Trina VanderLouw. Professor John Basco. Colorado Technical University EM208: Web Development I 1 EM208: Web Development I Final Project Trina VanderLouw Professor John Basco Colorado Technical University March 20, 2011 Highlights: HTML, CSS, Using internal and external links,

More information

CSS: The Basics CISC 282 September 20, 2014

CSS: The Basics CISC 282 September 20, 2014 CSS: The Basics CISC 282 September 20, 2014 Style Sheets System for defining a document's style Used in many contexts Desktop publishing Markup languages Cascading Style Sheets (CSS) Style sheets for HTML

More information

By the end of this section of the practical, the students should be able to:

By the end of this section of the practical, the students should be able to: By the end of this section of the practical, the students should be able to: Connecting to a MySQL database in PHP with the mysql_connect() and mysql_select_db() functions Trapping and displaying database

More information

HTML BEGINNING TAGS. HTML Structure <html> <head> <title> </title> </head> <body> Web page content </body> </html>

HTML BEGINNING TAGS. HTML Structure <html> <head> <title> </title> </head> <body> Web page content </body> </html> HTML BEGINNING TAGS HTML Structure Web page content Structure tags: Tags used to give structure to the document.

More information

주소록만들기 주소록. Input 페이지 Edit 페이지 Del 페이지

주소록만들기 주소록. Input 페이지 Edit 페이지 Del 페이지 주소록프로젝트 주소록만들기 주소록 List 페이지 Input 페이지 Edit 페이지 Del 페이지 Inputpro 페이지 Editpro 페이지 Address_Input.html 주소입력페이지 td,li,input{font-size:9pt} 주소입력

More information

Introduction to using HTML to design webpages

Introduction to using HTML to design webpages Introduction to using HTML to design webpages #HTML is the script that web pages are written in. It describes the content and structure of a web page so that a browser is able to interpret and render the

More information

<body bgcolor=" " fgcolor=" " link=" " vlink=" " alink=" "> These body attributes have now been deprecated, and should not be used in XHTML.

<body bgcolor=  fgcolor=  link=  vlink=  alink= > These body attributes have now been deprecated, and should not be used in XHTML. CSS Formatting Background When HTML became popular among users who were not scientists, the limited formatting offered by the built-in tags was not enough for users who wanted a more artistic layout. Netscape,

More information

2005 WebGUI Users Conference

2005 WebGUI Users Conference Cascading Style Sheets 2005 WebGUI Users Conference Style Sheet Types 3 Options Inline Embedded Linked Inline Use an inline style sheet to modify a single element one time in a page.

More information

Media Stylesheets and Navigation with CSS goodness. Webpage Design

Media Stylesheets and Navigation with CSS goodness. Webpage Design Media Stylesheets and Navigation with CSS goodness Webpage Design Printing web pages the problem Here s a nice enough website that is clearly designed for the screen. The links are there because they work

More information

Lab Introduction to Cascading Style Sheets

Lab Introduction to Cascading Style Sheets Lab Introduction to Cascading Style Sheets For this laboratory you will need a basic text editor and a browser. In the labs, winedt or Notepad++ is recommended along with Firefox/Chrome For this activity,

More information

HTML Tags Chart. To use any of the following HTML tags, simply select the HTML code you'd like and copy and paste it into your web page.

HTML Tags Chart. To use any of the following HTML tags, simply select the HTML code you'd like and copy and paste it into your web page. HTML Tags Chart To use any of the following HTML tags, simply select the HTML code you'd like and copy and paste it into your web page. Tag Name Code Example Browser View

More information

Introduction to Multimedia. MMP100 Spring 2016 thiserichagan.com/mmp100

Introduction to Multimedia. MMP100 Spring 2016 thiserichagan.com/mmp100 Introduction to Multimedia MMP100 Spring 2016 profehagan@gmail.com thiserichagan.com/mmp100 Troubleshooting Check your tags! Do you have a start AND end tags? Does everything match? Check your syntax!

More information

COSC 2206 Internet Tools. CSS Cascading Style Sheets

COSC 2206 Internet Tools. CSS Cascading Style Sheets COSC 2206 Internet Tools CSS Cascading Style Sheets 1 W3C CSS Reference The official reference is here www.w3.org/style/css/ 2 W3C CSS Validator You can upload a CSS file and the validator will check it

More information

Module Contact: Dr Graeme Richards, CMP. Copyright of the University of East Anglia Version 1

Module Contact: Dr Graeme Richards, CMP. Copyright of the University of East Anglia Version 1 UNIVERSITY OF EAST ANGLIA School of Computing Sciences Main Series UG Examination 2015/16 WEB BASED PROGRAMMING CMP-4011A Time allowed: 2 hours Answer BOTH questions in Section A and TWO questions from

More information

Module 2 (VII): CSS [Part 4]

Module 2 (VII): CSS [Part 4] INTERNET & WEB APPLICATION DEVELOPMENT SWE 444 Fall Semester 2008-2009 (081) Module 2 (VII): CSS [Part 4] Dr. El-Sayed El-Alfy Computer Science Department King Fahd University of Petroleum and Minerals

More information

Welcome Please sit on alternating rows. powered by lucid & no.dots.nl/student

Welcome Please sit on alternating rows. powered by lucid & no.dots.nl/student Welcome Please sit on alternating rows powered by lucid & no.dots.nl/student HTML && CSS Workshop Day Day two, November January 276 powered by lucid & no.dots.nl/student About the Workshop Day two: CSS

More information

CSS مفاهیم ساختار و اصول استفاده و به کارگیری

CSS مفاهیم ساختار و اصول استفاده و به کارگیری CSS مفاهیم ساختار و اصول استفاده و به کارگیری Cascading Style Sheets A Cascading Style Sheet (CSS) describes the appearance of an HTML page in a separate document : مسایای استفاده از CSS It lets you separate

More information

PUBLISHER SPECIFIC CSS RULES

PUBLISHER SPECIFIC CSS RULES PUBLISHER SPECIFIC CSS RULES Solita Oy Helsinki Tampere Oulu 26.1.2016 2 (24) Document History Version Date Author Description 0.1 August 17, 2015 J. Similä First draft 0.2 January 26, 2015 A. Autio Fixed

More information

ITS331 IT Laboratory I: (Laboratory #11) Session Handling

ITS331 IT Laboratory I: (Laboratory #11) Session Handling School of Information and Computer Technology Sirindhorn International Institute of Technology Thammasat University ITS331 Information Technology Laboratory I Laboratory #11: Session Handling Creating

More information

CSS. https://developer.mozilla.org/en-us/docs/web/css

CSS. https://developer.mozilla.org/en-us/docs/web/css CSS https://developer.mozilla.org/en-us/docs/web/css http://www.w3schools.com/css/default.asp Cascading Style Sheets Specifying visual style and layout for an HTML document HTML elements inherit CSS properties

More information

Study Guide 2 - HTML and CSS - Chap. 6,8,10,11,12 Name - Alexia Bernardo

Study Guide 2 - HTML and CSS - Chap. 6,8,10,11,12 Name - Alexia Bernardo Study Guide 2 - HTML and CSS - Chap. 6,8,10,11,12 Name - Alexia Bernardo Note: We skipped Study Guide 1. If you d like to review it, I place a copy here: https:// people.rit.edu/~nbbigm/studyguides/sg-1.docx

More information

GIMP WEB 2.0 MENUS. Web 2.0 Menus: Horizontal Navigation Bar with Dynamic Background Image

GIMP WEB 2.0 MENUS. Web 2.0 Menus: Horizontal Navigation Bar with Dynamic Background Image GIMP WEB 2.0 MENUS Web 2.0 Menus: Horizontal Navigation Bar with Dynamic Background Image WEB 2.0 MENUS: HORIZONTAL NAVIGATION BAR DYNAMIC BACKGROUND IMAGE Before you begin this tutorial, you will need

More information

Index. alt, 38, 57 class, 86, 88, 101, 107 href, 24, 51, 57 id, 86 88, 98 overview, 37. src, 37, 57. backend, WordPress, 146, 148

Index. alt, 38, 57 class, 86, 88, 101, 107 href, 24, 51, 57 id, 86 88, 98 overview, 37. src, 37, 57. backend, WordPress, 146, 148 Index Numbers & Symbols (angle brackets), in HTML, 47 : (colon), in CSS, 96 {} (curly brackets), in CSS, 75, 96. (dot), in CSS, 89, 102 # (hash mark), in CSS, 87 88, 99 % (percent) font size, in CSS,

More information

http://nma.kcc.hawaii.edu/gargiulo/data/johndoe/spring/art128/2014/companyname1_step3/index.html 1 2 3 4 5 company Name 6 7

More information

Creating and Building Websites

Creating and Building Websites Creating and Building Websites Stanford University Continuing Studies CS 21 Mark Branom branom@alumni.stanford.edu Course Web Site: http://web.stanford.edu/group/csp/cs21 Week 6 Slide 1 of 28 Week 6 Agenda

More information

CSS. Shan-Hung Wu CS, NTHU

CSS. Shan-Hung Wu CS, NTHU CSS Shan-Hung Wu CS, NTHU CSS Zen Garden 2 Outline The Basics Selectors Layout Stacking Order 3 Outline The Basics Selectors Layout Stacking Order 4 Grammar selector { property: value; 5 Example /* for

More information

Summary 4/5. (contains info about the html)

Summary 4/5. (contains info about the html) Summary Tag Info Version Attributes Comment 4/5

More information

CSS often uses hyphens in CSS property names but JavaScript uses camel case, e.g. color: blue; p { <!DOCTYPE html> <meta charset="utf-8" /> <head>

CSS often uses hyphens in CSS property names but JavaScript uses camel case, e.g. color: blue; p { <!DOCTYPE html> <meta charset=utf-8 /> <head> 1 of 9 CS1116/CS5018 Web Development 2 Dr Derek Bridge School of Computer Science & Information Technology University College Cork Recap To find nodes: queryselector, queryselectorall To create new element

More information

UNIVERSITY OF TORONTO Faculty of Arts and Science APRIL 2016 EXAMINATIONS. CSC309H1 S Programming on the Web Instructor: Ahmed Shah Mashiyat

UNIVERSITY OF TORONTO Faculty of Arts and Science APRIL 2016 EXAMINATIONS. CSC309H1 S Programming on the Web Instructor: Ahmed Shah Mashiyat UNIVERSITY OF TORONTO Faculty of Arts and Science APRIL 2016 EXAMINATIONS CSC309H1 S Programming on the Web Instructor: Ahmed Shah Mashiyat Duration - 2 hours Aid Sheet: Both side of one 8.5 x 11" sheet

More information

CMPT 165: More CSS Basics

CMPT 165: More CSS Basics CMPT 165: More CSS Basics Tamara Smyth, tamaras@cs.sfu.ca School of Computing Science, Simon Fraser University October 14, 2011 1 The Favorites Icon The favorites icon (favicon) is the small icon you see

More information

HTMLnotesS15.notebook. January 25, 2015

HTMLnotesS15.notebook. January 25, 2015 The link to another page is done with the

More information

IBM Bluemix Node-RED Watson Starter

IBM Bluemix Node-RED Watson Starter IBM Bluemix Node-RED Watson Starter Cognitive Solutions Application Development IBM Global Business Partners Duration: 45 minutes Updated: Feb 14, 2018 Klaus-Peter Schlotter kps@de.ibm.com Version 1 Overview

More information

Chapter 7: JavaScript for Client-Side Content Behavior

Chapter 7: JavaScript for Client-Side Content Behavior Chapter 7: JavaScript for Client-Side Content Behavior Overview and Objectives Create a rotating sequence of images (a slide show ) on the home page for our website Use a JavaScript function as the value

More information

Cascading Style Sheets Level 2

Cascading Style Sheets Level 2 Cascading Style Sheets Level 2 Course Objectives, Session 1 Level 1 Quick Review Chapter 6 Revisit: Web Fonts Chapter 8: Adding Graphics to Web Pages Chapter 9: Sprucing Up Your Site s Navigation Begin

More information

ENGINEERING DATA HUB VISUAL DESIGN SPECIFICATIONS VERSION 3. Created: 2/10/2017

ENGINEERING DATA HUB VISUAL DESIGN SPECIFICATIONS VERSION 3. Created: 2/10/2017 ENGINEERING DATA HUB VISUAL DESIGN SPECIFICATIONS VERSION 3 Created: 2/10/2017 Table of Contents ENGINEERING DATA HUB... 1 DESKTOP VIEW... 3 HEADER... 4 Logo... 5 Main Title... 6 User Menu... 7 Global

More information

HTML 5 Tables and Forms

HTML 5 Tables and Forms Tables for Tabular Data Display HTML 5 Tables and Forms Tables can be used to represet information in a two-dimensional format. Typical table applications include calendars, displaying product catelog,

More information

Wanted! Introduction. Step 1: Styling your poster. Activity Checklist. In this project, you ll learn how to make your own poster.

Wanted! Introduction. Step 1: Styling your poster. Activity Checklist. In this project, you ll learn how to make your own poster. Wanted! Introduction In this project, you ll learn how to make your own poster. Step 1: Styling your poster Let s start by editing the CSS code for the poster. Activity Checklist Open this trinket: jumpto.cc/web-wanted.

More information

Using htmlarea & a Database to Maintain Content on a Website

Using htmlarea & a Database to Maintain Content on a Website Using htmlarea & a Database to Maintain Content on a Website by Peter Lavin December 30, 2003 Overview If you wish to develop a website that others can contribute to one option is to have text files sent

More information

Background. [pic] Changing the Appearance of the Sakai 2.1 Portal BACKGROUND 1 CREATING A SKIN 2. The mast head 8 Login framework 9 The tabs 10

Background. [pic] Changing the Appearance of the Sakai 2.1 Portal BACKGROUND 1 CREATING A SKIN 2. The mast head 8 Login framework 9 The tabs 10 [pic] Changing the Appearance of the Sakai 2.1 Portal BACKGROUND 1 CREATING A SKIN 2 GETTING STARTED 3 THE PORTAL 4 THE SITE NAVIGATION 6 The mast head 8 Login framework 9 The tabs 10 THE SITE AREA 11

More information

Web Technologies - by G. Sreenivasulu Handout - 1 UNIT - I

Web Technologies - by G. Sreenivasulu Handout - 1 UNIT - I INTRODUCTION: UNIT - I HTML stands for Hyper Text Markup Language.HTML is a language for describing web pages.html is a language for describing web pages.html instructions divide the text of a document

More information

CSS Cascading Style Sheets

CSS Cascading Style Sheets CSS Cascading Style Sheets site root index.html about.html services.html stylesheet.css charlie.jpg Linking to your HTML You need to link to your css in the of your HTML file.

More information

Web Authoring and Design. Benjamin Kenwright

Web Authoring and Design. Benjamin Kenwright CSS Div Layouts Web Authoring and Design Benjamin Kenwright Outline Review Why use Div Layout instead of Tables? How do we use the Div Tag? How to create layouts using the CSS Div Tag? Summary Review/Discussion

More information

CSS Selectors. element selectors. .class selectors. #id selectors

CSS Selectors. element selectors. .class selectors. #id selectors CSS Selectors Patterns used to select elements to style. CSS selectors refer either to a class, an id, an HTML element, or some combination thereof, followed by a list of styling declarations. Selectors

More information

Make a Website. A complex guide to building a website through continuing the fundamentals of HTML & CSS. Created by Michael Parekh 1

Make a Website. A complex guide to building a website through continuing the fundamentals of HTML & CSS. Created by Michael Parekh 1 Make a Website A complex guide to building a website through continuing the fundamentals of HTML & CSS. Created by Michael Parekh 1 Overview Course outcome: You'll build four simple websites using web

More information