Artikel Pemrograman

Membuat File Upload Sederhana dengan PHP

noreply@blogger.com (Red Alret) — Mon, 04 Apr 2011 11:07:00 +0000

Sebagai tambahan artikel, tidak ada salahnya menuliskan bagaimana cara membuat file upload sederhana dengan php. Sudah banyak tutorial tapi saya menuliskan di blog saya ini sebagai catatan saya, kalau besok saya butuhkan lagi. Langsung saja kita membuat nya
1. Buat file index.php

<head>
<title>Upload File sederhana</title>
</head>

<body>
Contoh Upload File sederhana
<form action="upload_exe.php" method="post" enctype="multipart/form-data" name="form1">
  Pilih File : 
  <label>
  <input type="file" name="file">
  </label>
  <label>
  <input type="submit" name="Submit" value="Upload">
  </label>
</form>
</body>
</html>

2. Simpan di dalam folder upload, dan didalam nya nanti akan otomatis membuat folder/direktory images. Simpan syntax dibawah dengan nama upload_exe.php.

<?php
//terima file dari user
$fname = $_FILES['file']['name']; //nama filenya
$ftype = $_FILES['file']['type']; //tipe filenya
$fsize = $_FILES['file']['size']; //ukuran filenya
$ftemp = $_FILES['file']['tmp_name']; //direktori penyimpanan sementara file


$error = "";

if(empty($fname))
$error = "Nama file tidak boleh kosong. <br>";


if(!$ftype == "image/jpeg" OR !$ftype == "image/pjpeg" OR !$ftype == "image/x-png" OR !$ftype == "image/gif")
$error .= "File yang diupload harus berupa gambar dengan format JPEG/PJPEG/PNG/GIF.<br>";


@ $baca_dir = opendir('images/');
if(!$baca_dir)
{
mkdir('images/', 0777);
}


if(!copy($ftemp, "images/$fname"))
$error .= "Tidak bisa memindahkan file gambar ke direktori. <br>";

if($error == "")
echo "File berhasil diupload";
else
echo $error;
?>

Akan saya jelaskan sedikit mengenai syntax diatas. Contoh Upload file diatas merupakan upload file gambar dilihat dari syntax yang seperti potongan syntax yang di ambil dari upload_exe.php seperti dibawah ini :

if(!$ftype == "image/jpeg" OR !$ftype == "image/pjpeg" OR !$ftype == "image/x-png" OR !$ftype == "image/gif")
$error .= "File yang diupload harus berupa gambar dengan format JPEG/PJPEG/PNG/GIF.<br>";

Kemudian fungsi membuat otomatis direktory atau folder sendiri dengan nama images seperti syntax berikut ini, untuk 0777 merupakan hak permission dalam server linux untuk memberikan hak boleh menulis dalam folder tersebut:

@ $baca_dir = opendir('images/');
if(!$baca_dir)
{
mkdir('images/', 0777);
}

Terakhir adalah file yang tersimpan di server kita copy ke dalam folder images dengan syntax:

copy($ftemp, "images/$fname")

Semoga membantu teman-teman, dalam mempelajari PHP.

Membuat Radom Postingan di Blogger

noreply@blogger.com (Red Alret) — Mon, 28 Mar 2011 14:53:00 +0000

Ini merupakan cara agar artikel / postingan yang kita buat bisa terbaca, karena radom maka pengunjung blog kita akan tahu ada artikel menarik selain yang mereka cari. Langsung saja kita memulai nya :
1. Login ke blogger anda, dan masuk ke Rancangan / Layout --> Edit HTML.
2. Cari "]]></b:skin>" dan inputkan code dibawah ini diatasnya.

