Wah dah lama juga ya, aku nggak ngeblog..
Kebetulan aku lagi nemuin syntax javascript untuk menampilkan jam yang ada pada komputer Anda, ni syntaxnya..
<div id="jam">
<script language="javascript">
function jam(){
var waktu = new Date();
var jam = waktu.getHours();
var menit = waktu.getMinutes();
var detik = waktu.getSeconds();
if (jam < 10){
jam = "0" + jam;
}
if (menit < 10){
menit = "0" + menit;
}
if (detik < 10){
detik = "0" + detik;
}
var jam_div = document.getElementById('jam');
jam_div.innerHTML = jam + ":" + menit + ":" + detik;
setTimeout("jam()", 1000);
}
jam();
</script>
</div>
Untuk nama - nama variabelnya bisa diganti sesuai keinginan Anda.
Selamat mencoba ya..
Menampilkan Jam Komputer Anda dengan Java Script
on 17 Oktober 2009Preformatted text
on 02 Oktober 2009Eh ada lagi lho syntax untuk mengatur text dalam HTML.. <p>Tag pre cukup baik untuk menampilkan kode komputer, misal:</p>
Yaitu <pre>
Tag ini berfungsi untuk mengontrol line break dan spasi.
Ni contohnya :
<html>
<head>
<title>
Rohman - Penggunaan Tag <pre>
</title>
</head>
<body>
<pre>
Ini
adalah contoh
penggunaan tag pre
yang berfungsi untuk mengontrol line break dan spasi
</pre>
for i = 1 to 10
print i
next i
</pre></body>
</html>
Dan hasilnya kayak gini ni....
Sudahkan Anda mencoba??!
Hello para pembaca...!
Nah berikut ini adalah contoh-contoh syntax penulisan bentuk text, misal tebal, miring, bergaris bawah, dan bentuk-bentuk lainnya. Ini syntaxnya:
<html>
<head>
<title>
Rohman - Bentuk Penulisan Text dalam HTML
</title>
</head>
<body>
<p><b>Contoh text bold</b></p>
<p><strong>Contoh text strong</strong></p>
<p><big>Contoh text big</big></p>
<p><em>Contoh text emphasized</em></p>
<p><i>Contoh text italic</i></p>
<p><u>Contoh text underline</u></p>
<p><small>Contoh text small</small></p>
<p>Contoh<sub> subscript</sub> and <sup>superscript</sup></p>
</body>
</html>
Nah sekarang Anda ketik syntax diatas setelah selesai di ketik, lalu jalankan dan perhatikan apa yang terjadi...
Kurang lebih hasilnya kayak gini :
Selamat Mencoba..!
Membuat Inputan Hanya Number (Angka) dengan java script
on 30 September 2009var inputText = document.createElement('input');
inputText.type = 'text';
inputText.name = 'frmTelp' + iteration;
inputText.id = 'frmTelp' + iteration;
inputText.size = 3;
inputText.className='formInput';
inputText.setAttribute("onKeyPress","return numbersonly(this, event);
Bagian yang berfungsi untuk membatasi inputan berupa Angka saja adalah :
inputText.setAttribute("onKeyPress","return numbersonly(this, event);
Format Teks HTML ( HTML Text Formating ) 3
on 12 September 2009Kutipan, Quotasi, dan Definisi Tag
<abbr>
Mendefinisikan singkatan
<acronym>
Mendefinisikan akronim
<address>
Mendefinisikan elemen alamat
<bdo>
Mendefinisikan arah teks
<blockquote>
Mendefinisikan sebuah kutipan panjang
<q>
Mendefinisikan sebuah kutipan pendek
<cite>
Mendefinisikan kutipan
<dfn>
Mendefinisikan sebuah istilah definisi
Beberapa Tag atau syntax..
<code>
Mendefinisikan teks kode komputer
<kbd>
Mendefinisikan teks keyboard
<samp>
Mendefinisikan contoh kode komputer
<tt>
Mendefinisikan teks teletype
<var>
Mendefinisikan sebuah variabel
<pre>
Mendefinisikan teks terformat
HTML menggunakan tag seperti <b> dan <i> untuk memformat output, seperti tebal atau miring teks.
Tag HTML ini dinamakan tag format.
Lihat bagian bawah halaman ini untuk referensi yang lengkap.
<b> Berfungsi untuk : Mendefinisikan teks tebal
<big> Berfungsi untuk : Mendefinisikan teks besar
<em> Berfungsi untuk : Mendefinisikan teks menekankan (teks penekanan)
<i> Berfungsi untuk : Mendefinisikan teks miring
<small> Berfungsi untuk : Mendefinisikan teks kecil
<sup> Berfungsi untuk : Mendefinisikan teks superscript
<ins> Berfungsi untuk : Mendefinisikan teks yang disisipkan
<del> Berfungsi untuk : Mendefinisikan teks yang dihapus
<s> Berfungsi hampir sama penggunaanya seperti del
<u> Berfungsi untuk : Mendefinisikan teks bergaris bawah
Tata Cara Penulisan Tag pada HTML
on 11 September 2009Start tag *
<p>
<a href="file.htm" >
End tag *
</p>
</a>
Elemen HTML adalah semua yang tertulis dari tag awal sampai akhir tag:
* start tag sering disebut tag pembuka. Tag akhir sering disebut tag penutup.
Sintaks Elemen HTML
* Sebuah elemen HTML dimulai dengan tag awal / pembuka tag
* Sebuah elemen HTML diakhiri dengan tag akhir / tag penutup
* Unsur konten adalah segalanya antara awal dan akhir tag
* Beberapa elemen HTML memiliki konten kosong
* Empty elemen ditutup pada awal tag
* Sebagian besar elemen HTML dapat memiliki atribut
HTML Elements Bersarang.
Sebagian besar elemen HTML dapat bersarang (dapat berisi elemen HTML lainnya).
Dokumen HTML terdiri dari elemen HTML bersarang.
Contoh Dokumen HTML :
<html>
<body>
<p>Paragraf Pertama</p>
<p>Paragraf Kedua</p>
</body>
</html>
Contoh diatas menggunakan tiga element HTML.
Penjelasan Contoh di atas :
elemen <p> :
<p>Paragraf pertama</p>
Elemen yang <p> mendefinisikan sebuah paragraf di dokumen HTML
Unsur memiliki start tag: <p> dan end tag: </p>
Konten elemen adalah: Paragraf Pertama
elemen <body> :
<body>
<p>Paragraf Pertama</p>
<p>Paragraf Kedua</p>
</body>
Elemen <body> mendefinisikan tubuh dokumen HTML
Unsur memiliki start tag: <body> dan end tag: </body>
Konten elemen elemen HTML lain (paragraf)
elemen <html>
<html>
<body>
<p>Paragraf Pertama</p>
<p>Paragraf Kedua</p>
</body>
</html>
Elemen <html> mendefinisikan seluruh dokumen HTML.
Unsur memiliki start tag <html> dan end tag </html>
Konten elemen elemen HTML lain (body)
Jangan Lupakan Akhir Tag
Kebanyakan browser akan menampilkan HTML dengan benar bahkan jika Anda lupa akhir tag:
<p>Paragraf Pertama
<p>Paragraf Kedua
Contoh di atas akan bekerja pada kebanyakan browser, tapi jangan bergantung pada itu. Lupa tag akhir dapat menghasilkan hasil yang tidak diharapkan atau kesalahan.
Catatan: Masa Depan versi HTML tidak akan mengizinkan Anda untuk melewatkan tag penutup.
Kosong HTML Elements
Tanpa isi elemen HTML disebut elemen kosong. Elemen kosong dapat ditutup pada awal tag.
<br> adalah elemen kosong tanpa tag penutup (berfungsi untuk mendefinisikan satu baris atau biasa disebut sebagai pengganti baris).
Dalam XHTML, XML, dan versi dari HTML, semua elemen harus ditutup.
Menambahkan garis miring ke awal tag, seperti <br/>, adalah cara yang tepat untuk menutup elemen kosong, diterima oleh HTML, XHTML dan XML.
Bahkan jika <br> bekerja di semua browser, menulis <br/> bukan bukti lebih modern.
Sumber : http://www.w3schools.com
Penyisipan gambar pada HTML didefinisikan dengan tag <img>.
Contoh :
<img src="gambar.jpg" width="104" height="142" />
Sumber : http://www.w3schools.com
Penulisan Link pada HTML didefinisikan dengan tag <a>.
Contoh :
<a href="http://www.f4ni-rbg.blogspot.com">Ini adalah Link Blognya Fathur Rohman </a>
Sumber : http://www.w3schools.com
Paragraf pada HTML didefinisikan dengan tag <p>.
Contoh:
<p>Ini adalah Paragraf </p>
<p>Ini adalah Paragraf yang lain </p>
Sumber : http://www.w3schools.com
Heading pada HTML didefinisikan dengan tag <h1> untuk <h6>.
Contoh
<h1>Ini adalah Heading1 </h1>
<h2>Ini adalah Heading2</h2>
<h3>Ini adalah Heading3</h3>
Sumber : http://www.w3schools.com
Apa yang Anda Butuhkan untuk belajar HTML? <html> <h1>Ini adalah Halaman Utama</h1> </body> <html> <h1>Ini adalah Halaman1</h1> </body> <html> <h1>Ini adalah Halaman2</h1> </body>
Anda tidak memerlukan alat untuk mempelajari HTML.
* Anda tidak memerlukan editor HTML
* Anda tidak perlu web server
* Anda tidak perlu situs web
Editing HTML
Dalam tutorial ini saya menggunakan editor teks biasa (seperti Notepad) untuk mengedit HTML. Saya percaya ini adalah cara terbaik untuk mempelajari HTML.
Namun, pengembang web profesional sering lebih memilih editor HTML seperti FrontPage atau Dreamweaver, alih-alih menulis teks biasa.
Jika Anda ingin membuat web tes di komputer Anda sendiri, hanya menyalin 3 file di bawah ini untuk desktop Anda.
halamanUtama.htm
<p><a href="halaman1.htm">Ini adalah Link ke Halaman 1</a></p>
<p><a href="halaman2.htm">Ini adalah Link ke Halaman 2</a></p>
Simpan syntax di atas dengan nama file halamanUtama.htm
halaman1.htm
Simpan syntax di atas dengan nama file halaman1.htm
halaman2.htm
Simpan syntax di atas dengan nama file halaman2.htm
Setelah Anda membuat 3 file di atas, Anda dapat mengklik dua kali pada file yang bernama "halamanUtama.htm" dan lihat situs web pertama Anda dalam browser.
Hasilnya kurang lebih seperti ini :
Saya sarankan Anda melakukan percobaan dengan segala sesuatu yang Anda pelajari disini dengan mengedit file web Anda dengan editor teks (seperti Notepad).
Ketika Anda menyimpan file HTML, Anda dapat menggunakan baik. Htm atau. Html ekstensi. Kita gunakan. Htm dalam contoh kita. Ini adalah kebiasaan dari masa lalu, ketika perangkat lunak hanya diperbolehkan tiga huruf dalam file ekstensi.
Dengan software baru itu benar-benar aman untuk digunakan. Html.
Sumber : http://www.w3schools.com
HTML adalah bahasa untuk mendeskripsikan halaman web.
* HTML singkatan Hyper Teks Markup Language
* HTML bukan bahasa pemrograman, ini adalah bahasa markup
* Sebuah bahasa markup adalah serangkaian tag markup
* HTML menggunakan tag markup untuk menjelaskan halaman web
HTML Tag
Markup tag HTML biasanya disebut tag HTML
* HTML tag adalah kata kunci dikelilingi oleh sudut kurung seperti <html>
* HTML tags biasanya datang dalam pasangan seperti <b> dan </ b>
* Tag yang pertama dalam pasangan adalah tag awal, tag kedua adalah tag akhir
* Mulai dan akhiri tag juga disebut tag membuka dan menutup tag
HTML Dokumen = Web Pages
* Menggambarkan dokumen HTML halaman web
* Dokumen HTML berisi tag HTML dan teks biasa
* Dokumen HTML juga disebut halaman web
Tujuan dari sebuah web browser (seperti Internet Explorer atau Firefox) adalah untuk membaca dokumen HTML dan menampilkan mereka sebagai halaman web. Browser tidak menampilkan tag HTML, tetapi menggunakan tag untuk menafsirkan isi dari halaman:
<html>
<body>
<h1>Hai Semuanya </h1>
<p>Perkenalkan Nama saya : Fathur Rohman </p>
</body>
</html>
Penjelasan Contoh di atas :
* Teks antara <html> dan </ html> menjelaskan halaman web
* Teks antara <body> dan </ body> adalah halaman yang terlihat konten
* Teks antara <h1> dan </ h1> ditampilkan sebagai judul
* Teks antara <p> dan </ p> ditampilkan sebagai sebuah paragraf
Sumber : http://www.w3schools.com
Langkah awal memulai PHP
on 06 September 2009Untuk mendapatkan akses ke web server dengan dukungan PHP, Anda dapat:
* Instal Apache (atau IIS) di server Anda sendiri, instal PHP, dan MySQL
* Atau cari rencana hosting web dengan PHP dan MySQL support
Install PHP
Apa yang Anda Butuhkan?
Jika server Anda mendukung PHP Anda tidak perlu melakukan apapun.
Hanya menciptakan beberapa. Php file pada direktori web Anda, dan server akan mem-parsing untuk Anda. Karena gratis, kebanyakan web host menawarkan dukungan PHP.
Namun, jika server anda tidak mendukung PHP, anda harus menginstal PHP.
Berikut ini adalah link ke tutorial yang baik dari PHP.net tentang cara menginstal PHP5: http://www.php.net/manual/en/install.php
Download PHP
Download PHP gratis di sini: http://www.php.net/downloads.php
Download MySQL Database
Download MySQL gratis di sini: http://www.mysql.com/downloads/index.html
Download Apache Server
Download Apache gratis di sini: http://httpd.apache.org/download.cgi
Beberapa kelebihan PHP
* PHP berjalan pada berbagai platform (Windows, Linux, Unix, dll)
* PHP kompatibel dengan hampir semua server yang digunakan sekarang (Apache, IIS, dll)
* PHP adalah GRATIS untuk men-download dari sumber resmi PHP: www.php.net
* PHP mudah dipelajari dan berjalan efisien pada sisi server
PHP adalah server-side scripting language yaitu suatu bahasa pemrograman yang hanya bejalan di server dan tidak dapat dilihat sourcecode nya oleh client. Sebelum kita belajar PHP, Anda harus memiliki pemahaman dasar HTML / XHTML dan JavaScript.
Pengertian singkat PHP :* PHP adalah singkatan dari PHP: Hypertext Preprocessor
* PHP adalah server-side scripting language, seperti ASP, PHP script dijalankan di server
* PHP mendukung banyak database (MySQL, Informix, Oracle, Sybase, Solid, PostgreSQL, Generic ODBC, dll)
* PHP adalah sebuah perangkat lunak open source
* PHP gratis untuk didownload dan digunakan
Sedikit mengenai file PHP :
* file PHP dapat berisi teks, tag HTML dan script
* File PHP dikembalikan ke browser sebagai HTML
* file PHP memiliki ekstensi file dari ". Php", ". Php3", atau ". Phtml"
seklumit tentang MySQL :
* MySQL adalah server database
* MySQL adalah ideal untuk aplikasi besar maupun kecil
* MySQL mendukung SQL standar
* MySQL menyusun pada sejumlah platform
* MySQL adalah gratis untuk didownload dan di gunakan
PHP + MySQL
* PHP dikombinasikan dengan MySQL adalah cross-platform (Anda dapat mengembangkan di Windows dan melayani pada platform Unix)
Ada empat cara yang berbeda untuk melampirkan JavaScript ke dalam HTML. Nah, mari kita lihat keempat alternatif dan mempertimbangkan bagaimana dan kapan masing-masing harus digunakan.
Cara 1
<script type="text/javascript" src="script1.js"></script>
Ini adalah murni HTML solusi untuk menghubungkan JavaScript ke dalam HTML. Dengan metodemelampirkan JavaScript untuk HTML ini, semua JavaScript pada file terpisah (dalam contoh script1.js dan ini tidak dalam JavaScript tetapi di dalam HTML.
Cara 2
Jika Anda menempatkan semua JavaScript Anda ke file eksternal dan link mereka ke dalam kepala halaman Anda gunakan perintah seperti ini:
<script type="text/javascript">
/* <![CDATA[ */
alert('JavaScript alert');
/* ]]> */
</script>
Ini adalah solusi hibrida di mana kode JavaScript tertanam ke dalam file HTML itu sendiri. Kode JavaScript dalam contoh ini adalah sepenuhnya tertutup unsur dalam naskah dan karena itu masih jelas mana yang HTML dan mana yang JavaScript.
Cara 3
Solusi ini menyediakan cara sederhana untuk menggabungkan HTML dan JavaScript ke dalam satu file ketika Anda sedang menguji halaman saat membuatnya mudah untuk memisahkan JavaScript ke file sendiri setelah pengujian selesai.
onclick="alert('javascript alert');"
Kode ini adalah murni JavaScript yang dapat dilampirkan ke dalam tag HTML untuk melampirkan pengolahan untuk menangani peristiwa yang ditentukan untuk itu tag.
Cara 4
<a href="javascript:alert('JavaScript alert');">
Cara menggabungkan JavaScript ini langsung ke atribut HTML harus dihindari setiap saat. Tidak hanya HTML dan JavaScript campur aduk dengan cara kode pengkodean seperti ini tapi ditulis sedemikian rupa untuk memecahkan HTML bila JavaScript tidak tersedia.
Terima Kasih...
Cara 1
<script type="text/javascript" src="script1.js"></script>
Ini adalah murni HTML solusi untuk menghubungkan JavaScript ke dalam HTML. Dengan metodemelampirkan JavaScript untuk HTML ini, semua JavaScript pada file terpisah (dalam contoh script1.js dan ini tidak dalam JavaScript tetapi di dalam HTML.
Cara 2
Jika Anda menempatkan semua JavaScript Anda ke file eksternal dan link mereka ke dalam kepala halaman Anda gunakan perintah seperti ini:
<script type="text/javascript">
/* <![CDATA[ */
alert('JavaScript alert');
/* ]]> */
</script>
Ini adalah solusi hibrida di mana kode JavaScript tertanam ke dalam file HTML itu sendiri. Kode JavaScript dalam contoh ini adalah sepenuhnya tertutup unsur dalam naskah dan karena itu masih jelas mana yang HTML dan mana yang JavaScript.
Cara 3
Solusi ini menyediakan cara sederhana untuk menggabungkan HTML dan JavaScript ke dalam satu file ketika Anda sedang menguji halaman saat membuatnya mudah untuk memisahkan JavaScript ke file sendiri setelah pengujian selesai.
onclick="alert('javascript alert');"
Kode ini adalah murni JavaScript yang dapat dilampirkan ke dalam tag HTML untuk melampirkan pengolahan untuk menangani peristiwa yang ditentukan untuk itu tag.
Cara 4
<a href="javascript:alert('JavaScript alert');">
Cara menggabungkan JavaScript ini langsung ke atribut HTML harus dihindari setiap saat. Tidak hanya HTML dan JavaScript campur aduk dengan cara kode pengkodean seperti ini tapi ditulis sedemikian rupa untuk memecahkan HTML bila JavaScript tidak tersedia.
Terima Kasih...
Menambah Mata Uang Rupiah pada Prestashop
on 23 Agustus 2009Sebelumnya Anda harus Login dulu sebagai admin
Back Office >> Payment >> Currencies
Nah, untuk mengganti (baca: edit) >> dari daftar mata uang (misalnya Euro atau Dollar) klik aja salah satu, lalu ganti:
-Currency : Dollar >> Rupiah
-ISO Code : USD >> IDR
-Symbol : $ >> Rp
Sedangkan untuk menambah silahkan klik ‘Add New’ lalu isikan :
-Currency : Rupiah
-ISO Code : IDR
-Symbol : Rp
-Conversion Rate : 1 (isi sesuai kurs yang tepat, di sini hanya contoh)
jangan lupa simpan dengan klik ‘Save’
kembali ke >> Payment >> Currencies. Cihuiii! Rupiah tercinta sudah ada di daftar mata uang!
Jika ingin Rupiah jadi default: di bawah daftar mata uang tersebut ada ‘Currencies Option’ nah setting aja Rupiah sebagai ‘Default Currency’
Jangan lupa klik ‘Save’
Jika ingin Rupiah jadi satu satunya mata uang yang ditampilkan di front office, pastikan rupiah menjadi ‘Default Currency’
lalu Uninstall modul Currency Block di Back Office >> Modul
Mengatur Warna Text
on 20 Agustus 2009Buka text editor Anda misal notepad atau yang lainnya, lalu ketikkan sintaks di bawah ini pada text editor Anda:
<html>
<head>
<title> Latihan Memberi Text </title>
</head>
<body text ="red" >Hello ?
Sekarang warna text pada webku berwarna merah kan...???
</body>
</html>
Simpan dengan nama file "latihan3.html" pada folder C:\webku. Jalankan file "latihan3.html" dan lihatlah hasilnya:
Buka text editor Anda misal notepad atau yang lainnya, lalu ketikkan sintaks di bawah ini pada text editor Anda:
<html>
<head>
<title> Latihan Memberi Warna Background </title>
</head>
<body bgcolor ="blue" >Hello ?
Sekarang Background webku berwarna biru lho....!
</body>
</html>
Simpan dengan nama file "latihan2.html" pada folder C:\webku. Jalankan file "latihan2.html" dan lihatlah hasilnya:
ket:
Selain blue (biru), terdapat 15 jenis warna lainnya
yang bisa Anda pilih secara langsung, yaitu
SILVER, GRAY, WHITE, MAROON, RED, PURPLE,
FUCHSIA, GREEN, LIME, OLIVE, YELLOW, NAVY,
TEAL, dan AQUA.
Selain itu, untuk menentukan sebuah warna dalam dokumen
HTML, Anda juga dapat menggunakan kombinasi 6 angka
0,1,2,3,4,5,6,7,8,9,a,b,c,d,e, dan f yang diawali karakter #.
Contoh penggunaannya adalah <body bgcolor ="#ff0022" >
Disini saya akan mengajak anda mengenal sintaks-sintaks dasar html. Namun terlebih dahulu buatlah sebuah folder untuk penempatan file-file latihan yang akan kita buat.
Mari kita mulai.....
Buatlah direktori bernama webku di drive C: pada komputer Anda. Nah, kali ini kita akan latihan menenal sintaks <html>, <head>, <title> , dan <body>.
1. Langkah Pertama
Jalankan Text Editor kesayangan Anda, misal: Notepad, Dreamweaver dan lain-lain. Namun kali ini mari kita gunakan notepad.
2. Langkah Kedua
Ketik text di bawah ini:
<html>
<head>
<title> Latihan Web Pertamaku </title>
</head>
<body>Hello ?
Ini Web pertamaku lho....!
</body>
</html>
3. Langkah Ketiga
Klik menu file->Save As pada menubar Notepad
4. Langkah Keempat
Pada bagian save in pilih folder webku yang telah anda buat, lalu isi kotak file name dengan nama "latihan1.html"(tulis beserta tanda kutipnya agar tersimpan sebagai file html) lalu klik save.
5. Langkah Kelima
Klik tombol start->Run lalu pada kotak Open ketik C://webku lalu klik tombol OK.
6. Langkah Keenam
Maka akan muncul windows explorer seperti gambar dibawah ini:
7. Langkah ketujuh
klik dua kali (doubleclick) file latihan.html
8. Langkah kedelapan
Anda telah berhasil membuat web pertama Anda, kurang lebih inilah hasilnya:
Selamat.....!
Cek Validasi URL
on 17 Agustus 2009Untuk memeriksa suatu string url, apakah valid atau tidak, kita bisa
menggunakan perintah seperti dibawah ini.
if (preg_match('|^http(s)?://[a-z0-9-]+(.[a-z0-9-]+)*(:[0-9]+)?(/.*)?$|i',
$website) && !empty($website)) {
$error .= 'Url tidak valid
';
Semoga Bermanfaat...
Silahkan Mencoba
Pengenalan HTML
on 10 Agustus 2009A. World Wide Web
Internet merupkan jaringan global yang menghubungkan suatu
network dengan network lainya di seluruh dunia, TCP/IP menjadi
protocol penghubung antara jaringan-jaringan yang beragam di seluruh
dunia untuk dapat berkomunikasi.
World Wide Web (WWW) merupakan bagian dari internet yang paling
cepat berkembang dan paling populer.
WWW bekerja merdasarkan pada tiga mekanisme berikut:
1) Protocol standard aturan yang di gunakan untuk berkomunikasi
pada computer networking, Hypertext Transfer Protocol (HTTP)
adalah protocol untuk WWW.
2) Address WWW memiliki aturan penamaan alamat web yaitu
URL(Uniform Resource Locator) yang di gunakan sebagai standard
alamat internet.
3) HTML digunakan untuk membuat document yang bisa di akses
melalui web.
B. Pengenalan HTML
Hypertext Markup Language merupkan standard bahasa yang di
gunakan untuk menampilkan document web, yang bisa anda lakukan
dengan HTML yaitu:
1) Mengontrol tampilan dari web page dan contentnya.
2) Mempublikasikan document secara online sehingga bisa di akses
dari seluruh dunia.
3) Membuat online form yang bisa di gunakan untuk menangani
pendaftaran, transaksi secara online.
4) Menambahkan object-object seperti image, audi, video dan juga
java applet dalam document HTML.
C. Browser dan Editor
1) Browser
Browser merupakan software yang di install di mesin client yang
berfungsi untuk menterjemahkan tag-tag HTML menjadi halaman web.
Browser yang sering di gunakan biasanya Internet Explorer, Netscape
Navigator dan masih banyak yang lainya.
2) Editor
Program yang di gunakan untuk membuat document HTML, ada banyak
HTML editor yang bisa anda gunakan diantaranya: Ms FrontPage,
Dreamweaver, Notepad.
Perbedaan menu vertikal dengan horizontal adalah:
· Lebarnya jauh lebih lebar dari menu vertikal
· Teks nya berada di tengah
· Setiap elemen berada di sisi elemen lainnya, bukan di bawah elemen lainnya.
Untuk mendesain menu horizontal, kita hanya tinggal memodifikasi beberapa kode CSS dari
menu Vertikal. Kode yang harus dimodifikasi adalah
· Kita perlu mengubah width dari elemen ul karena tidak diperlukan lagi 100%
· Elemen a tidak memerlukan display:block, karena akan di-float
· Karena kita membuat teks menjadi di tengah, padding kanan dan kiri bisa dihapus
· Border pun diubah dari bottom menjadi right
Kode hasil modifikasi menjadi sbb:
#nav {
margin: 0;
padding: 0;
background: #663300;
list-style-type: none;
float: leftfloat: left; /* Contain floated list items */
}
#nav li {
margin: 0;
padding: 0;
float: left;
}
#nav a {
float: left;
width: 127px;
text-align: center;
color: #FFF;
text-decoration: none;
line-height: 2;
border-right: 1px solid #FFF;
}
di petik dari IlmuKomputer.Com
Untuk mendesain menu dengan CSS kita memerlukan daftar menu yang dibuat dengan HTML.
Tag HTML yang digunakan untuk membuat menu adalah ul. Di bawah ini adalah kode HTML
dari menu yang akan didesain oleh CSS.
<ul>
<li><a href="/">Home</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="support.html">Suport</a></li>
<li><a href="about.html">About Us</a></li>
<li><a href="contact.html">Contact Us</a></li>
</ul>
Kode tersebut akan menghasilkan tampilan sbb:
· Home
· Services
· Support
· About Us
· Contact Us
Untuk mendesain menu tersebut kita harus memberi id terlebih dahulu untuk membedakan
dengan daftar ul yang lain, sehingga kode di atas menjadi sbb:
<ul id=”navid=”nav”>
<li><a href="/">Home</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="support.html">Suport</a></li>
<li><a href="about.html">About Us</a></li>
<li><a href="contact.html">Contact Us</a></li>
</ul>
Setelah diberi id, kita bisa memilih menu tersebut dengan CSS dan mulai mendesainnya. Kode
CSS nya adalah sebagai berikut:
<style>
#nav {
list-style-type: none;
margin: 0;
padding: 0;
width: 180px;
background-color: #663300;
}
</style>
Dengan kode diatas maka menu tidak akan menampilkan bullet (dengan kode list-style-type:
none), batas dan padding akan menjadi 0, lebar 180px, dan akan menampilkan warna latar
cokelat. Kurang lebih tampilannya seperti ini:
Setelah itu kita akan mendesain tiap menu item, yang mana tag dari item-item tersebut adalah
diklik menjadi lebih besar (tidak hanya teks nya saja, melainkan seluruh kotak).
Kita perlu menambahkan kode CSS lagi untuk mendesainnya. Kode CSS nya adalah sbb:
#nav li {
margin: 0;
padding: 0;
}
#nav a {
display: block; /* untuk memperbesar area klik karena tag a defaultnya inline
*/
color: #FFF;
text-decoration: none;
padding: 0 15px;
line-height: 2.5; border-bottom:1px solid #FFF;
}
Degan kode tersebut, maka tampilan menu akan menjadi sebagai berikut:
Untuk mengatasi tampilan yang tidak diharapkan tersebut maka perlu ditambahkan kode sbb:
#nav {
margin: 0;
padding: 0;
background: #6F6146;
list-style-type: none;
width: 180px;
float: left; /* Contain floated list items */
}
#nav li {
margin: 0;
padding: 0;
float: left; /* This corrects the */
width: 100%; /* IE whitespace bug */
}
Dengan kode tersebut maka menu pun akan tampil seperti yang diharapkan pada IE6.
Untuk menambah efek ketika mouse di atas salah satu menu item, maka kita akan mengubah
warna latar dari menu item tersebut dengan kode:
#nav a:hover {
background: #330000;
}
Catatan:
a. IE6 merupakan browser yang tidak standar, sehingga seringkali menampilkan tampilan yang tidak
diharapkan. Karena itu, selalu gunakan browser yang standar seperti Mozilla Firefox dan Safari.
b. Dan selalu periksa hasil desain kita di IE6 agar hasil desain kita sama di semua browser.
Sehingga kode html dan css selengkapnya adalah sbb:
<!-- vertical.css -->
<html>
<head><title></title></head>
<style type="text/css">
#container {
width: 720px;
}
#header {
height: 100px;
background-color: #9FB5BD;
}
#content {
width: 540px;
float: left;
}
#sidebar {
width: 180px;
float: right;
}
#footer {
clear: both;
}
#nav {
margin: 0;
padding: 0;
list-style-type: none;
background-color: #663300;
width: 180px;
float: left;
}
#nav li {
margin: 0;
padding: 0;
float:left;
width:100%;
}
#nav a {
display: block; /* untuk memperbesar area klik karena tag a defaultnya inline
*/
color: #FFF;
text-decoration: none;
padding: 0 15px;
line-height: 2;
border-bottom:1px solid #FFF;
}
#nav a:hover {
background: #330000;
}
</style>
</head>
<body>
<ul id='nav'>
<li><a href="#">Home</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="support.html">Suport</a></li>
<li><a href="about.html">About Us</a></li>
<li><a href="contact.html">Contact Us</a></li>
</ul>
</body>
</html>
di petik dari www.ilmukomputer.com
Crop gambar dengan PHP
on 09 Agustus 2009Halo semua para pembaca setia artikel ilmuwebsite. Tutorial kali ini akan bermain-main dengan image. Jadi jangan lupa siapkan dulu sebuah image untuk dijadikan kelinci percobaan :-D... Siapkan sebuah gambar dengan nama “gambar1.jpg”. Letakkan gambar ini dalam satu folder dengan file PHPnya. Setelah itu buat script PHP dengan nama “crop.php”. Jika sudah, ketikkan script berikut :
crop.php
$h) {
$adjusted_width = $w / $hm;
$half_width = $adjusted_width / 2;
$int_width = $half_width - $w_height;
imagecopyresampled($dimg,$simg,-$int_width,0,0,0,$adjusted_width,$nh,$w,$h);
} elseif(($w <$h) || ($w == $h)) { $adjusted_height = $h / $wm; $half_height = $adjusted_height / 2; $int_height = $half_height - $h_height; imagecopyresampled($dimg,$simg,0,-$int_height,0,0,$nw,$adjusted_height,$w,$h); } else { imagecopyresampled($dimg,$simg,0,0,0,0,$nw,$nh,$w,$h); } imagejpeg($dimg,$dest,100); } $gambar = "gambar1.jpg"; $gambar_crop = "gambar1crop.jpg"; // jalankan fungsi crop gambar // lebar, tinggi, file yang di crop, format gambar, nama file setelah di crop cropImage(225, 165, "$gambar", 'jpg', "$gambar_crop"); print "
Selama ini Anda mungkin hanya mengenal Personal Web Server (PWS) sebagai web server untuk menjalankan PHP pada sistem operasi Windows 9x. Padahal selain PWS Anda juga bisa menggunakan Apache sebagai web servernya. Untuk menginstall Apache for Windows Anda dapat menggunakan PHP Triad yang merupakan "kumpulan" dari berbagai software yaitu:
* PHP - 4.0.5
* MySQL - 3.23.32 (database server)
* Apache - 1.3.14 (web server)
* PHPMyAdmin - 2.1.0 (untuk administrasi database)
* Perl - nsPerl 5.005_03
Jadi dengan menginstall PHP Triad Anda dapat menggunakannya untuk belajar PHP, Perl dan database MySQL. Untuk menginstall PHP Triad caranya adalah sebagai berikut:
1 Download PHP Triad di http://www.phpgeek.com
2 Untuk memulai proses install, klik 2x pada file yang baru Anda download tersebut dan tunggu sampai proses install selesai.
3
Untuk menjalankan Apache, klik Start - Programs - PHP Triad - Start Apache.
Untuk menjalankan MySQL, klik Start - Programs - PHP Triad - Start MySQL.
4. Untuk mengecek Apache, klik shortcut Launch Site. Jika pada browser muncul tulisan "Welcome to PHPTriad for Windows ... " maka proses install yang Anda lakukan berhasil.
5. Untuk mengecek MySQL, klik Start MySQL dan PHPMyAdmin. Jika Anda melihat tulisan "Welcome to phpMyAdmin..." berarti proses install berhasil.
6. Sampai di sini proses intall telah selesai. Jika sewaktu-waktu Anda ingin mencoba script PHP dan database MySQL Anda harus menjalankan Apache dan MySQL terlebih dahulu.
tambahan :
Letakkan script PHP Anda di C:\apache\htdocs.
Untuk dapat menjalankan PHP Anda membutuhkan sebuah web server. Anda yang pake Linux dapat menggunakan Apache (www.apache.org) sebagai web servernya. Anda pemakai Windows 98 paling enak menggunakan Personal Web Server (sama2 produk Microsot, keuntungannya bisa sekalian buat belajar ASP). Web server Xitami (www.imatix.com) dapat digunakan apabila Anda menggunakan Windows NT.
Sedangkan PHP-nya sendiri dapat Anda download dari www.php.net. Perhatikan bahwa PHP yang Anda download sesuai dengan sistem operasi komputer Anda (Linux atau Windows).
Install PHP pada Windows 98
1. Setelah Anda mendapatkan PHP dalam bentuk file zip, segera ekstrak dengan menggunakan WinZip atau pun WinRar.
2. Ganti nama file php.ini-dist menjadi php.ini.
3. Copy semua file tersebut (totalnya ada 10 file) ke directory Windows Anda (biasanya C:\Windows).
Langkah selanjutnya adalah mengganti setting pada registry Windows.
1. Dari menu Start, pilih Run.
2. Ketikkan regedit, klik OK.
3. Buka cabang HKEY_CLASSES_ROOT.
4. Buat key baru dengan cara klik kanan pada HKEY_CLASSES_ROOT, pilih New - Key.
5. Beri nama key tersebut dengan .php3.
6. Pada panel sebelah kanan klik 2x pada [Default] dan isi dengan php3file.
7. Buat key baru lagi pada HKEY_CLASSES_ROOT.
8. Beri nama key baru tersebut dengan php3file.
9. Pada php3file, buat key baru dengan nama Shell.
10. Pada php3file\Shell, buat key baru dengan nama Open.
11. Pada php3file\Shell\Open, buat key baru dengan nama Command.
12. Pada panel sebelah kanan klik2x pada [Default] dan isi dengan C:\Windows\php.exe.
13. Buka key HKEY_LOCAL_MACHINE\System\CurrentControlSet\
Services\W3SVC\Parameters\Script Map.
14. Pada panel sebelah kanan buat string value baru dengan cara klik kanan (pada panel sebelah kanan), pilih New - String Value.
15. Beri nama dengan .php3.
16. Klik 2x pada .php3 tersebut.
17. Isi dengan C:\Windows\Php.exe.
Untuk mengecek apakah PHP Anda sudah terinstall dengan baik, tulis kode berikut ini dan simpan dengan nama test.php3.
Jika PHP sudah terinstall dengan baik maka saat file tersebut dibaca dari browser akan terlihat informasi mengenai PHP.
PHP merupakan script yang menyatu dengan HTML dan berada pada server (server side HTML embedded scripting). Dengan PHP ini Anda dapat membuat beragam aplikasi berbasis web, mulai dari halaman web yang sederhana sampai aplikasi komplek yang membutuhkan koneksi ke database.
Sampai saat ini telah banyak database yang telah didukung oleh PHP dan kemungkinan akan terus bertambah. Database tersebut adalah :
* dBase
* DBM
* FilePro
* mSQL
* MySQL
* ODBC
* Oracle
* Postgres
* Sybase
* Velocis
Selain itu PHP juga mendukung koneksi dengan protokol IMAP, SNMP, NNTP dan POP3.
refresh dengan java
on 27 Juli 2009"<body onLoad=window.setTimeOut('location.href=http://www.url.html',10000)>"
Copy this code inside the BODY part of your HTML file
Letakkan syntax di atas pada bagian BODY di file HTML
Langganan:
Postingan (Atom)
