Multimedia
▼
▼
jum,at 01 maret 2019
TUTORIAL MEMBUAT TOKO ONLINE SEDERHANA PADA NOTEPAD
Kali ini saya akan membuat toko online sederhana dari notepad. Pada tutorial kali ini saya membuat toko online Gerabah Bayat. Jika anda ingin membuat produk yang berbeda anda dapat menyesuaikan sendiri.
1. Silahkan ketikkan atau copy paste script berikut untuk membuat halan home, kemudian simpan dengan nana index.html.
<html>
<head>
<title>MembuatTabel</title>
</head>
<body>
<table width="1024" border"1" align="center">
<tr>
<td colspan="4"><img src="HEADER1.gif"></td>
</tr>
<tr height="50">
<td width="256" bgcolor="black"><a href="index.html"><img src="beranda.jpg"></a></td>
<td width="256" bgcolor="black"><a href="profil.html"><img src="profil.jpg"></a></td>
<td width="256" bgcolor="black"><a href="produk.html"><img src="produk.jpg"></a></td>
<td width="256" bgcolor="black"><a href="kontak.html"><img src="kontak.jpg"></a></td>
</tr>
<tr height="400">
<td width="150" background="b.jpg"><font size="+1" face="sans-serif" color="white">Artikel Terkait</font><br><br>
<table>
<tr height="550">
<a href="pengertian.html">Apa itu gerabah ?</a><br>
<a href="proses.html">Proses pembuatan gerabah</a><br><br><br><br><br>
<br>
<br>
</tr>
<tr height="350"><td><tr><td>
</table>
</td>
<td colspan="2" width="699" bgcolor="black"><font size="+3" face="Comic Sans MS" color="white" ></font>
<table width="600" height="150" border="0" vertical-align="top">
<tr height="150" vertical-align="top">
<td colspan="4"><font size="+3" face="Comic Sans MS" color="white" ><marquee> SELAMAT DATANG DI WEBSITE KAMI </marquee></td>
</tr>
<tr height="150" vertical-align="top">
<center><td colspan="4"><font size="+3" face="Comic Sans MS" color="white"><img src="slide.gif" width="625"></td>
</tr>
<tr>
<td><img src="black.jpg"></td>
<td><img src="black.jpg"></td>
<td><img src="black.jpg"></td>
<td><img src="black.jpg"></td>
</tr>
<tr>
<td><img src="black.jpg"></td>
<td><img src="black.jpg"></td>
<td><img src="black.jpg"></td>
<td><img src="black.jpg"></td>
</tr>
<tr>
<td><img src="black.jpg"></td>
<td><img src="black.jpg"></td>
<td><img src="black.jpg"></td>
<td><img src="black.jpg"></td>
</tr>
<tr>
<td><img src="black.jpg"></td>
<td><img src="black.jpg"></td>
<td><img src="black.jpg"></td>
<td><img src="black.jpg"></td>
</tr>
<tr>
<td><img src="black.jpg"></td>
<td><img src="black.jpg"></td>
<td><img src="black.jpg"></td>
<td><img src="black.jpg"></td>
</tr>
</table>
</td>
<td width="163" background="b.jpg" width="300" >
<table>
<tr height="650">
<center><br><br><br><br><img src="iklan1.gif" height="200" width="145">
</tr>
<tr height="350"><td><tr><td>
</table>
</td>
<tr><td colspan="4"><center>Copyright 2014</center></td></tr>
</table>
</body>
</html>
Jadi inilah hasilnya :
2. Silahkan ketikkan atau copy paste script berikut untuk membuat halaman profile, kemudian simpan dengan nama profile.html.
Jadi inilah hasilnya :
<html>
<head>
<title>MembuatTabel</title>
</head>
<body>
<table width="1024" border"1" align="center">
<tr>
<td colspan="4"><img src="HEADER1.gif"></td>
</tr>
<tr height="50">
<td width="256" bgcolor="black"><a href="index.html"><img src="beranda.jpg"></a></td>
<td width="256" bgcolor="black"><a href="profil.html"><img src="profil.jpg"></a></td>
<td width="256" bgcolor="black"><a href="produk.html"><img src="produk.jpg"></a></td>
<td width="256" bgcolor="black"><a href="kontak.html"><img src="kontak.jpg"></a></td>
</tr>
<tr height="400">
<td width="150" background="b.jpg"><font size="+1" face="sans-serif" color="white">Artikel Terkait</font><br><br>
<table>
<tr height="1250">
<a href="pengertian.html">Apa itu gerabah ?</a><br>
<a href="proses.html">Proses pembuatan gerabah</a><br>
<br>
<br>
</tr>
<tr height="350"><td><tr><td>
</table>
</td>
<td colspan="2" width="699" background="b.jpg"><font size="+3" face="Comic Sans MS" color="white" ><br><marquee>PROFIL KAMI</marquee></font><br><br>
<table width="600" height="150" border="0" vertical-align="top">
<tr height="150" vertical-align="top"><center>
<td colspan="4"><font size="+3" face="Comic Sans MS" color="white" align="center" ><center><br/>
Usaha Kriya kami didirikan sejak tahun 1985, dan diwariskan secara turun temurun.
Kini usaha kami dipegang oleh Muchti Aji M.
Bahan utama pembuatan hasil karya kriya kami adalah 70% tanah liat asli Bayat dan 30% tanah liat dari Pekalongan.
Gerabah-gerabah kami sudah beredar dibeberapa kota-kota besar di Indonesia,
seperti Surabaya, Semarang, Bogor, dan Bandung. Tak jarang pula Wisatawan Manca negara yang berwisata ke Bayat
membeli oleh-oleh gerabah dari produk kami. Agar Hasil produk tidak terlihat monoton, kami sering melakukan Inovasi-inovasi baru
dalam bentuk Gerabah yang akan dibuat.<br/><br/>
<img src="DSC_0721.jpg" width="400" height="270"><br><br>
Nama Saya Muchti Aji Masykuri<br>
Lahir di Klaten, 23 Agustus 1997<br>
Sekolah di SMK NEGERI 1 KLATEN<br>
Dengan kompetensi keahlian Multimedia <br>
Alamat di Ngirosaran, Kalitengah,<br>
Wedi, Klaten, Jawa Tengah<br>
Hobby adalah menggambar<br>
Dan cita-cita Animator atau Arsitektur<br><br>
" Without dreams, you reach nothing. <br>
Without love, you feel nothing, <br>
and without God you are nothing "<br><br>
</td>
</tr>
</table>
</td>
<td width="163" background="b.jpg" width="300" >
<table>
<tr height="1250">
<center><br><br><br><br><img src="iklan1.gif" height="200" width="145">
</tr>
<tr height="350"><td><tr><td>
</table>
</td>
<tr><td colspan="4"><center>Copyright 2014</center></td></tr>
</table>
</body>
</html>
3. Silahkan ketikkan atau copy paste script berikut untuk membuat halaman produk, kemudian simpan dengan nama produk.html.
Jadi inilah hasilnya :
<html>
<head>
<title>MembuatTabel</title>
</head>
<body>
<table width="1024" border"1" align="center">
<tr>
<td colspan="4"><img src="HEADER1.gif"></td>
</tr>
<tr height="50">
<td width="256" bgcolor="black"><a href="index.html"><img src="beranda.jpg"></a></td>
<td width="256" bgcolor="black"><a href="profil.html"><img src="profil.jpg"></a></td>
<td width="256" bgcolor="black"><a href="produk.html"><img src="produk.jpg"></a></td>
<td width="256" bgcolor="black"><a href="kontak.html"><img src="kontak.jpg"></a></td>
</tr>
<tr height="400">
<td width="150" background="b.jpg"><font size="+1" face="sans-serif" color="white">Artikel Terkait</font><br><br>
<table>
<tr height="1750">
<a href="pengertian.html">Apa itu gerabah ?</a><br>
<a href="proses.html">Proses pembuatan gerabah</a><br>
<br>
<br>
</tr>
<tr height="350"><td><tr><td>
</table>
</td>
<td colspan="2" width="699" background="b.jpg"><font size="+3" face="Comic Sans MS" color="white" ></font>
<table width="600" height="150" border="0" align="center" vertical-align="top">
<tr height="150" vertical-align="top">
<td colspan="2"><font size="+3" face="Comic Sans MS" color="white" ><marquee> PRODUK GERABAH BAYAT, ASLI INDONESIA </marquee></td>
</tr></table><br>
<table width="600" height="300" border="1" align="center" >
<tr>
<td><img src="guci1.jpg" width="300" height="300"></td>
<td><img src="guci2.jpg" width="300" height="300"></td>
</tr>
<tr>
<td><img src="guci3.jpg" width="300" height="300"></td>
<td><img src="guci4.jpg" width="300" height="300"></td>
</tr>
<tr>
<td><img src="guci5.jpg" width="300" height="300"></td>
<td><img src="guci6.jpg" width="300" height="300"></td>
</tr>
<tr>
<td><img src="panci1.jpg" width="300" height="300"></td>
<td><img src="panci2.jpg" width="300" height="300"></td>
</tr>
<tr>
<td><img src="piring1.jpg" width="300" height="300"></td>
<td><img src="piring2.jpg" width="300" height="300"></td>
</tr>
</table>
<table width="600" height="300" border="0" align="center" >
<tr>
<td><img src="black.jpg" width="300" height="300"></td>
<td><a href="produk1.html">Selanjutnya >></a></td>
</tr>
</table><br>
<table width="600" height="300" border="0" align="center" >
<tr>
<td><img src="black.jpg" width="300" height="300"></td>
<td><img src="black.jpg" width="300" height="300"></a></td>
</tr>
</table><br>
</td>
<td width="163" background="b.jpg" width="300" >
<table>
<tr height="1750">
<center><br><br><br><br><img src="iklan1.gif" height="200" width="145">
</tr>
<tr height="350"><td><tr><td>
</table>
</td>
<tr><td colspan="4"><center>Copyright 2014</center></td></tr>
</table>
</body>
</html>
4. Silahkan ketikkan atau copy paste script berikut untuk membuat halaman kontak, kemudian simpan dengan nama kontak.html.
Jadi inilah hasilnya :
<html>
<head>
<title>MembuatTabel</title>
</head>
<body>
<table width="1024" border"1" align="center">
<tr>
<td colspan="4"><img src="HEADER1.gif"></td>
</tr>
<tr height="50">
<td width="256" bgcolor="black"><a href="index.html"><img src="beranda.jpg"></a></td>
<td width="256" bgcolor="black"><a href="profil.html"><img src="profil.jpg"></a></td>
<td width="256" bgcolor="black"><a href="produk.html"><img src="produk.jpg"></a></td>
<td width="256" bgcolor="black"><a href="kontak.html"><img src="kontak.jpg"></a></td>
</tr>
<tr height="400">
<td width="150" background="b.jpg"><font size="+1" face="sans-serif" color="white">Artikel Terkait</font><br><br>
<table>
<tr height="500">
<a href="pengertian.html">Apa itu gerabah ?</a><br>
<a href="proses.html">Proses pembuatan gerabah</a><br>
<br>
<br>
</tr>
<tr height="350"><td><tr><td>
</table>
</td>
<td colspan="2" width="699" background="b.jpg"><font size="+3" face="Comic Sans MS" color="white" ><marquee>KONTAK KAMI</marquee></font><br><br>
<table width="600" height="150" border="0" vertical-align="top">
<tr height="150" vertical-align="top"><center>
<td colspan="4"><font size="+3" face="Comic Sans MS" color="white" align="center" ><center>
<img src="gerabah-bayat.jpg" width="400" height="270"><br><br>
Alamat : Pagerjurang, Melikan, Wedi, Klaten, Jawa Tengah<br>
E-mail : Muchti.Aji66@yahoo.co.id<br>
Muchtiaji@gmail.com<br>
Facebook : Muchti<br>
Twitter : @Muchti_AA<br>
Instagram : @Muchti_AA<br>
Path : Muchti A.<br>
HP. 085 647 137 955<br>
Pin BB : 7E74ADE3<br>
<br>
<br>
<br>
</td>
</tr>
</table>
</td>
<td width="163" background="b.jpg" width="300" >
<table>
<tr height="500">
<center><br><br><br><br><img src="iklan1.gif" height="200" width="145">
</tr>
<tr height="350"><td><tr><td>
</table>
</td>
<tr><td colspan="4"><center>Copyright 2014</center></td></tr>
</table>
</body>
</html>
Tidak ada komentar:
Posting Komentar