.gfg-root { width: auto; height: auto; position: relative; overflow: hidden; text-align: center; font-family: verdana, sans-serif;font-size: 12px;padding:2px; background:none;border: 0px solid #363636;}

.gfg-title {font-size: 16px;font-weight : bold;color : #fff;background-color: none;line-height : 1.4em;overflow: hidden;white-space : nowrap;}

.gfg-subtitle {font-size: 14px;font-weight: bold;color: #333;background-color: none;line-height : 1.4em; overflow : hidden;white-space : nowrap;margin-bottom : 0px;}

.gfg-subtitle a {color : #a43434;display:none !important;}

.gfg-entry {background-color: none;width : 100%;height : 9.9em;position : relative;overflow : hidden;text-align : left;margin-top : 0px;}

/* To allow correct behavior for overlay */
.gfg-root .gfg-entry .gf-result {position : relative;background-color:none;width : auto;height : 100%;padding-left : 5px;padding-right : 5px;}

.gfg-list {position : relative;overflow : hidden;text-align : left; margin-bottom : 15px;display:none !important;}

.gfg-root .gfg-entry .gf-result .gf-title {font-size: 13px;display:block;color:#a43434;font-weight:bold;line-height: 1.2em;overflow : hidden;white-space : nowrap;text-overflow : ellipsis;-o-text-overflow : ellipsis;margin-top : 4px;}

.gfg-root .gfg-entry .gf-result .gf-snippet {line-height : 1.3em;color: #333;margin-top : 3px;font-size: 12px;}

.clearFloat {clear : both;}

#feedGadget { margin-top: 3px;margin-left: auto;margin-right: auto;width: auto;font-family:verdana, arial;font-size: 10px;color: #333;}

3. Simpan templatenya, kemudaian pilih Elemen laman.
4. Bikin Gadget --> Javascript/HTML, copykan code dibawah ini.

<script 
src="http://www.google.com/jsapi/?key=ABQIAAAAcV2jSs52yGHKNXjYTcwvNBQjGizh_00DUHOFTBoYdXcXzGgaZxRGIm148GyVsULR8I1--uCF7hoW2w"
 type="text/javascript"></script>



<script 
src="http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.js"
 type="text/javascript"></script>



<script type="text/javascript">

function showGadget() {

var feeds = [

{title:'title',

url:'http://namablog.blogspot.com/feeds/posts/default?redirect=false&start-index=1&max-results=999'},

];

new GFdynamicFeedControl(feeds, 'feedGadget',

{numResults : 1000, stacked : true,

title: " "});

}

google.load("feeds", "1");

google.setOnLoadCallback(showGadget);

</script>

<div id="feedGadget"><center><img 
src="http://img80.imageshack.us/img80/1577/loadingtrans.gif" 
/></center></div>

5. Jangan lupa edit

http://namablog.blogspot.com

Dengan nama Blog anda.

Silahkan lihat hasilnya dengan lihat blog /view blog.

Rangkaian Kabel UTP ( Straight Through dan Cross Over )

noreply@blogger.com (Red Alret) — Sun, 27 Mar 2011 14:40:00 +0000

Waktu dulu masih kerja di jaringan, memasang rangkaian kabel UTP mungkin sudah di luar kepala. Namun kalau sudah lama tidak menangani kasus pemasangan jaringan saya bisa lupa. Maklum manusia tempat salah dan lupa, untuk dibagi ilmunya dan sebagai catatan kalau-kalau saya lupa urutan kabelnya. Maka saya catat saja rangkaian kabelnya.

Kita mengunakan Kabel UTP dan RG45 serta Tang Krimping untuk mengunci kabel dengan RG45. Didalam Kabel UTP terdapat 8 kabel yang berbeda yaitu berwarna Putih Orange, Orange,Putih Hijau, Hijau, Putih Biru, Biru , Putih Coklat, Coklat. Sedangkan UTP sendiri singkatan dari Unshielded Twisted Pair. Langsung saja ke prakteknya dibawah ini.

Pemasangan kabel UTP terbagi dua jenis. Straight Through dan Cross Over:

1. Straight Through

Rangkaian kabel ini dipakai untuk LAN Ethernet 10 BaseT, untuk menghubungkan PC dengan HUB/SWITCHSecara warna, urutan kabel pada saat dipasang pada konektor RJ 45 adalah :
Pin 1 : Putih/Oranye
Pin 2 : Oranye
Pin 3 : Putih/Hijau
Pin 4 : Biru
Pin 5 : Putih Biru
Pin 6 : Hijau
Pin 7 : Putih/Coklat
Pin 8 : Coklat

2. Cross Over

Kabel ini biasanya dipakai untuk menghubungkan HUB/SWITCH dengan HUB/SWITCH yang lain.
Urutan pemasangan :
Salah satu sisi kabel menggunakan “Straight Through”, dan sisi kabel lainnya, menggunakan “Cross-Over” (“Kabel ini menggunkan 2 Rangkaian”):
Pin 1 : Putih/Hijau
Pin 2 : Hijau
Pin 3 : Putih/Oranye
Pin 4 : Biru
Pin 5 : Putih/Biru
Pin 6 : Oranye
Pin 7 : Putih/Coklat
Pin 8 : Coklat

Membuat Mode Saving Energy di Blogger

noreply@blogger.com (Red Alret) — Fri, 25 Mar 2011 15:11:00 +0000

Waktu saya mengunjungi blog teman, saat saya tinggal ke blog lainnya tiba-tiba tampilan gelap. Ternyata blog tersebut mengunakan Energy Saving Mode, apabila mouse anda gerakkan maka tampilan utama akan segera muncul. Bagi teman-teman yang ingin mengunakannya kalian dapat mengunjungi http://www.onlineleaf.com/.

Kalau sudah ke alamat tersebut, silahkan cari tulisan "install the standby engine". Di Klik saja, maka akan muncul halaman yang menampilkan source code seperti dibawah ini:

<script language="javaScript" type="text/javascript" src="http://www.onlineleaf.com/savetheenvironment.js"></script>

Atau anda bisa langsung copy paste code diatas, dan sisipkan ke tag HTML di atas "</head>". Setelah itu simpan, dan lihat beberapa saat kemudian apa yang terjadi di tampilan blog anda. Akan menjadi gelap, karena script tersebut akan membuat hemat energy yang digunakan. Silahkan mencoba

Membuat Menu Drop Down dengan CSS

noreply@blogger.com (Red Alret) — Fri, 25 Mar 2011 14:02:00 +0000

Kali ini saya mendapatkan syntax atau script menu drop down mengunakan css. Dari pada disimpan di dalam buku ataupun disimpan di komputer, takutnya lupa diletakkan dimana ataupun file nya hilang terkena virus ataupun format ulang. Lebih baik saya simpan di blog saya ini, mungkin sudah banyak artikel yang sama. Langsung saja kita memulai membuat menu drop down.

Membuat struktur Menu Drop Down, dengan HTML seperti dibawah ini

<ul id="menudropdown">
    <li><a href="#">Home</a></li>    
    <li><a href="#">Artikel</a>
        <ul>
            <li><a href="#">PHP</a></li>
            <li><a href="#">CSS</a></li>
            <li><a href="#">JavaScript</a></li>
        </ul>
    </li>
    <li><a href="#">About US</a></li>
</ul>

Membuat layout menu dengan CSS, supaya lebih tertata rapi. Silahkan copy dan letakkan di atas "</head>".

body{
font-size:0.85em;
font-family:Verdana, Arial, Helvetica, sans-serif;
}
#menudropdown, #menudropdown ul{
margin:0;
padding:0;
list-style-type:none;
list-style-position:outside;
position:relative;
line-height:25px; 
}

#menudropdown a{
display:block;
padding:0px 5px;
border:1px solid #333;
color:#fff;
text-decoration:none;
background-color:#333;
}

#menudropdown a:hover{
background-color:#fff;
color:#333;
}

#menudropdown li{
float:left;
position:relative;
}

#menudropdown ul {
position:absolute;
display:none;
width:12em;
top:25px;
}

#menudropdown li ul a{
width:12em;
height:auto;
float:left;
}

