Terima Kasih Sudah Berkunjung Di Blog Belajar PHP M.Toyib Hidayat

Minggu, 18 Januari 2015

membuat desain web di php

Cara Membuat Desain Web Dengan PHP - Mungkin tak asing lagi yang namannya Bahasa PHP, HTML, CSS, Java Script ataupun Jquery. kali ini saya akan membahas tentang bagaimana cara membuat sebuah tampilan website dengan menggunakan PHP. pada dasarnya PHP bukanlah bahasa yang di gunakan untuk menampilkan sebuah desain, PHPdigunakan untuk memproses sebuah aksi dari tampilan website, bukan untuk menampilkan di layar monitor. mungkin kebanyakan bahasa php yang <?php include ""; ?> itu hanya untuk memanggil fila yang ber ekstensi .php, namun kalau untuk desain tampilannya adalah bahasanya html, css, jquery ataupu javascript. Bahasa HTML digunakan untuk menampilkan dari proses php yang di bantu oleh css, javascrip. sekarang kebanyakan programmer menggunakan css untuk meringankan tampilanya, namun dalam penggunaan css tidak meninggalkan html pastinnya.


Cara Membuat Desain Web Dengan PHP

Taukah anda bahasa yang di bawah ini, ini adalah gabungan dari bahasa html dan bahasa css yang di simpan dengan ekstensi .php dan bisa memanggil file-file berekstensi .php lain dengan menggunakan include. 

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>.:: Pengaduan FIK UBL ::.</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="topPan">
<table width="830">
<tr><td width="106">
<img src="images/logo-ubl.png" height="95px" />
</td>
<td width="712" ><div class="logo" title="Education Zone"><br /><font size="+2"><b> Aplikasi Penunjang Keputusan Guru</b></font><br /><br /><font size="+1" >SMA Negeri 14 Bandar Lampung</font></div>
</td>
</tr>
</table>
<div id="topMenuPan">
    <ul id="MenuBar1" class="MenuBarHorizontal">
      <li><a
href="home.php">Home</a></li>
      <li><a href="#" class="MenuBarItemSubmenu">Kelas</a>
        <ul>
          <li><a href="kelas/kelasx1.php">Kelas X1</a></li>
          <li><a href="kelas/kelasx2.php">Kelas X2</a></li>
          <li><a href="kelas/kelasx3.php">Kelas X3</a></li>
          <li><a href="kelas/kelasx4.php">Kelas X4</a></li>
          <li><a href="kelas/kelasx5.php">Kelas X5</a></li>
          <li><a href="kelas/kelasx6.php">Kelas X6</a></li>
          <li><a href="kelas/kelasx7.php">Kelas X7</a></li>
        </ul>
      </li>
      <li><a href="#">Logout</a></li>
    </ul>
  </div>
</div>
<div id="bodyPan">
  <div id="bodyLeftPan">
  <!-- CONTENT  -->
    <h2>Judul</h2>
    <p>Isi content</p> 
    <!--  ISI CONTENT  -->
</div>
<!--  SIDE BAR  -->
</div>
<script type="text/javascript">
<!--
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
//-->
</script>
</body>
</html>

dari beberapa script di atas nanti jadinya akan seperti di bawah ini :



Ini adalah satu tampilan yang saya gunakan untuk calon template. sederhana bukan..? namun di sisi lain dari sederet script sedikit di atas itu banyak memanggil banyak script  css dan javascript. nah kebetulan file .php belum saya panggil karena ini saya gunakan untuk template nantinya.

<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />

Demikianlah yang bisa saya jelaskan kali ini, simak juga artikel artikel lainnya yang akan membahas selanjutnya tentang desain website, dan ada pula artikel yang menjelaskan bagaimana membuat menu di website

Tidak ada komentar:

Posting Komentar