Post By : Zainuddin am 9. October 2011
Simpeg H +1: Membuat Kerangka SIMPEGDA
Mungkin tahapan awal inilah yang terberat. Menentukan kerangka/ membuat sketsa rancangan awal simpeg. OK, nantinya simpegda akan gw buat begini:
- pakai SEF url; biar keren. wkk
- template pakai 2 kolom dengan menu di bagian kanan. Menu fixed, isi fluid.
- menu atas untuk bermacam-macam menu, sedang menu kanan diisi SKPD/ instansi dan pada modul tertentu beralih fungsi untuk menampilkan foto
- menentukan nama. Apa ya bagusnya??? simpol:simpeg online?? simpego:simpeg online atau simpegnya gecko. Ah… buang waktu. namanya simpegda ja deh.. atau kalo ada saran bagus dari temen-temen ntar gw pake deh..
- oh iya SEF urlnya pake bantuan mod rewrite
Terus testing server yang gecko pakai:
appserv 2.5.7 yang isinya
- Apache Web Server Version 2.2.3,
- PHP Script Language Version 5.1.6,
- MySQL Database Version 5.0.24a,
- phpMyAdmin Database Manager Version 2.9.0.2
Atau mungkin kalau mungkin dirasa perlu gw akan upload di server ini progresnya / live demonya.
Tool yang gw pake:
- macromedia dreamweaver buat edit tabel dan mempermudah editing
- text editor pakek Scite version 1.57 dari www.scintila.org
Resource:
- Sementara mengambil css layout dari dynamicdrive.com
- dan mengambil fungsi cleanxss dan clean query dari snewscms
SIMPEGDA hari pertama sebagai berikut:
terdiri dari 4 buah file yaitu:
- index.php >> file untuk layout secara keseluruhan
- gecko.php >> otak dari simpegda, menangani database & juga menangani SEF url
- .htaccess >> yang menangani SEF url
- nominatif.php >> contoh tabel untuk menampilkan nominatif
berikut kodenya:
1.index.php
- <?php
- include(“gecko.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” lang=”en” xml:lang=”en”>
- <head>
- <meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″ />
- <title>Simpegda </title>
- <style type=”text/css”>
- body{
- margin:0;
- padding:0;
- line-height: 1.5em;
- }
- b{font-size: 110%;}
- em{color: red;}
- #topsection{
- background: #EAEAEA;
- height: 90px; /*Height of top section*/
- }
- #topsection h1{
- margin: 0;
- padding-top: 15px;
- }
- #contentwrapper{
- float: left;
- width: 100%;
- }
- #contentcolumn{
- margin-right: 200px; /*Set right margin to RightColumnWidth*/
- }
- #rightcolumn{
- float: left;
- width: 200px; /*Width of right column in pixels*/
- margin-left: -200px; /*Set left margin to -(RightColumnWidth) */
- background: #FDE95E;
- }
- #footer{
- clear: left;
- width: 100%;
- background: black;
- color: #FFF;
- text-align: center;
- padding: 4px 0;
- }
- #footer a{
- color: #FFFF80;
- }
- .innertube{
- margin: 10px; /*Margins for inner DIV inside each column (to provide padding)*/
- margin-top: 0;
- }
- </style>
- </head>
- <body>
- <div id=”maincontainer”>
- <div id=”topsection”><div class=”innertube”>
- <h1>Simpegda</h1><br />
- <a href=”<?=$website?>home” >Home</a> |
- <a href=”<?=$website?><?=$a_url?>/nominatif” >Nominatif</a> |
- <a href=”<?=$website?><?=$a_url?>/rekapitulasi” >Rekapitulasi</a> |
- <?php
- echo ’menua menub menuc menud menue menuf’; ?>
- </div></div>
- <div id=”contentwrapper”>
- <div id=”contentcolumn”>
- <div class=”innertube”>
- <!–// isi–>
- <?php isi(); ?>
- <!–//end isi–>
- <br /><hr />
- <?php
- echo ’<b>website : </b> ’.$website.’<br>’;
- echo ’<b>$a_url : </b> ’.$a_url.’<br>’;
- echo ’<b>$b_url : </b> ’.$b_url.’<br>’;
- echo ’<b>$c_url : </b> ’.$c_url.’<br>’;
- ?>
- </div>
- </div>
- </div>
- <div id=”rightcolumn”>
- <div class=”innertube”><?php menu_skpd(); ?></div>
- </div>
- <div id=”footer”>© 2008 <a href=”http://www.gecko.web.id”>www.gecko.web.id</a> </div>
- </div>
- </body>
- </html>
2. gecko.php
- <?
- // DATABASE
- //==============//
- $db_host = ”localhost”;
- $db_user = ”root”;
- $db_pass = ”sipit”;
- $db_name = ”simpegda”;
- // KONEKSI KE DATABASE
- //=========================//
- $link = mysql_pconnect ($db_host, $db_user, $db_pass) or die (“Ga bisa connect”);
- mysql_select_db ($db_name) or die (“Ga bisa select database”);
- $host = ’http://’.$_SERVER['HTTP_HOST'];
- $directory = dirname($_SERVER["SCRIPT_NAME"]);
- $website = $directory == ’/' ? $host.’/' : $host.$directory.’/';
- /********************************************
- //================================//
- // MENDAPATKAN SEO URL
- //================================//
- ==>> konsep directory ::
- simpol/dinas/aksinya/detailnya.htm
- + all/biodata/510142744.htm
- + bkd/nominatif
- + all/cari/eko.htm
- -a- / -b- / -c- .htm
- *********************************************/
- $url = explode(‘/’,clean(cleanXSS($_SERVER['REQUEST_URI'])));
- $a_url = $url[2];
- $a_url = explode(‘.’,$a_url);
- $a_url = $a_url[0];
- $b_url = $url[3];
- $b_url = explode(‘.’,$b_url);
- $b_url = $b_url[0];
- $c_url = $url[4];
- $c_url = explode(‘.’,$c_url);
- $c_url = $c_url[0];
- if (!$a_url) { $a_url = ’home’; }
- //==================================//
- // MODULs
- //==================================//
- // Isi
- function isi() {
- global $a_url, $b_url, $c_url;
- switch(true) {
- case ($a_url == home) :
- echo ’Anda berada di halaman depan (home) dan disini akan diisi statistik pegawai secara umum. $a_url diset semua pegawai’;
- break;
- case ($b_url == nominatif):
- echo ’Nominatif ’.$a_url;
- include(“modul/nominatif.php”);
- break;
- case ($b_url == rekapitulasi):
- echo ’Rekapitulasi ’.$a_url;
- break;
- case isset($c_url): break;
- }
- }
- // menu DKPD
- function menu_skpd() {
- global $link, $website, $a_url, $b_url, $c_url ;
- $sql = mysql_query(“SELECT tampil,skpd_singkat,skpd_sef FROM skpd where skpd.tampil = 1 order by skpd.skpd_singkat ASC”) or die(mysql_error());
- while ($res=mysql_fetch_array($sql)) {
- echo ’<a href=”‘.$website.$res['skpd_sef'].’/’.$b_url.’/’.$c_url.’”>’.$res['skpd_singkat'].’</a><br>’;
- }
- mysql_free_result($sql);
- }
- //==================================//
- // FUNCTIONs
- //==================================//
- // XSS CLEAN
- function cleanXSS($val) {
- # source from http://quickwired.com/kallahar/smallprojects/php_xss_filter_function.php
- $val = preg_replace(‘/([x00-x08][x0b-x0c][x0e-x20])/’, ”, $val);
- $search = ’abcdefghijklmnopqrstuvwxyz’;
- $search .= ’ABCDEFGHIJKLMNOPQRSTUVWXYZ’;
- $search .= ’1234567890!@#$%^&*()’;
- $search .= ’~`”;:?+/={}[]-_|’\';
- for ($i = 0; $i < strlen($search); $i++) {
- $val = preg_replace(‘/(&#[x|X]0{0,8}’.dechex(ord($search[$i])).’;?)/i’, $search[$i], $val);
- $val = preg_replace(‘/(�{0,8}’.ord($search[$i]).’;?)/’, $search[$i], $val);
- }
- $ra1 = Array(‘javascript’, ’vbscript’, ’expression’, ’applet’, ’meta’, ’xml’, ’blink’, ’link’, ’style’, ’script’, ’embed’, ’object’, ’iframe’, ’frame’, ’frameset’, ’ilayer’, ’layer’, ’bgsound’, ’title’, ’base’);
- $ra2 = Array(‘onabort’, ’onactivate’, ’onafterprint’, ’onafterupdate’, ’onbeforeactivate’, ’onbeforecopy’, ’onbeforecut’, ’onbeforedeactivate’, ’onbeforeeditfocus’, ’onbeforepaste’, ’onbeforeprint’, ’onbeforeunload’, ’onbeforeupdate’, ’onblur’, ’onbounce’, ’oncellchange’, ’onchange’, ’onclick’, ’oncontextmenu’, ’oncontrolselect’, ’oncopy’, ’oncut’, ’ondataavailable’, ’ondatasetchanged’, ’ondatasetcomplete’, ’ondblclick’, ’ondeactivate’, ’ondrag’, ’ondragend’, ’ondragenter’, ’ondragleave’, ’ondragover’, ’ondragstart’, ’ondrop’, ’onerror’, ’onerrorupdate’, ’onfilterchange’, ’onfinish’, ’onfocus’, ’onfocusin’, ’onfocusout’, ’onhelp’, ’onkeydown’, ’onkeypress’, ’onkeyup’, ’onlayoutcomplete’, ’onload’, ’onlosecapture’, ’onmousedown’, ’onmouseenter’, ’onmouseleave’, ’onmousemove’, ’onmouseout’, ’onmouseover’, ’onmouseup’, ’onmousewheel’, ’onmove’, ’onmoveend’, ’onmovestart’, ’onpaste’, ’onpropertychange’, ’onreadystatechange’, ’onreset’, ’onresize’, ’onresizeend’, ’onresizestart’, ’onrowenter’, ’onrowexit’, ’onrowsdelete’, ’onrowsinserted’, ’onscroll’, ’onselect’, ’onselectionchange’, ’onselectstart’, ’onstart’, ’onstop’, ’onsubmit’, ’onunload’);
- $ra = array_merge($ra1, $ra2);
- $found = true;
- while ($found == true) {
- $val_before = $val;
- for ($i = 0; $i < sizeof($ra); $i++) {
- $pattern = ’/';
- for ($j = 0; $j < strlen($ra[$i]); $j++) {
- if ($j > 0) {
- $pattern .= ’(‘;
- $pattern .= ’(&#[x|X]0{0,8}([9][a][b]);?)?’;
- $pattern .= ’|(�{0,8}([9][10][13]);?)?’;
- $pattern .= ’)?’;
- }
- $pattern .= $ra[$i][$j];
- }
- $pattern .= ’/i’;
- $replacement = substr($ra[$i], 0, 2).’<x>’.substr($ra[$i], 2);
- $val = preg_replace($pattern, $replacement, $val);
- if ($val_before == $val) {$found = false;}
- }
- }
- $allowedtags = ”<strong><em><ul><li><pre><hr><blockquote><span>”;
- $cstring = strip_tags($val, $allowedtags);
- $cstring = nl2br($cstring);
- return $cstring;
- }
- // CLEAN - cleaning query
- function clean($query) {
- if (get_magic_quotes_gpc()) {$query = stripslashes($query);}
- $query = mysql_real_escape_string($query);
- return $query;
- }
- ?>
3. .htaccess
- <ifmodule mod_php4.c=”">
- php_value session.use_trans_sid 0
- </ifmodule>
- <ifmodule mod_security.c=”">
- SecFilterEngine Off
- SecFilterScanPOST Off
- </ifmodule>
- RewriteEngine On
- RewriteCond %{REQUEST_FILENAME} !-f
- RewriteCond %{REQUEST_FILENAME} !-d
- RewriteCond %{REQUEST_FILENAME} !-l
- RewriteRule ^.* index.php
4. nominatif.php
- <table width=”100%” border=”1″>
- <tr>
- <td align=”center” valign=”middle”>No.</td>
- <td align=”center” valign=”middle”>Nama /<br />
- NIP</td>
- <td align=”center” valign=”middle”>Tempat /<br />
- Tanggal Lahir </td>
- <td align=”center” valign=”middle”>GR / TMT </td>
- <td align=”center” valign=”middle”>Pendidikan</td>
- <td align=”center” valign=”middle”>Jabatan</td>
- <td align=”center” valign=”middle”>Alamat</td>
- </tr>
- <tr>
- <td align=”center” valign=”top”>1</td>
- <td align=”center” valign=”top”>2</td>
- <td align=”center” valign=”top”>3</td>
- <td align=”center” valign=”top”>4</td>
- <td align=”center” valign=”top”>5</td>
- <td align=”center” valign=”top”>6</td>
- <td align=”center” valign=”top”>7</td>
- </tr>
- <tr>
- <td align=”left” valign=”top”> </td>
- <td align=”left” valign=”top”> </td>
- <td align=”left” valign=”top”> </td>
- <td align=”left” valign=”top”> </td>
- <td align=”left” valign=”top”> </td>
- <td align=”left” valign=”top”> </td>
- <td align=”left” valign=”top”> </td>
- </tr>
- </table>
Memang belum berwujud sebuah simpeg. Karena memang masih dihari pertama. Di hari berikutnya kita lanjutkan lagi.. kalo ada script yang salah, kurang bagus mohon dikomentari. TNX
Hanya 300 Ribu Anda Sudah Dapat Web+DesainNya