Berbicara tentang cara upload database joomla dari localhost dalam sebuah artikel didalam komputer dan artikel sempurna dapat dibaca melalui artikel dibawah ini. Ingin tahu lebih dalam mengenai apa yang anda cari? Silahkan melihat beberapa artikel kami terkait dengan cara upload database joomla dari localhost . Beberapa artikel telah kami sediakan dan berhubungan dengan cara upload database joomla dari localhost . Dibawah ini adalah beberapa artikel yang mungkin dapat membantu dengan apa yang anda cari mengenai cara upload database joomla dari localhost . Mungkin Artikel cara upload database joomla dari localhost bisa anda dapatkan
Tampilkan postingan dengan label Bahasa Pemrograman. Tampilkan semua postingan
Tampilkan postingan dengan label Bahasa Pemrograman. Tampilkan semua postingan
Kamis, 23 Februari 2012
Cara upload database joomla dari localhost
Berbicara tentang cara upload database joomla dari localhost dalam sebuah artikel didalam komputer dan artikel sempurna dapat dibaca melalui artikel dibawah ini. Ingin tahu lebih dalam mengenai apa yang anda cari? Silahkan melihat beberapa artikel kami terkait dengan cara upload database joomla dari localhost . Beberapa artikel telah kami sediakan dan berhubungan dengan cara upload database joomla dari localhost . Dibawah ini adalah beberapa artikel yang mungkin dapat membantu dengan apa yang anda cari mengenai cara upload database joomla dari localhost . Mungkin Artikel cara upload database joomla dari localhost bisa anda dapatkan
Selasa, 07 Februari 2012
Membuat angka acak (Random)
Suatu saat, saya yakin kamu akan perlu membuat angka acak atau istilah kerennya random. Script PHP berikut ini sangat pendek (hanya 2 baris) tetapi berfungsi penuh untuk membuat angka acak/random antara 0-9. Check it out!
Untuk membuat sebuah angka random, kita akan menggunakan fungsi rand(). Jika digabungkan dengan operator modulo maka kita bisa membuat sebuah script PHP pendek yang menghasilkan angka acak.
Berikut scriptnya:
$random = (rand()%9);
print("Angka acak antara 0 dan 9 adalah: $random");
?>
Singkat padat dan berisi kan?
Selamat mencoba.
Untuk membuat sebuah angka random, kita akan menggunakan fungsi rand(). Jika digabungkan dengan operator modulo maka kita bisa membuat sebuah script PHP pendek yang menghasilkan angka acak.
Berikut scriptnya:
$random = (rand()%9);
print("Angka acak antara 0 dan 9 adalah: $random");
?>
Singkat padat dan berisi kan?
Selamat mencoba.
Menangkap alamat URL dengan PHP
Pada suatu saat, kamu mungkin akan perlu untuk mengetahui asal pengunjung yang datang ke website yang kamu buat bukan? Hal itu bisa dilakukan dengan mudah apabila kamu menggunakan PHP. Scriptnya juga sangat singkat. mari kita lihat.
Kita akan menggunakan salah satu variabel yang dinamakan HTTP_REFERER. Misalnya kamu ingin mengetahui alamat website mana saja yang mereferensikan situs kamu, maka kamu cukup menyisipkan script ini.
echo $_SERVER['HTTP_REFERER'];
Coba deh buat sebuah halaman web sederhana berisi script singkat di atas, katakanlah kamu simpan dengan nama coba_referer.php. Langkah berikutnya adalah membuat link dari domain lain ke halaman coba_referer.php tersebut.
Untuk mencobanya, kamu bisa mengklik link yang ada di domain lain tadi untuk membuka coba_referer.php, dan halaman web tersebut akan menampilkan domain asal tempat kamu mengklik link tadi.
Mudah-mudahan bermanfaat.
Kita akan menggunakan salah satu variabel yang dinamakan HTTP_REFERER. Misalnya kamu ingin mengetahui alamat website mana saja yang mereferensikan situs kamu, maka kamu cukup menyisipkan script ini.
echo $_SERVER['HTTP_REFERER'];
Coba deh buat sebuah halaman web sederhana berisi script singkat di atas, katakanlah kamu simpan dengan nama coba_referer.php. Langkah berikutnya adalah membuat link dari domain lain ke halaman coba_referer.php tersebut.
Untuk mencobanya, kamu bisa mengklik link yang ada di domain lain tadi untuk membuka coba_referer.php, dan halaman web tersebut akan menampilkan domain asal tempat kamu mengklik link tadi.
Mudah-mudahan bermanfaat.
PHP Script: Kalender
PHP Script kalender sederhana. SIlahkan coba dan gunakan di web site kamu.
Berikut kode PHP script nya:
/* This calendar is not very pretty as-is, but it is functional and fast.
Formatting to suit your needs should be fairly simple.
The latest version of this calendar is formatted much more niceley. It
also includes a full-featured "Community Calendar" which is linked to a
MySQL database for reporting upcoming events.
The latest copy of the calendar can be viewed and/or downloaded from:
http://modems.rosenet.net/mysql/ */
/* Set some variables */
$date=01;
$day=01;
$off=0;
/* The month and year variables can (should) be passed from a preceding
web page rather than hard coded */
$month = '05';
$year = '1999';
/* Figure out how many days are in this month */
while (checkdate($month,$date,$year)):
$date++;
endwhile;
/* Create a table with days of the week headers */
echo "";
echo "";
echo "";
echo "";
echo "";
echo "";
echo "";
echo "";
/* Start the table data and make sure the number of days does not exceed
the total for the month - $date will always be one more than the total
number of days in the momth */
echo "
";
while ($day<$date):
/* Figure what day of the week the first falls on and set the number of
preceding and trailing cells accordingly */
if ($day == '01' and date('l', mktime(0,0,0,$month,$day,$year)) == 'Sunday') {
echo "
";
$off = '01';
}
elseif ($day == '01' and date('l', mktime(0,0,0,$month,$day,$year)) ==
'Monday') {
echo "";
$off= '02';
}
elseif ($day == '01' and date('l', mktime(0,0,0,$month,$day,$year)) ==
'Tuesday') {
echo "";
$off= '03';
}
elseif ($day == '01' and date('l', mktime(0,0,0,$month,$day,$year)) ==
'Wednesday') {
echo "";
$off= '04';
}
elseif ($day == '01' and date('l', mktime(0,0,0,$month,$day,$year)) ==
'Thursday') {
echo "";
$off= '05';
}
elseif ($day == '01' and date('l', mktime(0,0,0,$month,$day,$year)) ==
'Friday') {
echo "";
$off= '06';
}
elseif ($day == '01' and date('l', mktime(0,0,0,$month,$day,$year)) ==
'Saturday') {
echo "";
$off= '07';
}
else {
echo "";
}
/* Increment the day and increment the cells that go before the end of the row
and end the row when appropriate */
$day++;
$off++;
if ($off>7) {
echo "
";
$off='01';
} else {
echo "";
}
endwhile;
echo "
Sunday
Monday
Tuesday
Wednesday
Thursday
Friday
Saturday
$day
$day
$day
$day
$day
$day
$day
$day
";
?>
Berikut kode PHP script nya:
/* This calendar is not very pretty as-is, but it is functional and fast.
Formatting to suit your needs should be fairly simple.
The latest version of this calendar is formatted much more niceley. It
also includes a full-featured "Community Calendar" which is linked to a
MySQL database for reporting upcoming events.
The latest copy of the calendar can be viewed and/or downloaded from:
http://modems.rosenet.net/mysql/ */
/* Set some variables */
$date=01;
$day=01;
$off=0;
/* The month and year variables can (should) be passed from a preceding
web page rather than hard coded */
$month = '05';
$year = '1999';
/* Figure out how many days are in this month */
while (checkdate($month,$date,$year)):
$date++;
endwhile;
/* Create a table with days of the week headers */
echo "";
echo "";
echo "";
echo "";
echo "";
echo "";
echo "";
echo "";
/* Start the table data and make sure the number of days does not exceed
the total for the month - $date will always be one more than the total
number of days in the momth */
echo "
";
while ($day<$date):
/* Figure what day of the week the first falls on and set the number of
preceding and trailing cells accordingly */
if ($day == '01' and date('l', mktime(0,0,0,$month,$day,$year)) == 'Sunday') {
echo "
";
$off = '01';
}
elseif ($day == '01' and date('l', mktime(0,0,0,$month,$day,$year)) ==
'Monday') {
echo "";
$off= '02';
}
elseif ($day == '01' and date('l', mktime(0,0,0,$month,$day,$year)) ==
'Tuesday') {
echo "";
$off= '03';
}
elseif ($day == '01' and date('l', mktime(0,0,0,$month,$day,$year)) ==
'Wednesday') {
echo "";
$off= '04';
}
elseif ($day == '01' and date('l', mktime(0,0,0,$month,$day,$year)) ==
'Thursday') {
echo "";
$off= '05';
}
elseif ($day == '01' and date('l', mktime(0,0,0,$month,$day,$year)) ==
'Friday') {
echo "";
$off= '06';
}
elseif ($day == '01' and date('l', mktime(0,0,0,$month,$day,$year)) ==
'Saturday') {
echo "";
$off= '07';
}
else {
echo "";
}
/* Increment the day and increment the cells that go before the end of the row
and end the row when appropriate */
$day++;
$off++;
if ($off>7) {
echo "
";
$off='01';
} else {
echo "";
}
endwhile;
echo "
Sunday
Monday
Tuesday
Wednesday
Thursday
Friday
Saturday
$day
$day
$day
$day
$day
$day
$day
$day
";
?>
Minggu, 05 Februari 2012
Belajar sedikit Tentang Kode HTML
Mari belajar HTML.
Jika anda baru terjun di dunia maya alias pemula (newbie) dan tertarik ingin belajar HTML untuk membuat website sendiri maka anda tidak salah datang ke blog ini, karena disini anda akan mendapatkan tutorial, tips, triks dan artikel-artikel tentang bagaimana cara belajar HTML untuk membuat website.
Di Internet sebenarnya kita bisa saja mendapatkan banyak template baik yang gratis maupun yang berbayar, namun kadang tidak sesuai dengan keinginan (selera) kita. Maka kita harus meng-edit dan melakukan perubaha-perubahan. Di dalam mengedit dan melakukan perubahan inilah kita harus mengerti dan memahami bahasa HTML.
Di blog ini anda akan mendapatkan tutorial belajar HTML yang disertai dengan contoh-contoh mulai dari dasar, sehingga akan mudah dipahami dan sangat cocok bagi anda yang masih pemula. Dan bagi anda yang mengedit atau membuat suatu halaman web bisa melangkah ke halaman-halaman berikutnya sesuai dengan topik yang anda inginkan.
Untuk belajar anda dapat menggunakan program HTML seperti Ms FrontPage, Dreamweaver atau Text Editor (Notepad), sesuai dengan selera anda masing-masing. Namun untuk tutorial ini akan diajarkan dengan menggunakan teks editor yang simpel yaitu Notepad, jika anda ingin teks editor yang lebih interaktif anda bisa menggunakan Notepad++.
Dalam belajar sebaiknya anda langsung praktek di program HTML anda, sehingga akan lebih mudah untuk dipahami, anda ketik atau copy/paste contoh-contoh HTML-nya di program HTML anda dan preview di browser untuk melihat hasilnya.
Saya sangat berterimakasih jika anda bersedia memberikan kritik, saran maupun komentar atas kekurangan, error, broken links dan lainnya, masukan dari anda sangat membantu untuk perbaikan tutorial maupun blog ini.
Akhir kata saya mengucapkan terimakasih banyak atas kunjungan anda dan selamat belajar.
Jika anda baru terjun di dunia maya alias pemula (newbie) dan tertarik ingin belajar HTML untuk membuat website sendiri maka anda tidak salah datang ke blog ini, karena disini anda akan mendapatkan tutorial, tips, triks dan artikel-artikel tentang bagaimana cara belajar HTML untuk membuat website.
Di Internet sebenarnya kita bisa saja mendapatkan banyak template baik yang gratis maupun yang berbayar, namun kadang tidak sesuai dengan keinginan (selera) kita. Maka kita harus meng-edit dan melakukan perubaha-perubahan. Di dalam mengedit dan melakukan perubahan inilah kita harus mengerti dan memahami bahasa HTML.
Di blog ini anda akan mendapatkan tutorial belajar HTML yang disertai dengan contoh-contoh mulai dari dasar, sehingga akan mudah dipahami dan sangat cocok bagi anda yang masih pemula. Dan bagi anda yang mengedit atau membuat suatu halaman web bisa melangkah ke halaman-halaman berikutnya sesuai dengan topik yang anda inginkan.
Untuk belajar anda dapat menggunakan program HTML seperti Ms FrontPage, Dreamweaver atau Text Editor (Notepad), sesuai dengan selera anda masing-masing. Namun untuk tutorial ini akan diajarkan dengan menggunakan teks editor yang simpel yaitu Notepad, jika anda ingin teks editor yang lebih interaktif anda bisa menggunakan Notepad++.
Dalam belajar sebaiknya anda langsung praktek di program HTML anda, sehingga akan lebih mudah untuk dipahami, anda ketik atau copy/paste contoh-contoh HTML-nya di program HTML anda dan preview di browser untuk melihat hasilnya.
Saya sangat berterimakasih jika anda bersedia memberikan kritik, saran maupun komentar atas kekurangan, error, broken links dan lainnya, masukan dari anda sangat membantu untuk perbaikan tutorial maupun blog ini.
Akhir kata saya mengucapkan terimakasih banyak atas kunjungan anda dan selamat belajar.
Pengenalan HTML
Pengertian singkat tentang HTML
HTML (Hyper Text Markup Language) merupakan bahasa standar untuk membuat suatu dokumen HTML (halaman web) yang terdiri dari kode-kode singkat tertentu, dimana dengan kode-kode tersebut akan memerintahkan Web browser bagaimana untuk menampilkan halaman Web yang terdiri dari berbagai macam format file seperti texs, grafik, animasi link maupun audio-video.
Sedangkan Web browser adalah sebuah progam yang dapat menterjemahkan kode perintah dari dokumen HTML tersebut sehingga dapat kita lihat, baca dan dengar. Contoh dari Web Browser adalah Internet Exsplorer, Netscape Navigator, Mozilla Firefox, Opera, Safari dll.
HTML mempunyai file perluasan (extention) htm atau html. Dimana kedua perluasan tersebut adalah sama, jadi anda boleh menyimpan file dokumen HTML dengan extention ".htm" atau ".html".
Untuk mulai belajar HTML kita akan menggunakan Texs Editor, Notepad. Di bawah ini adalah contoh suatu dokumen HTML yang sangat sederhana. Buka Notepad, silahkan mulai dengan mengetikkan (copy/paste) texs di bawah ini:
HTML (Hyper Text Markup Language) merupakan bahasa standar untuk membuat suatu dokumen HTML (halaman web) yang terdiri dari kode-kode singkat tertentu, dimana dengan kode-kode tersebut akan memerintahkan Web browser bagaimana untuk menampilkan halaman Web yang terdiri dari berbagai macam format file seperti texs, grafik, animasi link maupun audio-video.
Sedangkan Web browser adalah sebuah progam yang dapat menterjemahkan kode perintah dari dokumen HTML tersebut sehingga dapat kita lihat, baca dan dengar. Contoh dari Web Browser adalah Internet Exsplorer, Netscape Navigator, Mozilla Firefox, Opera, Safari dll.
HTML mempunyai file perluasan (extention) htm atau html. Dimana kedua perluasan tersebut adalah sama, jadi anda boleh menyimpan file dokumen HTML dengan extention ".htm" atau ".html".
Untuk mulai belajar HTML kita akan menggunakan Texs Editor, Notepad. Di bawah ini adalah contoh suatu dokumen HTML yang sangat sederhana. Buka Notepad, silahkan mulai dengan mengetikkan (copy/paste) texs di bawah ini:
<html>
<head>
<title>Titel Websiteku</title>
</head>
<body>
Ini adalah dokumen HTML pertamaku
</body>
</html>
<head>
<title>Titel Websiteku</title>
</head>
<body>
Ini adalah dokumen HTML pertamaku
</body>
</html>
Preview
Simpan file tersebut dengan pilihan "save as" ke C:\My Documents dengan nama "websiteku.htm." Kemudian buka browser dari menu File, klik Open dan tujukan ke C:\My Documents\websiteku.htm "klik Ok" maka halaman website pertama anda akan ditampilkan.
*Lakukan hal yang sama untuk contoh-contoh selanjutnya.
Perintah didalam dokumen HTML terdiri dari berbagai struktur penyusun seperti tag, elemen, atribut dan nilai. Tag terdiri dari lambang-lambang khusus seperti: " <", " >" dan "/", untuk menuliskannya di dalam dokumen HTML dimulai dengan tag pembuka " <…>"dan diakhiri dengan tag penutup " </…>". Kemudian di dalam tag tersebut terdapat teks seperti contoh diatas :html, head, title,body dan yang lainnya ini disebut dengan Elemen HTML.
Elemen HTML kemudian ada yang memiliki atribut dan nilai tertentu, seperti contoh untuk membuat warna latar belakang (background): <body bgcolor="0000ff">, body merupakan elemen, bgcolor adalah atribut dan 0000ff merupakan nilai (value).
Elemen HTML mempunyai tiga hal penting yaitu: tag pembuka, isi, dan tag penutup. Sebagai contoh: Elemen html mempunyai tag pembuka " <html>" dan tag penutup " </html>" dan yang berada diantaranya merupakan isi dari elemen html. Untuk menuliskan Elemen HTML bisa menggunakan huruf besar maupun huruf kecil. Contoh: <HTML>, <HtMl>, <HTml>, <html>, semuanya adalah sama.
Simpan file tersebut dengan pilihan "save as" ke C:\My Documents dengan nama "websiteku.htm." Kemudian buka browser dari menu File, klik Open dan tujukan ke C:\My Documents\websiteku.htm "klik Ok" maka halaman website pertama anda akan ditampilkan.
*Lakukan hal yang sama untuk contoh-contoh selanjutnya.
Perintah didalam dokumen HTML terdiri dari berbagai struktur penyusun seperti tag, elemen, atribut dan nilai. Tag terdiri dari lambang-lambang khusus seperti: " <", " >" dan "/", untuk menuliskannya di dalam dokumen HTML dimulai dengan tag pembuka " <…>"dan diakhiri dengan tag penutup " </…>". Kemudian di dalam tag tersebut terdapat teks seperti contoh diatas :html, head, title,body dan yang lainnya ini disebut dengan Elemen HTML.
Elemen HTML kemudian ada yang memiliki atribut dan nilai tertentu, seperti contoh untuk membuat warna latar belakang (background): <body bgcolor="0000ff">, body merupakan elemen, bgcolor adalah atribut dan 0000ff merupakan nilai (value).
Elemen HTML mempunyai tiga hal penting yaitu: tag pembuka, isi, dan tag penutup. Sebagai contoh: Elemen html mempunyai tag pembuka " <html>" dan tag penutup " </html>" dan yang berada diantaranya merupakan isi dari elemen html. Untuk menuliskan Elemen HTML bisa menggunakan huruf besar maupun huruf kecil. Contoh: <HTML>, <HtMl>, <HTml>, <html>, semuanya adalah sama.
Tag Dasar HTML
Komponen dasar dari suatu dokumen HTML terdiri dari tag elemen HTML, HEAD dan BODY. Berikut ini adalah penjelasan dari Tag Elemen tersebut:
<html>
<head>
<title>Disini titel websiteku</title>
</head>
<body>
Disini adalah konten yang tampil di browser
</body>
</html>
<head>
<title>Disini titel websiteku</title>
</head>
<body>
Disini adalah konten yang tampil di browser
</body>
</html>
Preview
Tag pertama pada dokumen HTML diatas adalah: " <html>" tag ini merupakan awal dari suatu dokumen HTML, dan tag " </html>" merupakan akhir dari dokumen HTML. Isi keseluruhan dari suatu dokumen HTML selalu berada diantara tag <html>…</html>.
Kemudian tag " <head>…</head>" (header) adalah informasi dari dokumen HTML. Informasi di dalam header meliputi: title, meta, style, script dll. Selain Title informasi di dalam header ini nantinya tidak akan di tampilkan di web browser.
Tag berikutnya adalah " <title>…</title>" merupakan bagian dari Head, tag ini adalah sebagai Titel dari dokumen HTML, titel ini akan tampil di titel dan tab browser. Sebagai contoh sewaktu anda membuka file contoh diatas perhatikan akan muncul tulisan "Disini titel websiteku".
Tag "<body>…</body>" merupakan isi dari suatu dokumen HTML yang akan ditampilkan di web browser, yang terdiri dari berbagai macam format file berupa texs, grafik, link, animasi maupun audio-video (multimedia).
Tag pertama pada dokumen HTML diatas adalah: " <html>" tag ini merupakan awal dari suatu dokumen HTML, dan tag " </html>" merupakan akhir dari dokumen HTML. Isi keseluruhan dari suatu dokumen HTML selalu berada diantara tag <html>…</html>.
Kemudian tag " <head>…</head>" (header) adalah informasi dari dokumen HTML. Informasi di dalam header meliputi: title, meta, style, script dll. Selain Title informasi di dalam header ini nantinya tidak akan di tampilkan di web browser.
Tag berikutnya adalah " <title>…</title>" merupakan bagian dari Head, tag ini adalah sebagai Titel dari dokumen HTML, titel ini akan tampil di titel dan tab browser. Sebagai contoh sewaktu anda membuka file contoh diatas perhatikan akan muncul tulisan "Disini titel websiteku".
Tag "<body>…</body>" merupakan isi dari suatu dokumen HTML yang akan ditampilkan di web browser, yang terdiri dari berbagai macam format file berupa texs, grafik, link, animasi maupun audio-video (multimedia).
Format Font HTML
Tag HTML untuk font adalah <font>…</font>, dengan tag ini kita bisa menentukan jenis font (face), warna (color), dan ukuran (size), untuk lebih jelasnya mari kita perhatikan contoh berikut ini:
<html>
<head></head>
<body>
Untuk membuat jenis font (face):
<h1><font face="Verdana">Judul dengan font Verdana</font></h1>
<p><font face="Times">Konten dengan font Times</font></p>
Untuk membuat ukuran (size):
<h1><font size="5">Judul dengan size 5</font></h1>
<p><font size="3">Konten dengan size 3</font></p>
Untuk membuat warna font (color):
<h1><font color="blue">Judul dengan warna biru</font></h1>
<p><font color="red">Konten dengan warna merah</font></p>
Contoh komplit untuk membuat jenis font (face),size dan color:
<h1><font face="Verdana" size="4" color="green">Judulnya Tentang Font</font></h1>
<p><font face="Arial" size="3" color="#660000">Ini adalah contoh tulisan dengan <i>pengaturan font</i> yang menggunakan<br>
tag HTML elemen <b>font</b> dengan atribut face, size dan color...</font></p>
</body>
</html>
<head></head>
<body>
Untuk membuat jenis font (face):
<h1><font face="Verdana">Judul dengan font Verdana</font></h1>
<p><font face="Times">Konten dengan font Times</font></p>
Untuk membuat ukuran (size):
<h1><font size="5">Judul dengan size 5</font></h1>
<p><font size="3">Konten dengan size 3</font></p>
Untuk membuat warna font (color):
<h1><font color="blue">Judul dengan warna biru</font></h1>
<p><font color="red">Konten dengan warna merah</font></p>
Contoh komplit untuk membuat jenis font (face),size dan color:
<h1><font face="Verdana" size="4" color="green">Judulnya Tentang Font</font></h1>
<p><font face="Arial" size="3" color="#660000">Ini adalah contoh tulisan dengan <i>pengaturan font</i> yang menggunakan<br>
tag HTML elemen <b>font</b> dengan atribut face, size dan color...</font></p>
</body>
</html>
Preview
Berikut adalah sebagai referensi bagi anda untuk memanipulasi atribut face, color dan size:
Atribut
face="Jenis font yang digunakan", contoh: face="Tahoma"
size="Ukuran dari font (1-7)", contoh: size="3"
size="Memperbesar ukuran font", contoh: size="+1"
size="Memperkecil ukuran font", contoh: size="-1"
color="Warna dari font", contoh: color="blue"
color="Warna dari font", contoh: color="#FF0000"
Sesuai dengan recomendasi dari World Web Consortium (W3C), Untuk HTML 4.0 keatas, tag <font> tidak dipergunakan lagi, sebagai gantinya dibuat tag <style> atau disebut dengan Cassading Style Sheets (CSS). Dengan CSS penggunaanya akan lebih kompleks dan lebih luas lagi karena dapat dikombinasikan dengan tag elemen-elemen lainnya di dalam dokumen HTML. Berikut adalah contoh penggunaan tag style sheets:
Berikut adalah sebagai referensi bagi anda untuk memanipulasi atribut face, color dan size:
Atribut
face="Jenis font yang digunakan", contoh: face="Tahoma"
size="Ukuran dari font (1-7)", contoh: size="3"
size="Memperbesar ukuran font", contoh: size="+1"
size="Memperkecil ukuran font", contoh: size="-1"
color="Warna dari font", contoh: color="blue"
color="Warna dari font", contoh: color="#FF0000"
Sesuai dengan recomendasi dari World Web Consortium (W3C), Untuk HTML 4.0 keatas, tag <font> tidak dipergunakan lagi, sebagai gantinya dibuat tag <style> atau disebut dengan Cassading Style Sheets (CSS). Dengan CSS penggunaanya akan lebih kompleks dan lebih luas lagi karena dapat dikombinasikan dengan tag elemen-elemen lainnya di dalam dokumen HTML. Berikut adalah contoh penggunaan tag style sheets:
<html>
<head></head>
<body>
Untuk membuat jenis font (face):
<h1 style="font-family:verdana">Judul Menggunakan font verdana</h1>
<p style="font-family:tahoma">Konten menggunakan font tahoma</p>
Untuk membuat ukuran (size):
<h1 style="font-size:150%">Judul dengan ukuran 150%</h1>
<p style="font-size:80%">Konten dengan ukuran 80%</p>
Untuk membuat warna font (color):
<h1 style="color:blue">Judul dengan warna Biru</h1>
<p style="color:red">Konten dengan warna merah</p>
Contoh komplit untuk membuat jenis font (face),size dan color:
<p style="font-family:verdana;font-size:80%;color:green">
Ini adalah contoh tulisan pengaturan font dengan <i>Cassading Style Sheets</i> (CSS) yang<br>
menggunakan tag HTML elemen <b>style:</b> font-family, font-size dan color...</p>
</body>
</html>
<head></head>
<body>
Untuk membuat jenis font (face):
<h1 style="font-family:verdana">Judul Menggunakan font verdana</h1>
<p style="font-family:tahoma">Konten menggunakan font tahoma</p>
Untuk membuat ukuran (size):
<h1 style="font-size:150%">Judul dengan ukuran 150%</h1>
<p style="font-size:80%">Konten dengan ukuran 80%</p>
Untuk membuat warna font (color):
<h1 style="color:blue">Judul dengan warna Biru</h1>
<p style="color:red">Konten dengan warna merah</p>
Contoh komplit untuk membuat jenis font (face),size dan color:
<p style="font-family:verdana;font-size:80%;color:green">
Ini adalah contoh tulisan pengaturan font dengan <i>Cassading Style Sheets</i> (CSS) yang<br>
menggunakan tag HTML elemen <b>style:</b> font-family, font-size dan color...</p>
</body>
</html>
Preview
Untuk mengetahui lebih lanjut tentang CSS, nanti akan dibuat tutorial khusus untuk membahas hal ini.
Untuk mengetahui lebih lanjut tentang CSS, nanti akan dibuat tutorial khusus untuk membahas hal ini.
Format text HTML
Untuk menulis biasanya ada paragraf dan baris baru, lantas bagaiman cara menuliskannya di dokumen HTML?. Dari contoh yang sudah kita buat sebelumnya, coba tambahkan dengan tag-tag berikut ini:
<html>
<head>
<title>Selamat Datang di Websiteku</title>
</head>
<body>
Ini adalah halaman HTML pertamaku.
<p>Aku sedang membuat paragraf dan ini contohnya.</p>
<p>Ini contoh paragraf yang lainnya.</p>
<p>Ini juga paragraf mm...tapi de-<br>
ngan baris baru.<br>
Ini baris baru yang lain.</p>
</body>
</html>
<head>
<title>Selamat Datang di Websiteku</title>
</head>
<body>
Ini adalah halaman HTML pertamaku.
<p>Aku sedang membuat paragraf dan ini contohnya.</p>
<p>Ini contoh paragraf yang lainnya.</p>
<p>Ini juga paragraf mm...tapi de-<br>
ngan baris baru.<br>
Ini baris baru yang lain.</p>
</body>
</html>
Preview
Untuk membuat suatu paragraf, tag elemennya adalah <p>…</p>, dan untuk baris baru adalah <br>, perlu diketahui bahwa sebagian tag elemen HTML tidak memerlukan tag penutup, sebagai contoh adalah <br> ada juga <hr>, apa itu <hr>?, coba lanjutkan lagi dengan contoh berikut ini:
Untuk membuat suatu paragraf, tag elemennya adalah <p>…</p>, dan untuk baris baru adalah <br>, perlu diketahui bahwa sebagian tag elemen HTML tidak memerlukan tag penutup, sebagai contoh adalah <br> ada juga <hr>, apa itu <hr>?, coba lanjutkan lagi dengan contoh berikut ini:
<html>
<head>
<title>Selamat Datang di Websiteku</title>
</head>
<body>
<hr>
<h1>Ini adalah halaman HTML pertamaku.</h1>
Dikerjakan oleh: <!-- Tolong isikan dengan nama anda -->
<hr>
<p>Aku sedang membuat paragraf dan ini contohnya.</p>
<p>Ini contoh paragraf yang lainnya.</p>
<p>Ini juga paragraf mm...tapi de-<br>
ngan baris baru.<br>
Ini baris baru yang lain.</p>
</body>
</html>
<head>
<title>Selamat Datang di Websiteku</title>
</head>
<body>
<hr>
<h1>Ini adalah halaman HTML pertamaku.</h1>
Dikerjakan oleh: <!-- Tolong isikan dengan nama anda -->
<hr>
<p>Aku sedang membuat paragraf dan ini contohnya.</p>
<p>Ini contoh paragraf yang lainnya.</p>
<p>Ini juga paragraf mm...tapi de-<br>
ngan baris baru.<br>
Ini baris baru yang lain.</p>
</body>
</html>
Preview
Nah..udah tau kan apa itu <hr>. Garis Horizontal <hr> juga tidak menggunakan tag penutup. Kemudian ada <h1>…</h1> disebut dengan Heading, merupakan ukuran teks yang biasa di pakai untuk judul, bab, maupun sub-bab lainnya. Ukurannya ada 6 jenis mulai dari <h1> sampai <h6>, ukuran yang paling besar adalah h1 dan yang terkecil adalah h6.
Selanjutnya tag <!–…–> adalah Comments digunakan untuk memasukkan (menyisipkan) suatu komentar di dalam HTML. Suatu comments akan diabaikasn oleh browser. Kamu dapat menggunakan komentar untuk menjelaskan sesuatu hal.
Dibawah ini adalah contoh format teks yang sering digunakan di dalam dokumen HTML :
Nah..udah tau kan apa itu <hr>. Garis Horizontal <hr> juga tidak menggunakan tag penutup. Kemudian ada <h1>…</h1> disebut dengan Heading, merupakan ukuran teks yang biasa di pakai untuk judul, bab, maupun sub-bab lainnya. Ukurannya ada 6 jenis mulai dari <h1> sampai <h6>, ukuran yang paling besar adalah h1 dan yang terkecil adalah h6.
Selanjutnya tag <!–…–> adalah Comments digunakan untuk memasukkan (menyisipkan) suatu komentar di dalam HTML. Suatu comments akan diabaikasn oleh browser. Kamu dapat menggunakan komentar untuk menjelaskan sesuatu hal.
Dibawah ini adalah contoh format teks yang sering digunakan di dalam dokumen HTML :
<html>
<head></head>
<body>
<hr>
<h1>Ini adalah halaman HTML pertamaku.</h1>
Dikerjakan oleh: <!-- Tolong isikan dengan nama anda -->
<hr>
<p>Aku sedang mempelajari format-format teks.<br>
Contoh-contohnya adalah sebagai berikut:</p>
<p>Teks Normal<br>
<tt>Teks mesin ketik</tt><br>
<b>Teks tebal (bold)</b><br>
<strong>Teks tebal dengan perintah Strong</strong><br>
<i>Teks dengan italic (miring)</i><br>
<em>Teks miring dengan perintah Emphasized</em><br>
<u>Teks bergaris bawah (underline)</u><br>
<strike>Teks tercoret (strike)</strike><br>
<big>Teks lebih besar dari normal</big><br>
<small>Teks lebih kecil dari normal</small><br>
Teks menggunakan Subscript: Molekul Air adalah H<sub>2</sub>O<br>
Teks menggunakan Superscript: Hasil dari 10<sup>2</sup>=100<br></p>
</body>
</html>
<head></head>
<body>
<hr>
<h1>Ini adalah halaman HTML pertamaku.</h1>
Dikerjakan oleh: <!-- Tolong isikan dengan nama anda -->
<hr>
<p>Aku sedang mempelajari format-format teks.<br>
Contoh-contohnya adalah sebagai berikut:</p>
<p>Teks Normal<br>
<tt>Teks mesin ketik</tt><br>
<b>Teks tebal (bold)</b><br>
<strong>Teks tebal dengan perintah Strong</strong><br>
<i>Teks dengan italic (miring)</i><br>
<em>Teks miring dengan perintah Emphasized</em><br>
<u>Teks bergaris bawah (underline)</u><br>
<strike>Teks tercoret (strike)</strike><br>
<big>Teks lebih besar dari normal</big><br>
<small>Teks lebih kecil dari normal</small><br>
Teks menggunakan Subscript: Molekul Air adalah H<sub>2</sub>O<br>
Teks menggunakan Superscript: Hasil dari 10<sup>2</sup>=100<br></p>
</body>
</html>
Preview
Kemudian untuk menampilkan teks sesuai dengan yang tertulis kita gunakan tag <pre>…</pre>, misalnya jika anda menuliskan syair sebuah lagu atau puisi:
Kemudian untuk menampilkan teks sesuai dengan yang tertulis kita gunakan tag <pre>…</pre>, misalnya jika anda menuliskan syair sebuah lagu atau puisi:
<html>
<body>
<pre>
<b>PUITUIS ASA</b>
Hari ini...
Aku sedang belajar...
Belajar tentang HTML.
Sulit 'ntuk dimengerti,
Karena banyaknya teks-teks aneh.
Tapi biarlah...
Akan kucoba...
Sampai pingsan.
</pre>
</body>
</html>
Hyperlink HTML
Hyperlink digunakan untuk menghubungkan antar halaman dokumen di dalam web. Tag HTML Hyperlink biasa disebut dengan anchor (a) kemudian diikuti dengan href sebagai alamat tujuan dari link tersebut. Berikut kita akan membuat suatu Hyperlink ke suatu alamat url:
<html>
<head></head>
<body>
<p>Aku sekarang sedang membuat hyperlink</p>
Jika anda ingin mengunjungi Microsoft
<a href="http://www.microsoft.com/">Klik disini</a><br>
<a href="http://www.yahoo.com/">Link ini</a> akan membawa anda ke Yahoo.com
<p>Untuk membuat hyperlink url agar dibuka pada jendela browser yang baru:<p>
<a href="http://www.mp3.com/"target="_blank">Website Musik</a>
<p>Agar hyperlink tidak bergaris bawah:<p>
<a href="http://www.mp3.com/"target="_blank" style="text-decoration: none">Website Musik</a>
<p>Hyperlink ke suatu halaman tertentu dalam web:<p>
<!--dengan catatan anda harus tau nama halaman tujuan tersebut-->
<a href="http://wordpress.htmlcssguides.com/belajar-css/">Link ini</a> akan membawa anda ke halaman belajar css.
</body>
</html>
<head></head>
<body>
<p>Aku sekarang sedang membuat hyperlink</p>
Jika anda ingin mengunjungi Microsoft
<a href="http://www.microsoft.com/">Klik disini</a><br>
<a href="http://www.yahoo.com/">Link ini</a> akan membawa anda ke Yahoo.com
<p>Untuk membuat hyperlink url agar dibuka pada jendela browser yang baru:<p>
<a href="http://www.mp3.com/"target="_blank">Website Musik</a>
<p>Agar hyperlink tidak bergaris bawah:<p>
<a href="http://www.mp3.com/"target="_blank" style="text-decoration: none">Website Musik</a>
<p>Hyperlink ke suatu halaman tertentu dalam web:<p>
<!--dengan catatan anda harus tau nama halaman tujuan tersebut-->
<a href="http://wordpress.htmlcssguides.com/belajar-css/">Link ini</a> akan membawa anda ke halaman belajar css.
</body>
</html>
Preview
Untuk membuat hyperlink dengan menggunakan gambar (image). Pastikan gambar tersebut berada pada folder yang sama dengan dokumen html anda dan harus tahu nama dan extentionnya, kemudian ganti ke atribut yang bertuliskan scr, misalkan jika nama gambar tersebut adalah yahoo.gif, maka :
Untuk membuat hyperlink dengan menggunakan gambar (image). Pastikan gambar tersebut berada pada folder yang sama dengan dokumen html anda dan harus tahu nama dan extentionnya, kemudian ganti ke atribut yang bertuliskan scr, misalkan jika nama gambar tersebut adalah yahoo.gif, maka :
<a href="http://www.yahoo.com"> <img src="yahoo.gif" border="0" width="147" height="31"></a>
Img merupakan atribut untuk suatu image (gambar), border adalah garis yang mengelilingi sisi image, width dan height merupakan lebar dan tinggi dari image. Kreatiflah untuk menganti nilai yang ada diantar tanda "…"sehingga anda akan lebih mengerti. Untuk memposisikan gambar, tambahkan dengan atribut align="…", left= kiri, center= tengah dan right= kanan.
<a href="http://www.yahoo.com"> <img src="yahoo.gif" border="0" width="147" height="31" align="left"></a>
Sekarang coba geser mouse anda ke gambar di atas, jangan di-klik, perhatikan akan ditampilkan suata tulisan singkat mengenai gambar tesebut, ini disebut dengan screen tips, cara membuatnya adalah menambahkan title pada tag anchor (a) sehingga menjadi:
<a href="http://www.yahoo.com" title="Hai... klik gambar ini maka anda akan dibawa ke Yahoo.com"><img src="contoh.jpg" border="0" width="147" height="31" align="left" alt="yahoo"></a>
Agar cepat mengakses internet kita boleh mengatur browser untuk tidak menampilkan image (gambar). Dan semua gambar akan ditampilkan dengan teks alternatif (alt), jika gambar tesebut tidak memiliki alternatif teks maka hanya akan dilambangkan dengan lambang x.
<a href="http://www.yahoo.com"> <img border="0" src="contoh.jpg" width="120" height="30" align="left" alt="Text Alternatif Yahoo.com"></a>
Background HTML
Dengan menggunakan latar belakang (background) maka website kita akan nampak semakin menarik. Untuk memasukkan latar belakang kita bisa menggunakan pilihan warna maupun grafik (gambar).
Sekarang kita mulai dengan menggunakan pilihan warna:
Sekarang kita mulai dengan menggunakan pilihan warna:
<html>
<head></head>
<body bgcolor="#FF99FF">
<p>Hai.. Saat ini saya sedang belajar membuat latar belakang dengan warna</p>
<p>Kalau anda kurang suka dengan warnanya... ganti aja deh... kode warnanya... </p>
</body>
</html>
<head></head>
<body bgcolor="#FF99FF">
<p>Hai.. Saat ini saya sedang belajar membuat latar belakang dengan warna</p>
<p>Kalau anda kurang suka dengan warnanya... ganti aja deh... kode warnanya... </p>
</body>
</html>
Preview
Untuk nilai dari atribut bgcolor diatas anda bisa menggunakan Kode hexadecimal, Nilai RGB atau Nama dari warna tersebut.
Coba anda ganti nilai dari atribut bgcolor dengan contoh dibawah ini:
Untuk nilai dari atribut bgcolor diatas anda bisa menggunakan Kode hexadecimal, Nilai RGB atau Nama dari warna tersebut.
Coba anda ganti nilai dari atribut bgcolor dengan contoh dibawah ini:
<body bgcolor="#FFFF00">
<body bgcolor="rgb(250,250,0)">
<body bgcolor="yellow">
<body bgcolor="rgb(250,250,0)">
<body bgcolor="yellow">
Hasilnya akan sama. Ikuti link berikut ini untuk mengetahui Kode Hexadecimal dan Nilai RGB dari suatu warna, tapi maaf untuk nama warnanya cari sendiri aja deh…
Selanjutnya membuat latar belakang dengan grafik atau gambar.
Pertama anda harus punya gambar yang ber-extention .gif atau .jpg yang akan dijadikan background, masukkan (copy) gambar tersebut ke folder tempat file dokumen HTML anda berada, dan harus tahu nama dan perluasan (extention) dari file tersebut, misalkan nama filenya adalah: background.jpg
Selanjutnya membuat latar belakang dengan grafik atau gambar.
Pertama anda harus punya gambar yang ber-extention .gif atau .jpg yang akan dijadikan background, masukkan (copy) gambar tersebut ke folder tempat file dokumen HTML anda berada, dan harus tahu nama dan perluasan (extention) dari file tersebut, misalkan nama filenya adalah: background.jpg
<html>
<head></head>
<body background="background.jpg">
<font color="blue"><h1 color="red">Selamat datang di Websiteku</h1></font><hr color="#ff0000" size="2">
<p><font face="Verdana" size="4" color="black">Hai... Saat ini saya sedang belajar membuat latar belakang dengan gambar,<br>
Biar bagaimanapun anda diwajibkan harus menyukainya...</font></p>
</body>
</html>
<head></head>
<body background="background.jpg">
<font color="blue"><h1 color="red">Selamat datang di Websiteku</h1></font><hr color="#ff0000" size="2">
<p><font face="Verdana" size="4" color="black">Hai... Saat ini saya sedang belajar membuat latar belakang dengan gambar,<br>
Biar bagaimanapun anda diwajibkan harus menyukainya...</font></p>
</body>
</html>
Preview
Kemudian latar belakang dapat juga menggunakan gambar yang ada di website orang lain, tapi dengan catatan anda harus sedang terhubung ke internet (online) dan harus tahu alamat url dari gambar tersebut di internet. Untuk mengetahui alamat suatu gambar klik kanan gambar tersebut kemudian pilih properties dan lihat image location, copy alamat tersebut dan ganti ke contoh dibawah ini diawali dari http:
Kemudian latar belakang dapat juga menggunakan gambar yang ada di website orang lain, tapi dengan catatan anda harus sedang terhubung ke internet (online) dan harus tahu alamat url dari gambar tersebut di internet. Untuk mengetahui alamat suatu gambar klik kanan gambar tersebut kemudian pilih properties dan lihat image location, copy alamat tersebut dan ganti ke contoh dibawah ini diawali dari http:
<html>
<head></head>
<body background="http://i703.photobucket.com/albums/ww40/Jessie4life007/background.jpg">
<p>Hai.. Saat ini saya sedang belajar membuat latarbelakang dengan menggunakan gambar dari website orang lain! hua ha..ha..ha..</p>
<p>Mudah-mudahan yang punya website ngamuk sekalian deh...siapa takut!!</p>
</body>
</html>
<head></head>
<body background="http://i703.photobucket.com/albums/ww40/Jessie4life007/background.jpg">
<p>Hai.. Saat ini saya sedang belajar membuat latarbelakang dengan menggunakan gambar dari website orang lain! hua ha..ha..ha..</p>
<p>Mudah-mudahan yang punya website ngamuk sekalian deh...siapa takut!!</p>
</body>
</html>
Kamis, 08 September 2011
PHP Script: Kalkulasi Waktu
Pernah penmen agar halaman web kamu bisa menampilkan waktu 1 jam dari sekarang? Di sini kamu bisa lihat contoh PHP Script dan penjelasannya.
Scrip membuat kalkulasi waktu tentu saja dapat dibuat dengan berbagai macam cara. Biasanya programmer canggih akan membuat PHP script dengan cara yang sangat singkat. Kamu tahu kenapa? Salah satu sebabnya adalah agar PHP script yang mereka bikin lebih efisien, dan tentu saja, makin singkat PHP script nya, makin canggih kelihatannya dan makin membingungkan buat kita para newbie.
Nah, di sini kita akan coba lihat step by step.
Scrip membuat kalkulasi waktu tentu saja dapat dibuat dengan berbagai macam cara. Biasanya programmer canggih akan membuat PHP script dengan cara yang sangat singkat. Kamu tahu kenapa? Salah satu sebabnya adalah agar PHP script yang mereka bikin lebih efisien, dan tentu saja, makin singkat PHP script nya, makin canggih kelihatannya dan makin membingungkan buat kita para newbie.
Nah, di sini kita akan coba lihat step by step.
Salah satu caranya adalah dengan tiga langkah mudah sebagai berikut:
1. Prinsipnya ubah dulu ke timestampnya server menggunakan fungsi $timestamp=strtotime($skr).
Nah, isi variabel $timestamp itu adalah jumlah detik sejak 1 Januari 1970.
2. Kalau sudah, tambahkan $timestamp dengan angka detik yang diinginkan (dalam kasus ini adalah 60 detik. So, tambahkan baris kode berikut: $timestamp=$timestamp+60.
3. Kalau sudah tinggal kembalikan angka timestamp ke format tanggal yang kita kenal pada umumnya dengan fungsi date.
So, kode keseluruhannya akan menjadi:
Code:
$timestamp=strtotime($skr);
$timestamp=$timestamp+60;
date("m/d/Y H:i:s",$timestamp);
?> ?>
Gampang kan .
Nah tentu saja ada cara lain yang lebih singkat (dan mungkin agak membingungkan buat yg baru belajar) seperti ini misalnya :
$timestamp = date('U');
$skr = date('m/d/Y H:i:s', $timestamp);
$nanti = date('m/d/Y H:i:s', $timestamp+60);
Mudah-mudahan bermanfaat.
Menggunakan PHP dan Form HTML
kita lanjutkan tutorial kita dengan melihat bagaimana caranya untuk menggabungkan form HTML dengan kode PHP.
Dalam contoh-contoh kita sampai saat ini, kita sudah berhasil mengisi variabel dan menggunakannya dalam satu kode yang sama. Kayaknya hal ini agak kurang bermanfaat ya? Emang sih. Lha gimana nggak, daripada repot-repot masukin nilai yang kita inginkan, dilanjutkan dengan menampilkan apa yang kita inginkan melalui variabel kita tadi, kan mendingan langsung aja tuh nampilin apa yang kita iningkan tanpa menggunakan variabel, lebih singkat, cepat dan mudah. Jadi, gimana dong? Tenang ..... di tutorial inilah anda akan melihat kekuatan variabel yang sesungguhnya.
Nah, sekarang ayo kita coba sesuatu yang lebih menarik, dan bisa menunjukkan kegunaan variabel kita tercinta dalam sebuah program.
Baiklah, tanpa membuang waktu lagi, sekarang saatnya untuk membuat sebuah halaman web yang akan kita gunakan untuk menginput nama kita dan nama orang yang kita sukai dan kemudian menampilkannya secara bersamaan di halaman lain. Apa …… halaman lain? Ya, di halaman lain, ini yang membedakan dengan kode-kode kita sebelumnya, untuk itulah, mohon konsentrasi di bagian ini, karena ini sangat penting bagi perkembangan PHP anda di masa datang. Pahami betul bagaimana cara kita mengirimkan variabel kita dari satu halaman ke halaman yang lain yach…
Sebelum membuatnya, bayangkan kembali skenario ini. Anda membuat sebuah halaman website di mana pengunjung bisa mengisi nama mereka dan nama kekasih mereka dalam sebuah form dan kemudian menampilkan kembali nama-nama tersebut di halaman web lainnya.
Untuk melakukan hal itu, kita perlu membuat 2 buah file PHP. File pertama adalah sebuah form HTML untuk mengumpulkan input dari user, mengisikan input tersebut ke dalam variabel dan kemudian mengirimkannya ke file kedua yang bertugas menampilkan kembali isi variabel tersebut ditambah dengan beberapa hal sederhana lainnya. Maaf kalau cara penyampaiannya payah ya, tapi saya berharap paling enggak bisa tetap fun deh buat Prothelors dalam mempelajari PHP.
Pertama-tama, kita buat dulu halaman formnya, halaman ini adalah halaman HTML biasa dengan FORM di dalamnya. Sesudah ini kita akan buat sebuah halaman lain (PHP) untuk memproses apa yang diinputkan dari halaman HTML kita ini. Kita namai dengan form_saya.html
Dalam contoh-contoh kita sampai saat ini, kita sudah berhasil mengisi variabel dan menggunakannya dalam satu kode yang sama. Kayaknya hal ini agak kurang bermanfaat ya? Emang sih. Lha gimana nggak, daripada repot-repot masukin nilai yang kita inginkan, dilanjutkan dengan menampilkan apa yang kita inginkan melalui variabel kita tadi, kan mendingan langsung aja tuh nampilin apa yang kita iningkan tanpa menggunakan variabel, lebih singkat, cepat dan mudah. Jadi, gimana dong? Tenang ..... di tutorial inilah anda akan melihat kekuatan variabel yang sesungguhnya.
Nah, sekarang ayo kita coba sesuatu yang lebih menarik, dan bisa menunjukkan kegunaan variabel kita tercinta dalam sebuah program.
Baiklah, tanpa membuang waktu lagi, sekarang saatnya untuk membuat sebuah halaman web yang akan kita gunakan untuk menginput nama kita dan nama orang yang kita sukai dan kemudian menampilkannya secara bersamaan di halaman lain. Apa …… halaman lain? Ya, di halaman lain, ini yang membedakan dengan kode-kode kita sebelumnya, untuk itulah, mohon konsentrasi di bagian ini, karena ini sangat penting bagi perkembangan PHP anda di masa datang. Pahami betul bagaimana cara kita mengirimkan variabel kita dari satu halaman ke halaman yang lain yach…
Sebelum membuatnya, bayangkan kembali skenario ini. Anda membuat sebuah halaman website di mana pengunjung bisa mengisi nama mereka dan nama kekasih mereka dalam sebuah form dan kemudian menampilkan kembali nama-nama tersebut di halaman web lainnya.
Untuk melakukan hal itu, kita perlu membuat 2 buah file PHP. File pertama adalah sebuah form HTML untuk mengumpulkan input dari user, mengisikan input tersebut ke dalam variabel dan kemudian mengirimkannya ke file kedua yang bertugas menampilkan kembali isi variabel tersebut ditambah dengan beberapa hal sederhana lainnya. Maaf kalau cara penyampaiannya payah ya, tapi saya berharap paling enggak bisa tetap fun deh buat Prothelors dalam mempelajari PHP.
Pertama-tama, kita buat dulu halaman formnya, halaman ini adalah halaman HTML biasa dengan FORM di dalamnya. Sesudah ini kita akan buat sebuah halaman lain (PHP) untuk memproses apa yang diinputkan dari halaman HTML kita ini. Kita namai dengan form_saya.html
1. <html>
2. <head>
3. <title>Form Saya</title>
4. </head>
5. <body>
6.
7. <form action="hasil_form_saya.php" method=post>
8.
9. Nama saya adalah:
10. <br> <input type="text" name="NamaAnda">
11.
12. <p> Nama orang yang saya sukai:
13. <br> <input type="text" name="NamaDia">
14. <p>
15.
16. <input type="submit" name="submit" value="Cocokkan!">
17. </form>
18.
19. </body>
20. </html>
Ini adalah sebuah form HTML biasa tapi mengandung beberapa hal penting yang perlu Prothelors semua pahami. Bagian-bagian pentingnya adalah:
Baris 7: HTML membaca action="hasil_form_saya.php" yang menunjukkan pada browser file PHP mana yang akan memproses hasil form kita. Implikasinya, beberapa saat lagi anda harus membuat sebuah file yang bernama hasil_form_saya.php yang merupakan mesin kecil yang bertugas untuk menampilkan hasil input di form kita. (Jangan khawatir, kita akan membahas method=post belakangan)
Baris 10: input type="text" menentukan jenis elemen form apa yang kita inginkan,dalam kasus kita ini adalah sebuah inputan teks atau text box (kita juga bisa mendefinisikannya sebagai radio button, check box, dll); name="NamaAnda" artinya adalah bahwa apapun yang kita ketikkan ke dalam text box kita tadi akan mengisi sebuah variabel yang bernama “NamaAnda”. Inilah yang menghubungkan antara form dan variabel – setiap field dalam sebuah form dapat digunakan untuk mengisi variabel untuk kemudian kita gunakan sesuka kita (asik ya?).
Baris 13: di baris ini, kita memiliki sebuah teks input yang akan kita gunakan untuk mengisi variabel lain yang kita beri nama “NamaDia” yang merupakan nama orang yang kita sukai.
Baris 16, 17: Kode ini membuat sebuah tombol submit dengan tulisan “Cocokkan!” (maksudnya adalah coba cocokkan nama anda dengan nama orang yang anda sukai).
Dan berakhirlah form kita.
Nah, tugas form kita itu adalah mengumpulkan informasi nama anda dan nama orang yang anda sukai (tentu saja saat praktek, anda harus memasukkan nama-nama tersebut ke dalam form) dan mengisikannya ke dalam variabel masing-masing. Setelah itu ngapain ya? Berikutnya tentu saja adalah membawa dan menampilkan variabel yang sudah terisi dengan nama-nama tersebut dalam bentuk yang berbeda di …… ya, di halaman lain.
Masih inget kan, bahwa pada baris 7 kode HTML di atas, kita memberitahu form kita agar menuju atau mengeksekusi file hasil_form_saya.php begitu kita klik tombol submit (yang bertuliskan Cocokkan! itu). Berikut ini kira-kira isi file hasil_form_saya.php:
Baris 7: HTML membaca action="hasil_form_saya.php" yang menunjukkan pada browser file PHP mana yang akan memproses hasil form kita. Implikasinya, beberapa saat lagi anda harus membuat sebuah file yang bernama hasil_form_saya.php yang merupakan mesin kecil yang bertugas untuk menampilkan hasil input di form kita. (Jangan khawatir, kita akan membahas method=post belakangan)
Baris 10: input type="text" menentukan jenis elemen form apa yang kita inginkan,dalam kasus kita ini adalah sebuah inputan teks atau text box (kita juga bisa mendefinisikannya sebagai radio button, check box, dll); name="NamaAnda" artinya adalah bahwa apapun yang kita ketikkan ke dalam text box kita tadi akan mengisi sebuah variabel yang bernama “NamaAnda”. Inilah yang menghubungkan antara form dan variabel – setiap field dalam sebuah form dapat digunakan untuk mengisi variabel untuk kemudian kita gunakan sesuka kita (asik ya?).
Baris 13: di baris ini, kita memiliki sebuah teks input yang akan kita gunakan untuk mengisi variabel lain yang kita beri nama “NamaDia” yang merupakan nama orang yang kita sukai.
Baris 16, 17: Kode ini membuat sebuah tombol submit dengan tulisan “Cocokkan!” (maksudnya adalah coba cocokkan nama anda dengan nama orang yang anda sukai).
Dan berakhirlah form kita.
Nah, tugas form kita itu adalah mengumpulkan informasi nama anda dan nama orang yang anda sukai (tentu saja saat praktek, anda harus memasukkan nama-nama tersebut ke dalam form) dan mengisikannya ke dalam variabel masing-masing. Setelah itu ngapain ya? Berikutnya tentu saja adalah membawa dan menampilkan variabel yang sudah terisi dengan nama-nama tersebut dalam bentuk yang berbeda di …… ya, di halaman lain.
Masih inget kan, bahwa pada baris 7 kode HTML di atas, kita memberitahu form kita agar menuju atau mengeksekusi file hasil_form_saya.php begitu kita klik tombol submit (yang bertuliskan Cocokkan! itu). Berikut ini kira-kira isi file hasil_form_saya.php:
<html>
<head>
<title>Sayang Sekali!</title>
</head><body bgcolor="#FFFFFF" text="#000000">
<p>Kayaknya <?php print $NamaAnda; ?>
<p>gak bakalan bisa jadian sama
<b> <?php print $NamaDia; ?> deh!?! </b>
<p>Cobalah berusaha lebih keras ya…siapa tahu ada kesempatan.
</body>
</html>
Gimana, udah ngerti ya bagaimana caranya form kita mengirimkan sebuah variabel dari form kita itu ke sebuah file PHP?
Cat: FIle hasil_form_saya.php di atas hanya bisa berjalan jika setting register global php server kamu on. Kalau kebetulan settingnya off, maka kamu harus tambah baris setelah seperti ini:
Cat: FIle hasil_form_saya.php di atas hanya bisa berjalan jika setting register global php server kamu on. Kalau kebetulan settingnya off, maka kamu harus tambah baris setelah seperti ini:
<?
$NamaAnda=$_POST['NamaAnda'];
$NamaDia=$_POST['NamaDia'];
?>
Perhatikan bahwa pada file hasil_form_saya.php kita sebuah variabel dipanggil dengan menambahkan tanda $ ($NamaAnda) di depan variabel yang kita definisikan pada file HTML form_saya.html sebelumnya (NamaAnda).
Get vs Post
Kita sudah menggunakan metode "Post" untuk mengirimkan data form dengan cara yang berbeda menggunakan metode lain yaitu “Get”. Ingat, ini merupakan bagian dari form kita di mana tertulis <form action="hasil_form_saya.php" method=post>.
Perbedaan antara kedua metode ini adalah bahwa metode post secara transparan mengirimkan semua informasi yang sudah dikumpulkan oleh halaman form kita, sedangkan metode Get akan mengirimkan semua informasi itu sebagai bagian dari URL (dalam contoh form kita tadi, akan seperti ini: http://localhost/hasil_form_saya.php?NamaAnda=panjul&NamaDia=cinta&submit=Cocokkan! — Perhatikan bagaimana informasi yang sudah dimasukkan user mengenai namanya dan nama orang yang disukainya ditambahkan pada URL? Ini akan sangat membantu nanti jika anda sudah mempelajari cara pengiriman variabel antar halaman lebih lanjut).
Perbedaan antara kedua metode ini adalah bahwa metode post secara transparan mengirimkan semua informasi yang sudah dikumpulkan oleh halaman form kita, sedangkan metode Get akan mengirimkan semua informasi itu sebagai bagian dari URL (dalam contoh form kita tadi, akan seperti ini: http://localhost/hasil_form_saya.php?NamaAnda=panjul&NamaDia=cinta&submit=Cocokkan! — Perhatikan bagaimana informasi yang sudah dimasukkan user mengenai namanya dan nama orang yang disukainya ditambahkan pada URL? Ini akan sangat membantu nanti jika anda sudah mempelajari cara pengiriman variabel antar halaman lebih lanjut).
Keamanan Php
Saat kita mulai membuat aplikasi berbasis webdengan menggunakan PHP tentu kita akan berfokus pada cara pembuatannya, bagaimana mengimplementasikan logika sehingga menghasilkan suatu karya (sistem) yang berjalan sesuai dengan keinginan dan kebutuhan kita.
Tapi ada kalanya kita perlu membalik pola pikir tersebut dengan memandang sebagai seorang user (pengguna aplikasi) yang mungkin memiliki waktu lebih banyak dalam penggunaan aplikasi tersebut. Dalam hal ini banyak hal yang mungkin tidak kita perhatikan dari aplikasi buatan kita tersebut oleh karena itu ada pepatah “Tidak ada sistem yang sempurna.” tetapi penulis akan memberikan sedikit informasi keamanan dasar sehingga kita bisa sedikit melangkah menuju kesempurnaan tersebut.
Beberapa hal yang perlu diperhatikan dalam langkah percobaan para cracker untuk memboikot akses website kita antara lain :
1. Melalui URL (method GET)
2. Melalui media input yang terdapat dalam form (method POST)
1. Melalui URL (method GET)
2. Melalui media input yang terdapat dalam form (method POST)
Sebagaimana kita ketahui bahwa terdapat 2 cara umum pengiriman variable dalam PHP yaitu GET dan POST sehingga perlu penanganan khusus dalam penerimaan serta pengiriman variable tersebut.
Untuk method POST :
Method POST merupakan penangkapan variable dari media input yang terdapat dalam FORM.
Method POST merupakan penangkapan variable dari media input yang terdapat dalam FORM.
1. Batasi jumlah karakter (maxlength)
Pembatasan jumlah karakter dalam media input sangat penting sehingga tidak dimungkinkan penulisan script seperti javascript pada inputbox tersebut.
Contoh implementasi : <input name=”_cari” maxlength=”10″ />
Titik rawan : Input Login (username dan password), Input search
Pembatasan jumlah karakter dalam media input sangat penting sehingga tidak dimungkinkan penulisan script seperti javascript pada inputbox tersebut.
Contoh implementasi : <input name=”_cari” maxlength=”10″ />
Titik rawan : Input Login (username dan password), Input search
2. Lapisi dengan penahan kutip atau addslashes()
Fungsi PHP ini akan membantu kita menambahkan tanda kutip (‘ pada setiap karakter garing (/) sehingga dapat mencegah timbulnya efek SQL injection. Saya rasa teknik hacking ini cukup populer diantara anda. Penambahan kutip akan membuat garing menjadi bertipe string sehingga tidak dianggap sebagai salah satu perintah query pada MySQL / SQL.
Contoh implementasi : addslashes($_POST['_username'])
Titik rawan : Form Login
Fungsi PHP ini akan membantu kita menambahkan tanda kutip (‘
pada setiap karakter garing (/) sehingga dapat mencegah timbulnya efek SQL injection. Saya rasa teknik hacking ini cukup populer diantara anda. Penambahan kutip akan membuat garing menjadi bertipe string sehingga tidak dianggap sebagai salah satu perintah query pada MySQL / SQL.Contoh implementasi : addslashes($_POST['_username'])
Titik rawan : Form Login
3. Lapisi dengan penahan tag atau htmlspecialchars()
Untuk mencegah terjadinya teknik hacking xss atau javascript injection maka ada baiknya kita menambahkan fungsi tersebut. Hal ini akan membuat tag html maupun javascript memiliki tipe data string sehingga tidak akan dieksekusi oleh browser.
Apabila script dimungkinkan dalam media input sehingga masuk ke dalam database dan saat browser membuka halaman yang terkontaminasi tersebut maka browser akan melakukan eksekusi terhadap perintah tersebut yang biasanya dalam bentuk javascript.
Contoh implementasi : htmlspecialchars($_POST['pesan'])
Titik rawan : Form Login, Form Kontak Admin
Untuk mencegah terjadinya teknik hacking xss atau javascript injection maka ada baiknya kita menambahkan fungsi tersebut. Hal ini akan membuat tag html maupun javascript memiliki tipe data string sehingga tidak akan dieksekusi oleh browser.
Apabila script dimungkinkan dalam media input sehingga masuk ke dalam database dan saat browser membuka halaman yang terkontaminasi tersebut maka browser akan melakukan eksekusi terhadap perintah tersebut yang biasanya dalam bentuk javascript.
Contoh implementasi : htmlspecialchars($_POST['pesan'])
Titik rawan : Form Login, Form Kontak Admin
4. Perhatikan nama media input
Sudah saatnya kita berusaha sedikit lebih unik dalam menentukan nama pada media input kita sehingga mempersulit beberapa tools penjahat yang menggunakan library (kamus kata) dalam penentuan nama variable incarannya. Misalnya pada media input login tambahkan garis bawah. Tentu anda memiliki ide sendiri dalam
mengimplementasikan hal ini.
Contoh implementasi : <input name=”_username” />
Titik rawan : Input Login (username dan password)
Sudah saatnya kita berusaha sedikit lebih unik dalam menentukan nama pada media input kita sehingga mempersulit beberapa tools penjahat yang menggunakan library (kamus kata) dalam penentuan nama variable incarannya. Misalnya pada media input login tambahkan garis bawah. Tentu anda memiliki ide sendiri dalam
mengimplementasikan hal ini.
Contoh implementasi : <input name=”_username” />
Titik rawan : Input Login (username dan password)
Untuk method GET :
Method get merupakan penangkapan variable yang berasal dari URL.
Method get merupakan penangkapan variable yang berasal dari URL.
1. Gunakan .htaccess
Sebenarnya ini adalah sebuah metode yang menjadikan website kita seakan memiliki
struktur direktori yang luas, padahal itu adalah variable. Sehingga memecah
konsentrasi dari pengunjung yang berniat isenk. Bila halaman tidak ditemukan maka
kita dapat meredirectnya ke halaman 404 kesayangan kita.
Sebenarnya ini adalah sebuah metode yang menjadikan website kita seakan memiliki
struktur direktori yang luas, padahal itu adalah variable. Sehingga memecah
konsentrasi dari pengunjung yang berniat isenk. Bila halaman tidak ditemukan maka
kita dapat meredirectnya ke halaman 404 kesayangan kita.
Implementasi :
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ index.php?page=$1 [L]
</IfModule>
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ index.php?page=$1 [L]
</IfModule>
RewriteEngine on
RewriteCond %{HTTP_HOST} ^mydomain\.com$ [NC]
RewriteRule ^(.*) http://www.mydomain.com/$1 [L,R=301]
RewriteCond %{HTTP_HOST} ^mydomain\.com$ [NC]
RewriteRule ^(.*) http://www.mydomain.com/$1 [L,R=301]
Untuk lebih jelasnya dapat dilihat disini :
http://www.ilmuwebsite.com/tutorial-php/membuat-url-mod-rewrite-part-1-http-conf
http://www.ilmuwebsite.com/tutorial-php/membuat-url-mod-rewrite-part-1-http-conf
2. Hindari $_REQUEST()
Metode ini digunakan untuk menangkap variable dalam bentuk POST dan GET. Ada kalanya kita membutuhkan metode penerimaan variable dengan menggunakan fungsi ini, tetapi batasilah penggunaannya karena tanpa disadari suatu saat anda akan mendapatkan masalah karena hal ini. Dan bila kita telah terlanjur menggunakannya pada seluruh aplikasi kita maka kita akan sulit untuk merubah (Bisa, dengan memilah mana yang tidak perlu dan benar-benar menggunakan.).
Metode ini digunakan untuk menangkap variable dalam bentuk POST dan GET. Ada kalanya kita membutuhkan metode penerimaan variable dengan menggunakan fungsi ini, tetapi batasilah penggunaannya karena tanpa disadari suatu saat anda akan mendapatkan masalah karena hal ini. Dan bila kita telah terlanjur menggunakannya pada seluruh aplikasi kita maka kita akan sulit untuk merubah (Bisa, dengan memilah mana yang tidak perlu dan benar-benar menggunakan.).
Tambahan :
1. Session dan Cookies timeout
Gunakan timeout pada session atau cookies terutama untuk pengenalan login. Session merupakan penanda dari sisi server dan akan hilang apabila browser ditutup, sedangkan cookies adalah pengenalan dari sisi browser dan bila tidak diset timeout maka status akan terus login (pada pengenalan login.), tentu saja anda tau kemungkinan-kemungkinan yang akan terjadi selanjutnya.
1. Session dan Cookies timeout
Gunakan timeout pada session atau cookies terutama untuk pengenalan login. Session merupakan penanda dari sisi server dan akan hilang apabila browser ditutup, sedangkan cookies adalah pengenalan dari sisi browser dan bila tidak diset timeout maka status akan terus login (pada pengenalan login.), tentu saja anda tau kemungkinan-kemungkinan yang akan terjadi selanjutnya.
Mungkin sampai disini dulu, karena sudah waktunya berangkat kerja. Bila ada yang ingin ditambahkan silahkan ditambahkan karena pengetahuan kita tidak akan habis dengan saling berbagi.
Penulis : Dedy Antonius Sinaga
`
Langganan:
Postingan (Atom)