#menudropdown ul ul{
top:auto;
} 

#menudropdown li ul ul {
left:12em;
margin:0px 0 0 10px;
}

#menudropdown li:hover ul ul, #menudropdown li:hover ul ul ul, #menudropdown li:hover ul ul ul ul{
display:none;
}
#menudropdown li:hover ul, #menudropdown li li:hover ul, #menudropdown li li li:hover ul, #menudropdown li li li li:hover ul{
display:block;
}

Akan saya terangkan masing-masing CSS diatas. Silahkan mengedit bila anda sudah memahami syntax-syntax dibawah ini :
Keterangan I

#menudropdown, #menudropdown ul{
    margin:0;
    padding:0;
    list-style-type:none;
    list-style-position:outside;
    position:relative;
    line-height:1.5em;
}

Kode CSS diatas akan menghilangkan identasi pada browser dan membuang semua tanda bullet pada #nav dan semua elemen yang ada didalamnya. Kode "position:relative;" digunakan untuk menyusun ulang posisi menu yang akan ditempatkan secara relative dan absolute. Hal ini nantinya digunakan untuk menata menu-menu berikutnya yang akan disusun sesuai dengan isi blok serta atribut-atribut lainnya. Kode "line-height:1.5em;" digunakan untuk mendefinisikan tinggi setiap item menu. Kita dapat mengesetnya sesuai dengan tinggi yang kita inginkan, tetapi link teks akan berada pada posisi center secara vertikal hal ini makanya kita tidak memerlukan pengesetan margin dan padding pada kode CSS in

Keterangan II

/* keadaan menu normal, aktif dan pernah diakses */
#menudropdown a:link, #menudropdown a:active, #menudropdown a:visited {
   display:block; /* link menu di blok */
   padding:0px 5px; /* jarak atas bawah 0 dan kiri kanan 5 pixel */
   border:1px solid #333; /* ketebalan garis pinggir dan warna garis */
   color:#fff; /* warna teks */
   text-decoration:none; /* menghilangkan garis bawah pada link menu */
   background-color:#333; /* warna latar belakang menu */
}
/*  keadaan menu saat dipilih */
#menudropdown a:hover {
   background-color:#fff; /* warna latar belakang menu */
   color:#333; /* warna huruf */
}

Kode CSS diatas ini pelengkap dari kode CSS sebelumnya, hal ini untuk membedakan efek pada menu yang sedang dipilih (hover) dengan menu yang tidak dipilih. Pada saat keadaan menu normal, aktif, dan pernah diakses maka menu memiliki tampilan yang sama.

Keterangan III

#menudropdown li {
   float:left; /* menu ditempatkan pada sebelah kiri */
   position:relative; /* posisi relatif */
}

Kode Diatas digunakan untuk menjadikan menu horizontal.

Keterangan IV

#menudropdown ul {
   position:absolute; /* posisi absolute */
   width:12em; /* lebar menu */
   top:1.5em; /* jarak menu bagian atas */
   display:none; /* menu disembunyikan */
}

Kode CSS diatas digunakan untuk menyembunyikan menu berikutnya (menu utama tetap tampil). Lebar masing-masing menu ditetapkan 12em (width:12em;) hal ini agar menu memiliki ukuran tetap, jika kurang anda bisa set lebih lebar lagi. Jarak 1.5em (top:1.5em;) harus sama dengan jarak yang telah ditetapkan sebelumnya di kode CSS "line-height:1.5em;" pada #menudropdown (lihat keterangan 2)

Keterangan V

#menudropdown li ul a {
   width:12em;
   float:left;
}

Kode CSS diatas digunakan untuk mengeset lebar link menu selebar 12em.

Keterangan VI

#menudropdown ul ul{
 top:auto;
} 
#menudropdown li ul ul {
   left:12em;
   margin:0px 0 0 10px;
}
#menudropdownli:hover ul ul, #menudropdown li:hover ul ul ul, #menudropdown li:hover ul ul ul ul{
   display:none;
}
#menudropdown li:hover ul, #menudropdown li li:hover ul, #menudropdown li li li:hover ul, #menudropdown li li li li:hover ul{
   display:block;
}

