website
Membuat tabel dengan tag html
Tag HTML atau HyperText Markup Language merupakan bahasa komputer yang berada di dunia internet atau dunia WWW, Semua website yang dibuat menggunakan bahasa ini, Tag tag HTML sangat banyak sekali, pada kesempatan kali ini, kita akan belajar dengan tag HTML untuk membuat tabel. Komponen utama tag HTML untuk membuat tabel adalah antara lain table, tr, td, th
- table atau <table> … </table> merupakan tanda/tag html diawalinya suatu tabel yang akan dibuat
- tr atau <tr> … </tr> merupakan tag yang berarti membuat sebuah baris, penggunaan tag tr di dalamnya tag table
- td atau <td> … </td> merupakan tag yang berarti membuat sebuah kolom, penggunaan tag td di dalamnya tag tr
- tr atau <th> … </th> merupakan tag yang berarti membuat sebuah kolom, penggunaan tag th di dalamnya tag tr sama dengan td tapi penekannannya pada kolom header/judul
Contoh Susunan tag untuk pembuatan tabel
<table> <tr> <th>kolom Judul1</th> <th>kolom Judul2</th> <th>kolom Judul3</th> </tr> <tr> <td>kolom isi 1</td> <td>kolom isi 2</td> <td>kolom isi 3</td> </tr> </table>
Pemilihan th pada kolom judul bisa juga di ganti dengan td, tapi untuk lebih efisiensinya mending pakai th saja, soalnya kalau data barisnya banyak, misalkan lebih dari 1 halaman jika diperlukan untuk print, otomatis judul akan ikut ke print/cetak pada lembar halaman berikutnya
membuat website toko musik dan toko film
Tidak perlu mahir PHP atau pemrograman untuk membuat webuah website itu, apa lagi sekarang ini banyak CMS (content management system) yang berkeliaran, tinggal klik sini klik sana jadi deh. pada kesempatan kali ini sedikit dibahas bagaimana membuat website toko musik dan juga toko film tanpa harus menguasai bahasa pemrograman (PHP atau ASP). cukup sedikit belajar tag-tag HTML dan sedikit belajar CSS untuk mepercantik website. tentunya nanti website toko musik dan toko film yang anda bangun bisa menghasilkan uang (lumayan buat tambahan uang saku).
Cukup dengan modal email dan domain hosting tentunya, website anda bisa di sulap sebagai website toko musik dan toko film. Dengan memanfaatkan affiliasi (program affiliasi) dari amazon, anda bisa memperoleh komisi dari hasil penjualan. Pastikan anda terdaftar dulu di amazon untuk mendapat id affiliasi trackingnya (punya saya “freetutorifre-20“).
Prinsipnya gini, pertamanya kita cari musik (mp3) dan film yang akan kita jual di widget, trus nanti dari widget itu kita embeed pada website toko musik atau toko film kita. dengan memasukkan javascript seperti dibawah ini
<script type='text/javascript'>
var amzn_wdgt={widget:'MP3Clips'};
amzn_wdgt.tag='freetutorifre-20';
amzn_wdgt.widgetType='SearchAndAdd';
amzn_wdgt.title='My Music Blog';
amzn_wdgt.keywords='Lil Jon - Get Low - Part II';
amzn_wdgt.width='250';
amzn_wdgt.height='250';
amzn_wdgt.shuffleTracks='False';
amzn_wdgt.maxResults='1';
amzn_wdgt.marketPlace='US';
</script>
<script type='text/javascript' src='http://wms.assoc-amazon.com/20070822/US/js/swfobject_1_5.js'>
</script>
kalau pingin lapak daganannya banyak, ya embeed javascriptnya di banyakin juga. untuk affiliasi masing-masing bisa dirubah pada “amzn_wdgt.tag=’freetutorifre-20‘;” dirubah sesuai affiliasinya. mudah bukan
Bagaimana kalau kita sudah terlanjur pake CMS wordpress ? ikuti postingan selanjutnya
Sudahkah anda belajar membuat website toko musik
Membuat focus cursor pada textbox
pernahkah kita menjumpai di internet, ketika kita akan melakukan login atau sedang mendaftar untuk login, ketika kita buka halaman website itu, cursor kita langsung ditempatkan pada field/textbox yang akan kita isi
seperti pada gambar diatas, gambar yang pertama merupakan bentuk dari penempatan cursor pada textbox ketika halaman itu dipanggil, sedangkan pada gambar kedua nampak cursor tidak ada pada textbox. Hal kecil semacam ini membantu para pengguna/user untuk dapat secara fokus mengisi textbox yang disediakan di halaman itu. tertarik untuk mencobanya, silahkan contoh kode dibawah ini (anggep aja sudah menulis sintak html defaultnya)
<form method="post" name="namaform"> <input type="text" name="namatextbox" /> </form>
untuk memberikan setingan focus cursor, bisa ditambahai script (javascript) pada body (tag : body)
<body onload="document.namaform.namatextbox.focus()">
mudah bukan!
selamat belajar membuat website
Inserting the Copyright Symbol in HTML pages
HTML supports special symbols that are not on your keyboard. The special symbol code for the copyright symbol © on HTML is ©. The code is defined by starting with a & (ampersand) and finishing with a ; (semicolon). An example code using the special symbol name would be as follows.
<p> © 2009 website tutorial</p>
However, to ensure that there are no mishaps and you ALWAYS get the proper read from HTML documents, you should try to always use the number code instead of the symbol code. The number is © An example code using the special symbol number would be as follows.
<p> © 2009 website design </p>
membuat aplikasi chat untuk website
satu lagi persembahan dari nettuts, yaitu membuat aplikasi chat sederhana pada website dengan PHP dan jQuery. Sudah termasuk sistem login dan logout. aplikasi yang manis layak untuk dicoba
Requirements: jQuery Framework
Demo: http://net.tutsplus.com/tutorials/javascript-ajax/how-to-create-a-simple…
License: License Free
mari kita mencoba membuat aplikasi chat pada website
Dapatkan Ebook membuat aplikasi chat untuk website dalam bentuk bahasa Indonesia disini
Membuat Tulisan Berjalan
membuat tulisan berjalan dengan menggunakan tag HTML.
<marquee>Membuat tulisan berjalan dengan marquee</marquee>
Tulisan berjalan keatas
<marquee direction="up">Tulisan berjalan keatas</marquee>
mengatur kecepatan tulisan
<marquee scrolldelay="10">mengatur tulisan berjalan</marquee>
tulisan berhenti ketika mouse berada di atas tulisan dan berjalan lagi ketika mouse meninggalkan tulisan
<marquee onMouseOver="this.stop()"; onMouseOut="this.start()";>tulisan berhenti karena mouse</marquee>
** Selamat Belajar Membuat Website **
Membuat status user online yahoo mesengger
Fitur yang paling penting dalam membuat website adalah adanya info tentang pemilik website itu. Misalkan kita membuat website toko online atau membuat website referal atau membuat website iklan baris, informasi status pemilik sangat dibutuhkan. Yang paling umum untuk saat ini adalah menggunakan contact yahoo mesengger. Jadi ketika kita online maka status yang ada di website menunjukkan kalau kita online, begitu sebaliknya.
Cara membuatnya sangat simple, cukup copy dari code berikut ini, tambahkan di website anda dan ganti dengan acount yahoo anda
<a href="ymsgr:sendIM?id_ym_anda"> </a> <a href="ymsgr:sendIM?id_ym_anda" style="color: rgb(71, 54, 36); text-decoration: underline; "> <img border="0" src="http://opi.yahoo.com/online?u=id_ym_anda&m=g&t=1" /></a>
Membuat gambar link
Gambar link kali ini adalah gimana membuat website yang berupa gambar dan text. Ketika gambar dilewati mouse (hover) maka ditempat yang berbeda, text akan menunjukkan keterangan dari gambar tersebut. Atau bisa sebaliknya.
Cara Membuatnya
siapkan dulu folder images untuk menaruh gambar-gambarnya
buat file html dan simpan dengan nama index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Inkubis | Gambar Link</title> <link rel="stylesheet" type="text/css" href="style.css" /> </head> <body> <div id="page-wrap"> <h1>Gambar Link</h1> <div class="people"> <a href="#tian" id="tian"> <span class="name">Putri Titian Asih</span><br /> Putri Titian Asih, biasa dipanggil Tian atau Putri Titian lahir di Palembang, 7 April 1991. <span class="photo"> <img src="images/putri-titian.jpg" alt="Putri Titian Asih" /> </span> </a> <a href="#gutawa" id="gutawa"> <span class="name">Gita Gutawa</span><br /> Aluna Sagita Gutawa atau lebih dikenal dengan Gita Gutawa lahir di Jakarta, 11 Agustus 1993. <span class="photo"> <img src="images/gita-gutawa.jpg" alt="Gita Gutawa" /> </span> </a> </div> </div> </body> </html>
buat lagi untuk css nya dan simpan dengan nama style.css
* { margin: 0; padding: 0; }
body { font: 12px Helvetica, Sans-Serif; }
#page-wrap { width: 600px; margin: 50px auto; }
h1 { font-size: 30px; letter-spacing: -1px; margin: 0 0 20px 0; }
.people { position: relative; }
a { text-decoration: none; color: #222; display: block;
margin: 0 0 0 270px; outline: none; padding: 5px; }
a img { border: 1px solid #FA00EB; }
a:hover { background: #ffefcd; }
a .name { font: 18px Georgia, Serif; }
a:hover .name { color: #9601FF; font-weight: bold; }
a:hover img { border: 3px solid #BD00FB; margin: -4px; }
a .photo { display: block; position: absolute; width: 125px; height: 125px; }
#tian .photo { top: 0; left: 0; }
#gutawa .photo { top: 0; left: 134px; }
#gail .photo { top: 134px; left: 0; }
#padma .photo { top: 134px; left: 134px; }
lihat didalam browser, Mudah Bukan
- Selamat Mencoba -
Teori Membuat Website
Untuk membangun sebuah web page atau membuat website dibutuhkan sebuah bahasa pemrograman yang dikenal dengan sebutan web scripting. Dikatakan script karena perintah kode program tersebut di-interpreter dan tidak ada kompilasi untuk menjadikan file exe (executable). Berdasarkan letak proses interpreter maka web scripting dibagi menjadi dua kategori yaitu :
- Client Side
- Server Side
Client Side dilakukan oleh web browser seperti Internet Explorer, Netscape, Opera, Firefox, Safari dan browser-brewser lainnya. Untuk contoh bahasa client side adalah HTML, CSS, javascript, VBscript, dan xml.
Sedangkan untuk Server Side dilakukan oleh web server seperti PWS (Personal Web Server untuk Sistem Operasi 98), IIS, Apache, Tomcat, Xitami dan JOPE. Untuk Contoh bahasa server side adalah ASP(.Net), PHP, JSP, CFM dan CGI/PL
