LAPORAN TUGAS
PROYEK BERITA
Diajukan untuk memenuhi tugas mata kuliah Pemrograman Web Teori
Dosen Oleh : Haryanto, S.Kom
DISUSUN OLEH :
NINUK DIRGANTARI (311-5311-044) MUHAMMAD ARYA NUGRAHA (515-0311-009) NUR ZAENI SAEFUDIN (515-0311-017) ADIT PURNOMO AJI (515-0311-025) DZIKRI NANDI ASA (515-0311-035) ACHMAD SUDRAJAT (515-0311-043) MUHAMMAD ALFIAN FANDI (515-0311-051)
FAKULTAS BISNIS DAN TEKNOLOGI INFORMASI
UNIVERSITAS TEKNOLOGI YOGYAKARTA
LEMBAR PENGESAHAN
Nama Perguruan Tinggi : Universitas Teknologi Yogyakarta Program Studi : Sistem Informasi
Mata Kuliah : Pemrograman Web
Waktu : Kamis, 11:10 – 12:50 WIB
Tempat : Kampus I Universitas Teknologi Yogyakarta (F25)
Judul Project : Portal Berita
Nama :
1. NINUK DIRGANTARI (311-5311-044)
2. MUHAMMAD ARYA NUGRAHA (515-0311-009)
3. NUR ZAENI SAEFUDIN (515-0311-017)
4. ADIT PURNOMO AJI (515-0311-025)
5. DZIKRI NANDI ASA (515-0311-035)
6. ACHMAD SUDRAJAT (515-0311-043)
7. MUHAMMAD ALFIAN FANDI (515-0311-051)
Laporan ini selanjutnya akan diajukan kepada dosen pengampu pada 22 Desember – 29 Desember 2016.
Yogyakarta, 29 Desember 2016
Mengetahui,
Dosen Pengampu
Haryanto, S.Kom
Ketua Kelompok
KATA PENGHANTAR
Alhamdulillah, Segala puji bagi Allah S.W.T yang telah memberikan kita rahmat, hidayah serta inayahnya kepada kita, sehingga kami dapat menyelesaikan Laporan Tugas Proyek yang telah diberikan dosen pengampu kepada kita, dan kami berharap rahmat tersebut dapat menjadikan kita lebih beriman dan bertaqwa kepada Allah S.W.T.
Sholawat serta salam tetap tercurahkan kepada junjungan besar kita, Nabi Muhammad S.A.W, Keluarga, Sahabat. Dan Semoga kita sebagai umatnya, bisa mendapatkan syafaat beliau di Akherat kelak.
Alhamdulilah, kami telah menyelesaikan Laporan Tugas Proyek mengenai pembuatan program yang dapat digunakan secara efektif dan kondusif dalam masyarakat umumnya.
Dalam penulisan Tugas Proyek ini, Penulis mendapatkan berbagai
pengetahuan dan pengalaman yang sangat menakjubkan, serta juga mendapatkan berbagai saran, kritik yang tentunya bersifat membangun baik dari audiens, mentor, maupun dosen pengampu. Oleh karna itu, dengan segala hormat dan kerendahan hati, perkenankanlah penulis untuk mengucapkan terimakasih kepada :
1. Haryanto, S.Kom Selaku Dosen Pengampu Mata Kuliah
Pemrograman Web Prodi Sistem Informasi, Fakultas Bisnis dan Teknologi Informasi, Universitas Teknologi Yogyakarta
2. Teman Teman seperjuangan dalam Mata Kuliah Pemrograman Web Prodi Sistem Informasi, Fakultas Bisnis dan Teknologi Informasi, Universitas Teknologi Yogyakarta
3. Audiens yang telah bersedia mendengar, mencoba, mengamati serta meminati mengenai presentasi program yang telah kami buat. 4. Semua pihak yang tidak mungkin penulis sebutkan satu persatu
Dalam Penyusunan Laporan Tugas Proyek ini, Penulis sangat meminta maaf untuk berbagai kekurangan dan keterbatasan baik yang di sengaja maupun yang tidak disengaja.
Penulis Sangatlah mengharapkan kritik dan saran yang bersifat membangun dari segala pihak untuk lebih memperbaiki satu sama lain.
Dan Penulis sangatlah mengharapkan Laporan ini dapat bermanfaat baik bagi penulis, Universitas, Institusi Pendidikan dan masyarakat Luas.
Yogyakarta, 22 Desember 2016
DAFTAR ISI a. Cara kerja Program
...4 b. Screen Shoot Menu
...4 VIII. BAB IV
a. Daftar Kampus
...7 b. Daftar Fakultas
...7 c. Daftar Semester
...7 d. Rekapitulasi Quisioner
...7 e. Link Video Presentasi
...8
IX. BAB V
BLOG ... ...10
CERITA PRESENTASI
...10
X. BAB VI
BAB I PENDAHULUAN
A. Latar Belakang
Berhubungan dengan berjalannya dan berkembangnya berbagai teknologi dalam era globalisasi ini yang sangat dapat membantu dan mempermudah para manusia untuk melakukan dan mengerjakan berbagai macam aktifitas, seperti contohnya untuk membaca berita ataupun mencari informasi tanpa harus membeli koran pada umumnya dengan menunggu kedatangan para penjual koran setiap harinya.
Maka dari itu dapat diketahui bahwa dengan teknologi dan perancangan ini akan dapat membuat kita lebih mudah dalam melakukan segala sesuatunya, dan sebagai gambaran umumnya adalah kami
memikirkan mengenai kebiasaan atau suatu akitifitas yang sering dan sangat disukai oleh manusia, dan kami menentukan mengenai membaca sebagai kebiasaan yang banyak diminati oleh para pencari informasi, dalam prosedurnya untuk membaca berita kita memerlukan sebuah koran untuk dibaca setiap harinya, dan untuk membaca berita tersebut harus kita membeli kepada penjual, tetapi dengan ini kata lainnya kita harus
membacadan membeli dengan didatangi secara langsung pembaca/ penjual tersebut, dan koran tersebut sudah banyak yang pesan/ langganan maka akan mempersulit bagi para penggemar untuk menjalankan aktifitasnya.
Maka dari itu penulis memikirkan mengenai bagaimana kita dapat membaca berita tanpa harus didatangi /mendatangi tempatnya pembaca /penjual, maka kami buatlah “Portal Web Berita” untuk mempermudah para penggemar baca berita ini dalam menyalurkan hobi mereka dalam membaca berita/ mencari informasi harian.
B. Tujuan
1. Mempermudah bagi para penggemar baca berita untuk mencari informasi bacaan tiap harinya
2. Mempersiapkan Program siap saing di tanduk era Globalisasi 3. Memudahkan pembaca dalam mengontrol kategori berita yang
akan dibaca
4. Menunjukan portal berita secara lengkap tanpa harus membeli koran yang begitu tebal
C. Sasaran Program
Sasaran Program kami adalah Para penggemar baca berita khusunya wilayah Indonesia, serta para penggemar dari baca koran untuk dipakai dan dipergunakan sebagai pemermudah mereka dalam mencari informasi berita mereka ataupun pekerjaan mereka.
D. Masalah
Masalah dalam program ini kami nyatakan memiliki masalah mengenai kurang lengkapnya rincian kategori, khususnya kategori berita yang seharusnya ada dalam portal berita, dan juga dalam kerapian input dan output berita dari database.
BAB II
PROSES PRODUKSI
1. Storyboard
2. Fasilitas / Peralatan
Alat :
No. Nama alat karakteristik Jumlah keterangan
1 Laptop Lenovo Lenovo Prosessor
Core i3 2 Kondisi baik
2 Laptop Asus Asus Prosessor
Celeron 1 Kondisi baik
3 Netbook Acer Acer Prosessor Intel
Atom 1 Kondisi baik
4 Modem Three/ Tri/ 3 1 Kondisi baik
5 Internet Hotspot - Kondisi baik
Bahan :
No. Nama Bahan versi
1 Sublime Sublime text 3
2 Xampp Control
Panel Xampp Control Panel 1.7.4
3 Pencil Pencil v. 2
4 Mozilla Firefox Mozilla Firefox v. 48.0.2
5 Google Chrome Google Chrome v.55.0.2883.87 m
Source code
Nama Fungsi Di Web:
Nama Fungsi di Web Pembuat
Home Page 1. Ninuk Dirgantari
2. Muhammad Arya Nugraha 3. Nur Zaeni Saefudin
4. Adit Purnomo Aji 5. Dzikri Nandi Asa 6. Achmad Sudrajat
7. Muhammad Alfian Fandi
3. Pembagian kerja
1. Alfian, Ahmad, Adit menyelesaikan Portal berita.
2. Alfian, Zaeni Menyelesaikan Pembuatan input dan output berita. 3. Dzikri, Arya, Menyelesaikan Pembuatan secara teknis.
BAB III
A. Pendadaran program
Untuk cara kerja program Portal Web Berita berikut kami jelaskan alurnya :
1. Admin akan melakukan login sebagai langkah awal untuk membuat berita, buka web yang telah kami buat
2. Klik Home Page untuk melihat dan menentukan berita dan memasukkan berita yang akan dipilih/ di unggah
3. Klik Support untuk melihat siapa saja yang sudah membantu dalam pembuatan Wet ini
4. Klik About Us untuk melihat daftar nama kelompok beserta misi kita.
5. Blog untuk menampilkan daftar komentar yang terdapat pada berita yang telah diunggah yang bertujuan untuk memudahkan kita dalam memantau ataupun sekedar membalas komenat tersebut
6. Contact Us berisi tentang isi laporan para pembaca yang nantinya akan dikirim ke data server kami
7. Pada Home pag di sidebar menu terdapat sub sidebar tambah berita yang berfungsi sebagai penambah berita yang ingin diunggah
B. Source Code (Terlampir)
C. Desain awal
2. Desain template
D. Screen Shot Menu
1. Menu
b. Support
d. Blog
BAB IV PRESENTATION
A. Kampus
a. Ruang F.2.5 Kampus I Universitas Teknologi Yogyakarta (UTY) B. Fakultas
C. Tingkatan
a. Semester III
BAB V
CERITA PRESENTASI
Cerita dari presentasi kami merupakan sebuah pengalaman menarik yang kami temui dalam perjalanan kami sebagai mahasiswa Universitas Teknologi Yogyakarta.
Presentasi untuk tugas proyek ini kami diberikan tugas bahwa kami harus mempresentasikan hasil tugas proyek kami sebagai keharusan bahasa pemenuhan presentasi kami sebagai pembuat program dihadapan para pembeli program, ini merupakan sebuah tantangan yang sangat jarang dan langka, jelasnya tantangan ini membuat kita lebih memaksakan diri untuk belajar, mengerti, lalu bisa dengan hal yang tadinya kami kurang bisa, jika kita tidak bisa mempresentasikan tugas kami dengan memuaskan ini bukan merupakan kerugian dan kemaluan dalam satu pihak, melainkan pihak dari kelompok kami sendiri sebagai nama kelompok kami sebagai pembuat web.
Dengan sebegitu kuat rasanya untuk lebih membanggakan kelompok kami di hadapan para teman, kami berusaha sekuat mungkin, lalu saat hari mulainya untuk mempresentasikan tugas akhir kami, dengan begitu antusias dan begitu semangat kami berangkat untuk
mempresentasikan tugas akhir kami, dengan sangat lantang dan bangganya kami membawa logo Universitas Tenologi Yogyakarta lalu menceritakan dan menjelaskan yang perlu kami jelaskan dengan menggunakan bahasa sopan yang memang telah kami siapkan.
Setelah selesai, kami pulang dengan rasa senang, bahagia, dan bangga tentunya karna tetap bisa.
BAB VII PENUTUP
Allhamdulilah, sangat menyenangkan bagi kami untuk melakukan tugas proyek ini sebagai tantangan bagi diri kami sendriri mengani seberapa tangguhkah kami di hadapan para mahasiswa
Dalam Tugas Proyek ini kami belajar mengenai berbagai macam kerjasama baik sedih maupun senang saat kami sedang mengerjakan pun semua terasa terpadu dan kami tanggung bersama, beraneka kritik, saran, pujian kami dapatkan dari hasil presentasi kami.
Saat kami dalam presentasi, kami merasakan bahwa kami membawa image dan nama baik dari kami, sehingga dengan sekuat tenaga dan sebisa mungkin kami berpresentasi di depan puluhan mahasiswa di hadapan kami dan kami mempresentasikan tugas proyek ini dengan bahasa sopan yang memang sebagai syarat utama tugas proyek ini.
Dari Segala Jalan dan halangan yang kami hadapi, allhamdulilah kami dapat menyelesaikan tugas proyek dan menyerahkan laporan tugas proyek ini dengan penuh bangga atas kerja kami dan bantuan dari berbagai pihak yang memberikan saran yang bersifat membangun.
Dan kami sangatlah menerima kritik dan saran yang bersifat membangun dari berbagai pihak untuk saling memperbaiki satu dengan yang lainnya.
LAMPIRAN
1. Index.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> <head>
<title>Kelompok 2</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="js/coin-slider.min.js"></script> </head>
<body>
<div class="main"> <div class="header">
<div class="header_resize"> <div class="rss">
<p><a href="#">Subscribe to</a> <a href="#"><img src="images/rss.gif" width="16" height="16" alt="" /></a></p> </div>
<div class="logo">
<h1><a href="index.php">Techno<span> News</span></a></h1>
</div>
<div id="profile">
<b id="welcome">Selamat Datang : <i> </i></b>
<b id="logout"><a href="logout.php">Log Out</a></b> </div>
<div class="clr"></div> <div class="slider">
<div id="coin-slider"> <a href="#"><img
src="images/wck1.jpg" width="960" height="360" alt=""
/><span>keseluruhan sarana untuk menyediakan barang-barang yang diperlukan bagi kelangsungan dan kenyamanan hidup
matematika, sains, dan berbagai seni untuk faedah kehidupan seperti yang dikenal saat ini.</span></a> <a href="#"><img
src="images/wck3.jpg" width="960" height="360" alt=""
/><span>teknologi berasal dari perpaduan dua buah akar kata yaitu ‘techne’ atau ‘techton’ dan ‘logos’, keduanya berasal dari bahasa Yunani. Techton atau techne berarti keterampilan dan kata ini
memiliki padanan dalam bahasa sansekerta berarti taksan dan dalam bahasa Arab berarti taskhir serta dalam bahasa latin berarti tegere. dan logos tentu saja berarti ilmu. Sehingga secara sederhana teknologi dapat diartikan sebagai ilmu tentang keterampilan.</span></a> </div> <div class="clr"></div>
</div>
<div class="clr"></div> <div class="searchform">
<form id="formsearch" name="formsearch" method="post" action="#">
<span>
<input name="editbox_search" class="editbox_search" id="editbox_search" maxlength="80" value="Search our ste:" type="text" />
</span>
<input name="button_search" src="images/search.gif" class="button_search" type="image" />
</form> </div>
<ul>
<li class="active"><a href="index.php"><span>Home Page</span></a></li>
<li><a href="support.html"><span>Support</span></a></li> <li><a href="about.html"><span>About Us</span></a></li> <li><a href="blog.html"><span>Blog</span></a></li> <li><a href="contact.html"><span>Contact
Us</span></a></li> </ul>
</div>
<div class="clr"></div> </div>
</div>
<div class="content">
<div class="content_resize"> <div class="mainbar">
<div class="container-fluid"> <div class="row-fluid">
if(empty($_GET['link'])) <br></br>
</div>
<p class="pages"> <span></span> <a ></a> <a ></a></p>
</div>
<div class="sidebar"> <div class="gadget">
<h2 class="star"><span>Sidebar</span> Menu</h2> <div class="clr"></div>
<ul class="sb_menu">
<li><a href="index.php">Home</a></li>
<li><a href="#">Style Demo</a></li>
<h2 class="star"><span>Kategori</span></h2> <div class="clr"></div>
<ul class="ex_menu"> <li><a
href="smartphone.html">Smartphone</a></li> <li><a href="laptop.html">Laptop</a></li> <li><a href="#">Hardware</a></li>
<div class="clr"></div> </div>
</div>
<br></br> <br></br>
<div class="fbg_resize"> <div class="col c1">
<h2><span>Image</span> Gallery</h2>
<a href="read.html"><img src="sam.jpg" width="75" height="75" alt="" class="gal" /></a>
<a href="#"><img src="pix.jpg" width="75" height="75" alt="" class="gal" /></a>
<a href="#"><img src="images/gal3.jpg" width="75" height="75" alt="" class="gal" /></a>
<a href="#"><img src="images/gal4.jpg" width="75" height="75" alt="" class="gal" /></a>
<a href="#"><img src="images/gal5.jpg" width="75" height="75" alt="" class="gal" /></a>
<a href="#"><img src="images/gal6.jpg" width="75" height="75" alt="" class="gal" /></a>
</div>
<div class="col c2">
<h2><span>Services</span> Overview</h2>
<p>Curabitur sed urna id nunc pulvinar semper. Nunc sit amet tortor sit amet lacus sagittis posuere cursus vitae nunc.Etiam
venenatis, turpis at eleifend porta, nisl nulla bibendum justo.</p> <ul class="fbg_ul">
<li><a href="#">Lorem ipsum dolor labore et dolore.</a></li> <li><a href="#">Excepteur officia deserunt.</a></li>
</div>
<div class="col c3">
<h2><span>Contact</span> us</h2>
<p>Nullam quam lorem, tristique non vestibulum nec, consectetur in risus. Aliquam a quam vel leo gravida gravida eu porttitor dui.</p>
<p class="contact_info"> <span>Address:</span> 1458 TemplateAccess, INA<br />
<span>Telephone:</span> +123-1234-5678<br /> <span>FAX:</span> +458-4578<br />
<span>Others:</span> +301 - 0125 - 01258<br />
<span>E-mail:</span> <a href="#">[email protected]</a> </ p>
</div>
<div class="clr"></div> </div>
</div>
<div class="footer">
<div class="footer_resize">
<p class="lf">Copyright © <a href="#">Domain Name</a>. All Rights Reserved</p>
<p class="rf">Design by <a target="_blank" href="#">Kelompok 2</a></p>
<div style="clear:both;"></div> </div>
</div> </body> </html>
2. Index2.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> <head>
<title>Wicak</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="css/style.css" rel="stylesheet" type="text/css" /> <link rel="stylesheet" type="text/css" href="css/coin-slider.css" /> <script type="text/javascript" src="js/cufon-yui.js"></script> <script type="text/javascript" src="js/cufon-aller-bi.js"></script> <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script> <script type="text/javascript" src="js/script.js"></script>
<script type="text/javascript" src="js/coin-slider.min.js"></script> </head>
<body>
<div class="header_resize"> <div class="rss">
<p><a href="#">Subscribe to</a> <a href="#"><img src="images/rss.gif" width="16" height="16" alt="" /></a></p> </div>
<div class="logo">
<h1><a href="index.html">Techno<span> News</span></a></h1>
</div>
<div id="profile">
<b id="welcome">Selamat Datang : <i><?php echo $login_session; ?></i></b>
<b id="logout"><a href="logout.php">Log Out</a></b> </div>
<div class="clr"></div> <div class="slider">
<div id="coin-slider"> <a href="#"><img
src="images/wck1.jpg" width="960" height="360" alt=""
/><span>keseluruhan sarana untuk menyediakan barang-barang yang diperlukan bagi kelangsungan dan kenyamanan hidup
manusia.</span></a> <a href="#"><img src="images/wck2.jpg" width="960" height="360" alt="" /><span>teknologi adalah terapan matematika, sains, dan berbagai seni untuk faedah kehidupan seperti yang dikenal saat ini.</span></a> <a href="#"><img
src="images/wck3.jpg" width="960" height="360" alt=""
‘techne’ atau ‘techton’ dan ‘logos’, keduanya berasal dari bahasa Yunani. Techton atau techne berarti keterampilan dan kata ini
memiliki padanan dalam bahasa sansekerta berarti taksan dan dalam bahasa Arab berarti taskhir serta dalam bahasa latin berarti tegere. dan logos tentu saja berarti ilmu. Sehingga secara sederhana teknologi dapat diartikan sebagai ilmu tentang keterampilan.</span></a> </div> <div class="clr"></div>
</div>
<div class="clr"></div> <div class="searchform">
<form id="formsearch" name="formsearch" method="post" action="#">
<span>
<input name="editbox_search" class="editbox_search" id="editbox_search" maxlength="80" value="Search our ste:" type="text" />
</span>
<input name="button_search" src="images/search.gif" class="button_search" type="image" />
</form> </div>
<div class="menu_nav"> <ul>
<li class="active"><a href="index.html"><span>Home Page</span></a></li>
<li><a href="about.html"><span>About Us</span></a></li> <li><a href="blog.html"><span>Blog</span></a></li> <li><a href="contact.html"><span>Contact
Us</span></a></li> </ul>
</div>
<div class="clr"></div> </div>
</div>
<div class="content">
<div class="content_resize"> <div class="mainbar"> <div class="article">
<h2><span>ROG G701, Gaming Laptop Pertama Asus</span>dengan GeForce 1080</h2>
<p class="infopost">Posted <span class="date">on 10 dec 2017</span> by <a href="#">Admin</a> |
Filed under <a href="#">templates</a>, <a href="#">internet</a> <a href="#" class="com">Comments <span>11</span></a></p>
<div class="clr"></div>
<div class="img"><img src="asuss.jpg" width="179" height="200" alt="" class="fl" /></div>
<p>Seakan tak ingin kalah dengan rekan senegaranya Acer yang memperkenalkan gaming laptop dengan kartu grafis GeForce GTX 1080, Asus pun memperkenalkan ROG G701VI.
ROG G701VI merupakan seri gaming laptop pertama Asus yang menggunakan kartu grafis terbaru milik Nvidia tersebut.</p>
<p class="spec"><a href="read.html" class="rm">Read more...</a></p> Intel Kaby Lake dan Pengolah Grafis dari </span> Nvida</h2> <p class="infopost">Posted <span class="date">on 29 aug 2016</span> by <a href="#">Admin</a> |
Filed under <a href="#">templates</a>, <a href="#">internet</a> <a href="#" class="com">Comments <span>7</span></a></p>
<div class="clr"></div>
<div class="img"><img src="asus.jpg" width="179" height="200" alt="" class="fl" /></div>
<div class="post_content">
telah menggunakan prosesor Intel Skylake saat itu. Namun tidak sampai satu tahun lamanya, akhirnya Asus memutuskan untuk memperbarui laptop tersebut dengan jeroan yang lebih fresh. </p> <p class="spec"><a href="read2.html" class="rm">Read more...</a></p>
</div>
<div class="clr"></div> </div>
<p class="pages"><small>Page 2 of 2
</small> <a href="index.html">1</a> <span>2</span> <a href="#">»</a></p>
</div>
<div class="sidebar"> <div class="gadget">
<h2 class="star"><span>Sidebar</span> Menu</h2> <div class="clr"></div>
<ul class="sb_menu">
<h2 class="star"><span>Kategori</span></h2> <div class="clr"></div>
<ul class="ex_menu"> <li><a
href="smartphone.html">Smartphone</a></li> <li><a href="laptop.html">Laptop</a></li> <li><a href="#">Hardware</a></li>
<div class="clr"></div> </div>
</div>
<div class="fbg">
<div class="fbg_resize"> <div class="col c1">
<h2><span>Image</span> Gallery</h2>
<a href="#"><img src="sam.jpg" width="75" height="75" alt="" class="gal" /></a>
<a href="#"><img src="pix.jpg" width="75" height="75" alt="" class="gal" /></a>
<a href="#"><img src="images/gal4.jpg" width="75" height="75" alt="" class="gal" /></a>
<a href="#"><img src="images/gal5.jpg" width="75" height="75" alt="" class="gal" /></a>
<a href="#"><img src="images/gal6.jpg" width="75" height="75" alt="" class="gal" /></a>
</div>
<div class="col c2">
<h2><span>Services</span> Overview</h2>
<p>Curabitur sed urna id nunc pulvinar semper. Nunc sit amet tortor sit amet lacus sagittis posuere cursus vitae nunc.Etiam
venenatis, turpis at eleifend porta, nisl nulla bibendum justo.</p> <ul class="fbg_ul">
<li><a href="#">Lorem ipsum dolor labore et dolore.</a></li> <li><a href="#">Excepteur officia deserunt.</a></li>
<li><a href="#">Integer tellus ipsum tempor sed.</a></li> </ul>
</div>
<div class="col c3">
<h2><span>Contact</span> us</h2>
<p>Nullam quam lorem, tristique non vestibulum nec, consectetur in risus. Aliquam a quam vel leo gravida gravida eu porttitor dui.</p>
<p class="contact_info"> <span>Address:</span> 1458 TemplateAccess, INA<br />
<span>FAX:</span> +458-4578<br />
<span>Others:</span> +301 - 0125 - 01258<br />
<span>E-mail:</span> <a href="#">[email protected]</a> </ p>
</div>
<div class="clr"></div> </div>
</div>
<div class="footer">
<div class="footer_resize">
<p class="lf">Copyright © <a href="#">Domain Name</a>. All Rights Reserved</p>
<p class="rf">Design by <a target="_blank" href="#">Kelompok 2</a></p>
<div style="clear:both;"></div> </div>
</div> </div> </body> </html>
3. Indo.php <?php
if(isset($_SESSION['login_user'])){ header("location: index.php"); }
?>
<!DOCTYPE html> <html>
<head>
<title> Login Site </title>
<!-- Skrip CSS-->
<link rel="stylesheet" href="style.css"/>
</head> <body>
<div class="container">
<div class="main">
<form action="" method="post">
<h2>Login Techno News</h2><hr/>
<label>Username :</label>
<input id="name" name="username" placeholder="username" type="text">
<label>Password :</label>
<input type="submit" name="submit" id="submit" value="Login">
</form> </div> </div>
</body> </html>
4. About.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> <head>
<title>Wicak | About</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="css/style.css" rel="stylesheet" type="text/css" /> <link rel="stylesheet" type="text/css" href="css/coin-slider.css" /> <script type="text/javascript" src="js/cufon-yui.js"></script> <script type="text/javascript" src="js/cufon-aller-bi.js"></script> <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script> <script type="text/javascript" src="js/script.js"></script>
<body>
<div class="main"> <div class="header">
<div class="header_resize"> <div class="rss">
<p><a href="#">Subscribe to</a> <a href="#"><img src="images/rss.gif" width="16" height="16" alt="" /></a></p> </div>
<b id="welcome">Selamat Datang : <i><?php echo $login_session; ?></i></b>
<b id="logout"><a href="logout.php">Log Out</a></b> </div>
<div class="clr"></div> <div class="slider">
<div id="coin-slider"> <a href="#"><img
src="images/wck1.jpg" width="960" height="360" alt=""
/><span>keseluruhan sarana untuk menyediakan barang-barang yang diperlukan bagi kelangsungan dan kenyamanan hidup
yang dikenal saat ini.</span></a> <a href="#"><img src="images/wck3.jpg" width="960" height="360" alt=""
/><span>teknologi berasal dari perpaduan dua buah akar kata yaitu ‘techne’ atau ‘techton’ dan ‘logos’, keduanya berasal dari bahasa Yunani. Techton atau techne berarti keterampilan dan kata ini
memiliki padanan dalam bahasa sansekerta berarti taksan dan dalam bahasa Arab berarti taskhir serta dalam bahasa latin berarti tegere. dan logos tentu saja berarti ilmu. Sehingga secara sederhana teknologi dapat diartikan sebagai ilmu tentang keterampilan.</span></a> </div> <div class="clr"></div>
</div>
<div class="clr"></div> <div class="searchform">
<form id="formsearch" name="formsearch" method="post" action="#">
<span>
<input name="editbox_search" class="editbox_search" id="editbox_search" maxlength="80" value="Search our ste:" type="text" />
</span>
<input name="button_search" src="images/search.gif" class="button_search" type="image" />
</form> </div>
<li><a href="index.html"><span>Home Page</span></a></li> <li><a href="support.html"><span>Support</span></a></li> <li class="active"><a href="about.html"><span>About Us</span></a></li>
<li><a href="blog.html"><span>Blog</span></a></li> <li><a href="contact.html"><span>Contact
Us</span></a></li> </ul>
</div>
<div class="clr"></div> </div>
</div>
<div class="content">
<div class="content_resize"> <div class="mainbar"> <div class="article">
<h2><span>About to</span> Work Grup</h2> <div class="clr"></div>
<p><strong>ini adalah sebagian tugas akhir dari kami dalam matakuliah pemrograman web yang mana diajar oleh bpk. buyung, .</ strong></p>
<p><pre>Kelompok ini terdiri dari :
3. NUR ZAENI SAEFUDIN
<h2><span>Our</span> Mission</h2> <div class="clr"></div>
<p><strong>Tujuan dari kelompok ini adalah untuk memenuhi sebagian tugas yang diberikan oleh dosen kepada kami para
mahasiswa SI 2015.</strong></p>
<p>Dalam Pembuatan Website ini kami mengambil dari beberapa reverensi dari salah satu website yang kami dapati dari search di google, lalu kami melakukan sebagian diskusi agar website ini lebih eisien dan efektif</p>
<p>Reverensi yang kami kumpulkan cukup banyak, mulai dari buku perpustakaan sampai artikel yang di post dari salah satu website dan blog orang lain.</p>
</div> </div>
<div class="gadget">
<h2 class="star"><span>Sidebar</span> Menu</h2> <div class="clr"></div>
<ul class="sb_menu">
<li><a href="#">Home</a></li>
<li><a href="#">TemplateInfo</a></li> <li><a href="#">Style Demo</a></li>
<h2 class="star"><span>Sponsors</span></h2> <div class="clr"></div>
<li><a href="#">Donec mattis</a><br /> purus nec placerat bibendum</li>
</ul> </div> </div>
<div class="clr"></div> </div>
</div>
<div class="fbg">
<div class="fbg_resize"> <div class="col c1">
<h2><span>Image</span> Gallery</h2>
<a href="#"><img src="images/gal1.jpg" width="75" height="75" alt="" class="gal" /></a> <a href="#"><img
src="images/gal2.jpg" width="75" height="75" alt="" class="gal" /></ a> <a href="#"><img src="images/gal3.jpg" width="75" height="75" alt="" class="gal" /></a> <a href="#"><img src="images/gal4.jpg" width="75" height="75" alt="" class="gal" /></a> <a href="#"><img src="images/gal5.jpg" width="75" height="75" alt="" class="gal" /></ a> <a href="#"><img src="images/gal6.jpg" width="75" height="75" alt="" class="gal" /></a> </div>
<div class="col c2">
<h2><span>Services</span> Overview</h2>
<p>Curabitur sed urna id nunc pulvinar semper. Nunc sit amet tortor sit amet lacus sagittis posuere cursus vitae nunc.Etiam
<ul class="fbg_ul">
<li><a href="#">Lorem ipsum dolor labore et dolore.</a></li> <li><a href="#">Excepteur officia deserunt.</a></li>
<li><a href="#">Integer tellus ipsum tempor sed.</a></li> </ul>
</div>
<div class="col c3">
<h2><span>Contact</span> Us</h2>
<p>Nullam quam lorem, tristique non vestibulum nec, consectetur in risus. Aliquam a quam vel leo gravida gravida eu porttitor dui.</p>
<p class="contact_info"> <span>Address:</span> 1458 TemplateAccess, USA<br />
<span>Telephone:</span> +123-1234-5678<br /> <span>FAX:</span> +458-4578<br />
<span>Others:</span> +301 - 0125 - 01258<br />
<span>E-mail:</span> <a href="#">[email protected]</ a> </p>
</div>
<div class="clr"></div> </div>
</div>
<div class="footer">
<div class="footer_resize">
<p class="rf">Design by <a target="_blank"
href="http://www.dreamtemplate.com/">DreamTemplate</a></p> <div style="clear:both;"></div>
</div>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> <head>
<title>Toplax | Blog</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<body>
<div class="main"> <div class="header">
<div class="header_resize"> <div class="rss">
<p><a href="#">Subscribe to</a> <a href="#"><img src="images/rss.gif" width="16" height="16" alt="" /></a></p> </div>
<div class="logo">
<h1><a href="index.html">Top<span>lax</span></a></h1> </div>
<div id="profile">
<b id="welcome">Selamat Datang : <i><?php echo $login_session; ?></i></b>
<b id="logout"><a href="logout.php">Log Out</a></b> </div>
<div class="clr"></div> <div class="slider">
<div id="coin-slider"> <a href="#"><img src="images/wck1.jpg" width="960" height="360" alt="" /><span>keseluruhan sarana untuk menyediakan barang-barang yang diperlukan bagi kelangsungan dan kenyamanan hidup manusia.</span></a> <a href="#"><img
src="images/wck2.jpg" width="960" height="360" alt=""
alt="" /><span>teknologi berasal dari perpaduan dua buah akar kata yaitu ‘techne’ atau ‘techton’ dan ‘logos’, keduanya berasal dari bahasa Yunani. Techton atau techne berarti keterampilan dan kata ini
memiliki padanan dalam bahasa sansekerta berarti taksan dan dalam bahasa Arab berarti taskhir serta dalam bahasa latin berarti tegere. dan logos tentu saja berarti ilmu. Sehingga secara sederhana teknologi dapat diartikan sebagai ilmu tentang keterampilan.</span></a> </div> <div class="clr"></div>
</div>
<div class="clr"></div> <div class="searchform">
<form id="formsearch" name="formsearch" method="post" action="#">
<span>
<input name="editbox_search" class="editbox_search" id="editbox_search" maxlength="80" value="Search our ste:" type="text" />
</span>
<input name="button_search" src="images/search.gif" class="button_search" type="image" />
</form> </div>
<div class="menu_nav"> <ul>
<li><a href="about.html"><span>About Us</span></a></li> <li class="active"><a
href="blog.html"><span>Blog</span></a></li> <li><a href="contact.html"><span>Contact Us</span></a></li>
</ul> </div>
<div class="clr"></div> </div>
</div>
<div class="content">
<div class="content_resize"> <div class="mainbar"> <div class="article">
<h2><span>A Blog</span> Entry</h2> <div class="clr"></div>
<p>Posted by <a href="#">Admin</a>
<span> • </span> Filed under <a href="#">templates</a>, <a href="#">internet</a></p>
tristique orci porttitor ipsum. Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Donec libero. Suspendisse bibendum. Cras id urna. Morbi tincidunt, orci ac convallis aliquam, lectus turpis varius lorem, eu posuere nunc justo tempus leo. </p>
<p>Tagged: <a href="#">orci</a>, <a href="#">lectus</a>, <a href="#">varius</a>, <a href="#">turpis</a></p>
<p><a href="#"><strong>Comments (3)</strong></a> <span> • </span> May 27, 2010
<span> • </span> <a href="#"><strong>Edit</strong></a></p> </div>
<div class="article">
<h2><span>3</span> Responses</h2> <div class="clr"></div>
<div class="comment"> <a href="#"><img
src="images/userpic.gif" width="40" height="40" alt="" class="userpic" /></a>
<p><a href="#">admin</a> Says:<br /> April 20th, 2009 at 2:17 pm</p>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec libero. Suspendisse bibendum.</p>
</div>
<div class="comment"> <a href="#"><img
src="images/userpic.gif" width="40" height="40" alt="" class="userpic" /></a>
April 20th, 2009 at 3:21 pm</p>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec libero. Suspendisse bibendum. Cras id urna. Morbi tincidunt, orci ac convallis aliquam, lectus turpis varius lorem, eu posuere nunc justo tempus leo.</p>
</div>
<div class="comment"> <a href="#"><img
src="images/userpic.gif" width="40" height="40" alt="" class="userpic" /></a>
<p><a href="#">admin</a> Says:<br /> April 20th, 2009 at 2:17 pm</p>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec libero. Suspendisse bibendum.</p>
</div> </div>
<div class="article">
<h2><span>Leave a</span> Reply</h2> <div class="clr"></div>
<input id="email" name="email" class="text" />
<h2 class="star"><span>Sidebar</span> Menu</h2> <div class="clr"></div>
<ul class="sb_menu">
<li><a href="#">TemplateInfo</a></li>
<h2 class="star"><span>Sponsors</span></h2> <div class="clr"></div>
<div class="clr"></div> </div>
</div>
<div class="fbg">
<div class="fbg_resize"> <div class="col c1">
<h2><span>Image</span> Gallery</h2>
<a href="#"><img src="images/gal1.jpg" width="75" height="75" alt="" class="gal" /></a> <a href="#"><img
src="images/gal2.jpg" width="75" height="75" alt="" class="gal" /></ a> <a href="#"><img src="images/gal3.jpg" width="75" height="75" alt="" class="gal" /></a> <a href="#"><img src="images/gal4.jpg" width="75" height="75" alt="" class="gal" /></a> <a href="#"><img src="images/gal5.jpg" width="75" height="75" alt="" class="gal" /></ a> <a href="#"><img src="images/gal6.jpg" width="75" height="75" alt="" class="gal" /></a> </div>
<div class="col c2">
<h2><span>Services</span> Overview</h2>
<p>Curabitur sed urna id nunc pulvinar semper. Nunc sit amet tortor sit amet lacus sagittis posuere cursus vitae nunc.Etiam
venenatis, turpis at eleifend porta, nisl nulla bibendum justo.</p> <ul class="fbg_ul">
<li><a href="#">Lorem ipsum dolor labore et dolore.</a></li> <li><a href="#">Excepteur officia deserunt.</a></li>
</div>
<div class="col c3">
<h2><span>Contact</span> Us</h2>
<p>Nullam quam lorem, tristique non vestibulum nec, consectetur in risus. Aliquam a quam vel leo gravida gravida eu porttitor dui.</p>
<p class="contact_info"> <span>Address:</span> 1458 TemplateAccess, USA<br />
<span>Telephone:</span> +123-1234-5678<br /> <span>FAX:</span> +458-4578<br />
<span>Others:</span> +301 - 0125 - 01258<br />
<span>E-mail:</span> <a href="#">[email protected]</ a> </p>
</div>
<div class="clr"></div> </div>
</div>
<div class="footer">
<div class="footer_resize">
<p class="lf">Copyright © <a href="#">Domain Name</a>. All Rights Reserved</p>
<p class="rf">Design by <a target="_blank"
href="http://www.dreamtemplate.com/">DreamTemplate</a></p> <div style="clear:both;"></div>