#menudropdown ul ul dan #menudropdown li ul ul digunakan untuk memperbaiki penempatan menu. Hal ini sangat penting untuk memperbaiki posisi menu saat dipilih (hover) dan susunan tingkatnya.

Silahkan Download Sourcode Disini

Membuat Menu Horizontal di Blog

noreply@blogger.com (Red Alret) — Fri, 25 Mar 2011 02:17:00 +0000

Membuat Blog kita tampil beda dari yang lain memang membuat kita tertantang, salah satunya dengan menambahkan Menu Horizontal pada bagian atas. Untuk mempermudah pengunjung memilih kategori halaman yang akan di lihat nya. Artikel ini juga sudah banyak yang menulis, namun tidak ada salahnya saya menuliskan kembali ke blog saya, bila sewaktu-waktu nanti saya membutuhkannya. Dan sebagai catatan saya dan bagi anda yang ingin belajar. Baik kita mulai saja, pertama yang harus anda lakukan adalah anda sudah masuk atau login ke blog anda.

1. Pilih Rancangan atau Layout, kemudian pilih Edit HTML kemudian cari "]]>", untuk mempercepat silahkan gunakan ctrl + f untuk mencari syntax tersebut.

2. Copykan code CSS dibawah ini diatas syntax "]]>.

/*CSS untuk menu horizontal*/

.menuhorizontal ul{
font: bold 13px arial;
padding-left: 0;
margin-left: 0;
height: 30px;
}

.menuhorizontal ul li{
list-style: none;
display: inline;
}

.menuhorizontal ul li a{
padding: 2px 0.5em;
text-decoration: none;
float: left;
color: black;
background-color: #999999; /*warna disesuaikan dengan layout anda*/
border: 2px solid #999999; /*warna disesuaikan dengan layout anda*/
}

.menuhorizontal ul li a:hover{
background-color: #333333; /*warna disesuaikan dengan layout anda*/
border-style: outset;
}

Kemudian simpan template.

3. Kemudian kembali ke Elemen laman, silahkan tambahkan Gadget HTML/JavaScript. Kemudian copykan syntax dibawah ini.

<ul>
<li><a href="#">Home</a></li><!-- Tanda # diganti dengan URL -->
<li><a href="#">Tutorial Website</a></li>
<li><a href="#">About Me</a></li>
</ul>

Silahkan simpan dan refresh / lihat layout anda, silahkan edit sesuai keinginan anda apabila ada yang tidak pas dengan tampilan /warna.

NB : Silahkan backup template anda sebelum anda mengedit, jika terjadi error dapat segera memperbaiki.

Membuat Navigasi Halaman (Next-Page) di Blogger

noreply@blogger.com (Red Alret) — Thu, 24 Mar 2011 16:20:00 +0000

Mungkin sudah banyak artikel yang membahas tentang membuat navigasi Next - Page, mungkin ada dari kalian yang ingin tahu bagaimana membuat halaman 1, 2, 3,.....Next.

1. Login ke blog kalian dan pilih Rancangan atau Layout
2. Tambahkan Gadget pada bagian Fotter ( Add Page Element / Gedget --> HTML/Javascrip )
3. Sebelumnya download dulu script Navigasinya disini
4. Copykan hasil file download anda tadi ke Gadget yang baru saja kalian tambahkan.

NB :
untuk mengatur jumlah dalam satu halaman lihat
var pageCount=5; (ada 5 posting tiap halaman)
bisa diganti sesuai keinginan .kalau ingin dalam satu halaman menampilkan 10 postingan ganti dengan
var pageCount=10;

Menuliskan Code HTML dengan Syntax Highlighter di Blogger

noreply@blogger.com (Red Alret) — Thu, 24 Mar 2011 15:20:00 +0000

Awalnya saya juga bingung, bagaimana untuk menuliskan syntax-syntax HTML dan PHP seperti yang ada di web site atau blog orang lain. Setelah saya cari-cari saya dapatkan cara nya dengan "Syntax Highlighter". Saya menemukan cara pemakaiannya di blog tetangga, mungkin karena saya ingin menyimpan dan berbagi ilmu. Tidak ada salahnya saya tuliskan kembali, langsung saja kita memulainya.

1. Masuk atau Login ke Blog anda,setelah masuk pilih Rancangan --> Edit HTML. Untuk keamanan sebaiknya anda membackup Template yang sudah anda, kalau-kalau ada kesalahan anda dapat langsung memperbaikinya dengan replace. Cara backup dengan cara mengklik "Download Tempalte Lengkap".

2. Kalau sudah Tambahkan code css di bawah ini ke bagian sebelum "]]>". Dengan ctrl+Find anda dapat segera mencarinya.

.dp-highlighter
{
 font-family: "Consolas", "Monaco", "Courier New", Courier, monospace;
 font-size: 12px;
 background-color: #E7E5DC;
 width: 99%;
 overflow: auto;
 margin: 18px 0 18px 0 !important;
 padding-top: 1px; /* adds a little border on top when controls are hidden */
}

/* clear styles */
.dp-highlighter ol,
.dp-highlighter ol li,
.dp-highlighter ol li span 
{
 margin: 0;
 padding: 0;
 border: none;
}

.dp-highlighter a,
.dp-highlighter a:hover
{
 background: none;
 border: none;
 padding: 0;
 margin: 0;
}

.dp-highlighter .bar
{
 padding-left: 45px;
}

.dp-highlighter.collapsed .bar,
.dp-highlighter.nogutter .bar
{
 padding-left: 0px;
}

.dp-highlighter ol
{
 list-style: decimal; /* for ie */
 background-color: #fff;
 margin: 0px 0px 1px 45px !important; /* 1px bottom margin seems to fix occasional Firefox scrolling */
 padding: 0px;
 color: #5C5C5C;
}

.dp-highlighter.nogutter ol,
.dp-highlighter.nogutter ol li
{
 list-style: none !important;
 margin-left: 0px !important;
}

.dp-highlighter ol li,
.dp-highlighter .columns div
{
 list-style: decimal-leading-zero; /* better look for others, override cascade from OL */
 list-style-position: outside !important;
 border-left: 3px solid #6CE26C;
 background-color: #F8F8F8;
 color: #5C5C5C;
 padding: 0 3px 0 10px !important;
 margin: 0 !important;
 line-height: 14px;
}

.dp-highlighter.nogutter ol li,
.dp-highlighter.nogutter .columns div
{
 border: 0;
}

.dp-highlighter .columns
{
 background-color: #F8F8F8;
 color: gray;
 overflow: hidden;
 width: 100%;
}

.dp-highlighter .columns div
{
 padding-bottom: 5px;
}

.dp-highlighter ol li.alt
{
 background-color: #FFF;
 color: inherit;
}

.dp-highlighter ol li span
{
 color: black;
 background-color: inherit;
}

/* Adjust some properties when collapsed */

.dp-highlighter.collapsed ol
{
 margin: 0px;
}

.dp-highlighter.collapsed ol li
{
 display: none;
}

/* Additional modifications when in print-view */

.dp-highlighter.printing
{
 border: none;
}

.dp-highlighter.printing .tools
{
 display: none !important;
}

.dp-highlighter.printing li
{
 display: list-item !important;
}

/* Styles for the tools */

.dp-highlighter .tools
{
 padding: 3px 8px 3px 10px;
 font: 9px Verdana, Geneva, Arial, Helvetica, sans-serif;
 color: silver;
 background-color: #f8f8f8;
 padding-bottom: 10px;
 border-left: 3px solid #6CE26C;
}

.dp-highlighter.nogutter .tools
{
 border-left: 0;
}

.dp-highlighter.collapsed .tools
{
 border-bottom: 0;
}

.dp-highlighter .tools a
{
 font-size: 9px;
 color: #a0a0a0;
 background-color: inherit;
 text-decoration: none;
 margin-right: 10px;
}

.dp-highlighter .tools a:hover
{
 color: red;
 background-color: inherit;
 text-decoration: underline;
}

/* About dialog styles */

.dp-about { background-color: #fff; color: #333; margin: 0px; padding: 0px; }
.dp-about table { width: 100%; height: 100%; font-size: 11px; font-family: Tahoma, Verdana, Arial, sans-serif !important; }
.dp-about td { padding: 10px; vertical-align: top; }
.dp-about .copy { border-bottom: 1px solid #ACA899; height: 95%; }
.dp-about .title { color: red; background-color: inherit; font-weight: bold; }
.dp-about .para { margin: 0 0 4px 0; }
.dp-about .footer { background-color: #ECEADB; color: #333; border-top: 1px solid #fff; text-align: right; }
.dp-about .close { font-size: 11px; font-family: Tahoma, Verdana, Arial, sans-serif !important; background-color: #ECEADB; color: #333; width: 60px; height: 22px; }

/* Language specific styles */

.dp-highlighter .comment, .dp-highlighter .comments { color: #008200; background-color: inherit; }
.dp-highlighter .string { color: blue; background-color: inherit; }
.dp-highlighter .keyword { color: #069; font-weight: bold; background-color: inherit; }
.dp-highlighter .preprocessor { color: gray; background-color: inherit; }

4. Tambahkan code di bawah ini ke bagian sebelum "</head?>".

<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shCore.js' type='text/javascript'></script>  
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCpp.js' type='text/javascript'></script>  
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCSharp.js' type='text/javascript'></script>  
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCss.js' type='text/javascript'></script>  
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushDelphi.js' type='text/javascript'></script>  
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushJava.js' type='text/javascript'></script>  
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushJScript.js' type='text/javascript'></script>  
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushPhp.js' type='text/javascript'></script>  
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushPython.js' type='text/javascript'></script>  
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushRuby.js' type='text/javascript'></script>  
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushSql.js' type='text/javascript'></script>  
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushVb.js' type='text/javascript'></script>  
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushXml.js' type='text/javascript'><</script>

5. Tambahkan code di bawah ini sebelum bagian "</body >".

<script language="javascript">  
dp.SyntaxHighlighter.BloggerMode();  
dp.SyntaxHighlighter.HighlightAll('code');  
</script>

7. Untuk menggunakannya gunakan tag "pre" untuk mengapit code/syntax. Saat anda membuat posting baru tepatnya dengan "Edit HTML". Seperti dibawah ini :
<pre class="html" name="code">
<a href='/feeds/posts/default'>
</pre>
class disesuaikan dengan syntax yang akan ditampilkan misal HTML atau CSS. Hasil Syntax diatas sebagai berikut :

< a href='/feeds/posts/default'>

Secara manual untuk memposting HTML di Blog kamu harus:
1. Mengganti kode < dengan & l t ; (tanpa spasi)
2. Kode > diganti dengan & g t ; (tanpa spasi)
3. Kode " diganti dengan & q u o t; (tanpa spasi)

Menghubungkan Database Paradox ke Form

noreply@blogger.com (Red Alret) — Thu, 24 Feb 2011 14:25:00 +0000

Setelah anda membuat database / mengikuti artikel sebelumnya "Membuat Database di Delphi dengan Paradox", kita akan menampilkan tabel yang sudah kita buat ke media Form Delphi.Dengan cara sebagai berikut :
1. Siapkan Form baru
2. Pilih Component-component sebagai berikut :

- Data Control --> DBGrid
   - Data Control --> DBNavigator
   - Data Access --> DataSource
   - BDE --> Table

Atur seperti gambar dibawah ini:

Ubah Propertis component seperti dibawah ini :

Component Pallete Nama Object	Object Inspector
Component Pallete Nama Object	Properties	Keterangan
Table1	Database Name	db_univ
	Table Name	tbl_mhs.db
	Auto Refresh	True
	Active	True
DataSource1	Dataset	Table1
DBGrid	DataSource1	DataSource1
DBNavigator	DataSource1	DataSource1

Simpan jadikan satu dengan database yang telah dibuat. Silahkan klik Run / F9, silahkan di coba.
Gambar setelah program di jalankan.

Visual Basic 6.0 ( Tabel dengan Database Visdata )

noreply@blogger.com (Red Alret) — Thu, 17 Feb 2011 15:43:00 +0000

Di artikel saya sebelumnya sudah saya jelaskan cara membuat database melalui Visdata, sekarang kita menuju kepembuatan tabel di dalam database "DbMahasiswa.MDBS". Langkah - langkah membuat tabel mengunakan visdata sebagai berikut :
1. Klik kanan pada tulisan Propertis --> New Table, seperti gambar dibawah ini :

2. Akan muncul Table Structure, beri nama tabel / table name dengan nama "TblMhs". Seperti gambar dibawah ini:

3. Klik Add Field untuk membuat field baru seperti gambar dibawah ini :

4. Dan buatlah field seperti dibawah ini :

------------------------------
- Field Name    -   Type     -
------------------------------ 
- nim           - Text       -
- nama          - Text       -
- tmptlhr       - Text       -
- tgllhr        - Date/Time  -
- jurusan       - Text       -
- fakultas      - Text       -
- dosenwali     - Text       -
------------------------------

Setelah selesai pilih tombol Close. Akan seperti gambar dibawah ini :

5. Tambahkan index dangan menekan Add Index, buat index Name (nimsis) dan IndexedFields (nim). Seperti gambar dibawah ini:

Kalo sudah selesai klik tombol Close dan klik tombol Build the table.

Bagaimana teman-teman sekian dulu, kalo ada waktu kita teruskan lagi karena masih banyak yang ingin saya tulis. Terimakasih saya ucapkan sudah berkunjung diblog "Artikel Pemrograman".

Membuat Form Input Edit dan Hapus dengan PHP dan MySQL

noreply@blogger.com (Red Alret) — Thu, 17 Feb 2011 14:04:00 +0000

Kita belajar membuat form dengan data yang bisa di Input, di Edit, dan Hapus. Karena ini program sangat sederhana saya harap teman - teman bisa belajar dan langsung mempraktekkan di komputer anda langsung.
1. Buat Table "mahasiswa" dengan field-field seperti ini :

<?PHP
CREATE TABLE `mahasiswa` (
`id` INT( 5 ) NOT NULL AUTO_INCREMENT PRIMARY KEY ,
`nim` VARCHAR( 15 ) NOT NULL ,
`nama` VARCHAR( 100 ) NOT NULL ,
`fakultas` VARCHAR( 25 ) NOT NULL
) ENGINE = MYISAM ;
?>

2. Buat Form Input mahasiswa seperti dibawah ini :

3. Buat Form Edit seperti gambar di bawah ini :

4. Bagian membuat file execusi nya dengan PHP :

<?PHP

$nama=$_Post['nama'];
$nim=$_Post['nim'];
$fak=$_Post['fak'];
$ednama=$_Post['ednama'];
$ednim=$_Post['ednim'];
$edfak$_Post['edfak'];
$tblsave=$_Post['tblsave'];
$tbledit=$_Post['tbledit'];
$delete=$_Get['hapus'];
$delnim=$_Get['delnim'];


if($tblsave)
{
$cari=mysql_num_rows(mysql_query("select nim from mahasiswa where nim='$nim'"));
 if($cari>0)
 {
 $pesanerror="Maaf nim sudah dipakai";
 include"formmhs.php";
 }
 else
 {
 mysql_query("insert into mahasiswa (nim,nama,fak) values  ('$nim','$nama','$fak')");
 $pesan="Sukses ditambahkan";
 include"formmhs.php";
 }
else if($tbledit)
{
mysql_query("update mahasiswa set nama='$ednama',fak='$edfak' where nim='$ednim'");
include"lihatmhs.php";
}
else if($delete)
{
mysql_query("delete from mahasiswa where nim='$delnim'");
$pesan="Data berhasil di Hapus";
include"lihatmhs.php";
}
?>

5. Lihat Mahasiswa

<?PHP
$ambil=mysql_query("select * from mahasiswa");
while($tampil=mysql_fetch_array($ambil))
{
echo"Nim: $tampil[nim]<br>";
echo"Nama : $tampil[nama]<br>";
echo"Fakultas : $tampil[fakultas]<br><hr>";

?>

Selamat mencoba

Belajar Foxpro ( membuat database dan tabel )

noreply@blogger.com (Red Alret) — Mon, 14 Feb 2011 16:38:00 +0000

Saya hanya ingin berbagi ilmu walaupun sudah banyak artikel-artikel pemrograman, di sini saya hanya ingin menyimpan atau mengarsipkan apa yang pernah saya pelajari di waktu kuliah saya dulu. Disini kita akan belajar Foxpro 6.0, yaitu cara membuat database dan table di Foxpro 6.0. Baiklah kita langsung saja dengan cara sebagai berikut :

Tampilan utama program Visual Foxpro

1. Buka program Foxpro anda, pilih menu File --> New --> Database

Pilih New File --> simpan dengan nama "db_univ.dbc".

2. Akan muncul Form Database Designer, silahkan pilih form Database pilih New Table ( silahkan buat table sesuai rancangan anda). Gambar Form Database Designer dan Database :

3. Pilih Database --> New Table , simpan dengan nama table "tbl_dosen" ( silahkan di sesuaikan dengan rancangan anda). Akan muncul form

Contoh Rancangan Table Dosen :

1. Name : nip, Type : Character, Width : 10, Index : Asc

2. Name : nama, Type : Character, Width : 30

3. Name : dosen, Type : Character, Width : 30

Apabila sudah selesai merancang table, silahkan klik Ok maka akan muncul pilihan "Input data record now?" apabila anda memilih "Yes" maka anda akan dapat mengisi lansung table yang anda buat. Kalau anda memilih "No" maka anda dapat mengisi nya nanti, akan anda isikan melalui aplikasi atau manual.

1 .Gambar insert record :

2. Gambar Rancangan Table :

Disini anda sudah bisa membuat database dan merancang sebuah table.

Membuat Database di Delphi dengan Paradox

noreply@blogger.com (Red Alret) — Mon, 14 Feb 2011 16:38:00 +0000

Pada program Delphi 6 menyediakan database "Paradox", sekarang buat teman-teman yang ingin mengetahui bagaimana membuat database di Paradox. Mari ikuti langkah-langkah sebagai berikut :

1. Silahkan buka program Delphi anda, setelah itu pilih menu Tools --> Database Desktop, seperti gambar dibawah ini :

2. Maka akan muncul Form Database Desktop seperti gambar di bawah ini :

3. Selanjutnya pilih menu File --> New --> Table, seperti gambar dibawah ini :

4. Maka akan muncul Form Create Table --> Pilih Paradox 7 klik OK, seperti gambar di bawa ini :

5. Setelah itu akan muncul Form pembuatan Filed-filed tabel, seperti gambar dibawah ini :

Kalau sudah klik tombol Save As, simpan dengan nama table "tbl_mhs".

6. Agar mudah dan cepat saat membuka direktori tabel dimana disimpan kita gunakan cara sebagai beriku, pada Database Desktop pilih File --> Working Directory (pilih directory dimana anda menyimpan tabel).

7. Silahkan buka tabel tadi dan isikan data, silahkan mengisinya sesuai dengan selera anda. Dengan langkah pilih menu Table --> Edit Data (silahkan mengisi data table).

Bila sudah selesai dengan mengisi table silahkan tutup table, akan muncul "Do you want to save them?" Pilih Yes maka akan secara otomatis menyimpan di tbl_mhs. Artikel ini mungkin sudah banyak yang membuatnya namun saya ingin berbagi kepada teman-teman dan saya tulis kembali sebagai catatan. Terimakasih sudah berkunjung ke blog saya ini.

Catatan : jangan lupa membuat "Alias", alias digunakan untuk anda yang memiliki banyak tabel disimpan dalam satu folder dan agar lebih simpel maka dibuatkan alias. cara membuat alias :
Pada Database Desktop -- > Tools --> Alias Manager

1. Pilih "New"
2. Database Alias di isi dengan "db_univ"
3. Driver type "Standard" dan Path disesuaikan dimana anda menyimpan database dan table anda., dan klik Ok. Sampai disini anda sudah berhasil membuat Alias.

Instal Xampp dan Lampp di Linux

noreply@blogger.com (Red Alret) — Mon, 14 Feb 2011 16:36:00 +0000

Silahkan download langsung xampp untuk windows di link http://www.apachefriends.org/en/xampp-windows.html, dan untuk linux di http://www.apachefriends.org/en/xampp-linux.html. Untuk instalsi xampp di windows mungkin hanya next dan yang kita bahas disini cara menginstal nya di Linux ubuntu :

1. Masuk ke shell Linux sebagai root administrator :
#sudo su

2. Extract download anda ke direktori /opt :
#tar xvfz xampp-linux-1.7.4.tar.gz -C /opt
sekarang xampp sudah terinstal di /opt/lampp direktori.

3. Jalankan xammp melalui terminal sebagai root dengan mengetikan :
#/opt/lampp/lampp start
untuk menghentikannya ketikkan
#/opt/lampp/lampp stop.

4. Buka webbrowser anda dan ketikan localhost

5. Pengaturan chmod, ubah direktory xampp pada folder /opt menjadi 775 untuk memiliki hak akses baca, tulis dan menjalankan file, sedangkan orang lain hanya dapat membaca dan menjalankan file tersebut
#sudo chmod -R 775 /opt/lampp/
Sekarang langsung saja anda praktekkan langsung ke komputer anda, selamat mencoba.

Visual Basic 6 ( Membuat Database Dengan Visdata )

noreply@blogger.com (Red Alret) — Mon, 14 Feb 2011 16:34:00 +0000

Microsoft Visual Basic 6.0 dapat dihubungkan dengan file database seperti Microsoft Access, Dbase, Foxpro, Paradox dan lain-lain. Komponen yang dapat membuat dan memproses database yaitu dengan mengunakan VISDATA (Visual Daata Manager). Langsung saja kita belajar membuat database dengan nama "DtMahasiswa.Mdb". Untuk membuat database dari visdata dengan format Access dengan cara :
1. Pilih menu Add-Ins --> Visual Data Manager, maka akan muncul gambar seperti dibawah ini :

2. Pilih menu File --> New --> Microsoft Access --> Version 7.0 MDB, seperti gambar dibawah ini :

3. Setelah muncul kotak dialog "Select Microsoft Access Database to Create", buat database dengan nama "DtMahasiswa.Mdb", kemudian save/simpan.

4. Maka hasilnya akan seperti gambar dibawah ini :

Untuk membuat tabel ikuti artikel selanjutnya dalam Membuat tabel dengan database Visdata.

Perintah - Perintah Dasar MySQL

noreply@blogger.com (Red Alret) — Mon, 14 Feb 2011 16:34:00 +0000

Langsung saja kita praktekan pengunaan Perintah - perintah dasar MySQL :

1. CREATE DATABASE (membuat database baru)

Berikut ini syntax SQL nya "CREATE DATABASE database_name ;"

Contoh : membuat database dengan nama "COBA"

2. Melihat Database yang ada di Mysql, berikut ini syntax nya "SHOW DATABASES;"

3. Memilih atau mengaktifkan database, syntax nya "USE database_name ;"

Contoh : misal nama database nya "COBA"

USE COBA ;

2. CREATE TABEL (membuat tabel baru)

Perintah "CREATE TABEL" digunakan untuk membuat tabel baru di dalam database MySQL,

Membuat Buku Tamu dengan PHP dan MySQL

noreply@blogger.com (Red Alret) — Sun, 13 Feb 2011 12:11:00 +0000

Mungkin sudah banyak blog yang menampilkan pembuatan buku tamu dengan PHP dan Mysql, tapi tidak ada salahnya salah ingin berbagi dan menyimpan arsip ini didalam blog saya ini. Mari lansung saja kita praktekkan bagaimana membuat buku tamu dengan PHP dan MySQL.
1. Buat database dengan nama "contoh", setelah itu buat tabel dengan nama "bukutamu".

CREATE TABLE bukutamu 
(
id INT( 10 ) NOT NULL AUTO_INCREMENT PRIMARY KEY ,
nama VARCHAR( 50 ) NOT NULL ,
email VARCHAR( 100 ) NOT NULL ,
pesan TEXT NOT NULL
);

2. Buat Form Buku Tamu anda seperti gambar berikut, simpan dengan nama formbukutamu.php :

dengan source code seperti ini :


 Buku Tamu  
 Nama  :     
 Email  :   
 Pesan  :

3. Membuat halaman penyimpanan yang terhubung dengan MySQL, simpan dengan nama simpanbukutamu.php:

<?PHP

$server = "localhost"; //alamat server default biasanya localhost
$username = "root"; //user untuk database, default root
$password = ""; //password database, default biasanya kosong
$database = "contoh"; //nama database yang akan dipangil

// 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");


$nama=$_POST['nama'];
$email=$_POST['email'];
$pesan=$_POST['pesan'];

mysql_query("insert into bukutamu(nama,email,pesan)values('$nama','$email','$pesan')");
echo "<meta http-equiv=\"refresh\" content=\"2;url=formbukutamu.php\">";
?>

Bagi yang ingin belajar dan bingung langsung aja download source code nya
disini.

Menghubungkan MySQL dengan PHP

noreply@blogger.com (Red Alret) — Sun, 13 Feb 2011 08:56:00 +0000

Berikut ini contoh source code PHP untuk bisa terhubung dengan database MySQL :
1. Buat database dengan nama "contoh" :

2. Buat tabel dengan nama "datakelas" :

3. Input kan dengan data - data sebagai berikut :

4. Melihat data yang di inputkan berhasil masuk dalam tabel

Memulai dengan PHP ( membuat penghubung antara PHP dan Mysql ) berikut source code PHP nya :
1. Simpan dengan nama koneksi.php.

<?PHP
$server = "localhost";
//password dan root bisa disesuaikan dengan password/root yang telah anda buat
$username = "root";
$password = "";
$database = "contoh";

// 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. Menampilkan data tabel datakelas ke web browser dengan PHP, simpan dengan nama lihat_kelas.php :

<?PHP
include "koneksi.php";
$query = mysql_query("select*from datakelas");
while($hasil = mysql_fetch_array($query))
{
echo "$hasil[nis] - $hasil[nama] 
";
}
?>

Maka hasil tampilannya akan seperti gambar dibawah ini :

Source Code dapat anda download di sini