Membuat Online Shop Sederhana Menggunakan HTML

Hallo Blogger, kali ini a369i-Tips akan memberikan tutorial HTML cara membuat Online Shop sederhana menggunakan Notepad. Dibawah ini adalah hasil dari HTML yang aku buat untuk tugas sekolah menggunakan Notepad yah anak-anak jurusan multimedia harusnya tau lah atau mungkin sedang nyari-nyari artikel ini buat referensi tugas juga lumayan nih.

 

loading...

Langsung saja ikuti langkah-langkah berikut atau anda bisa memberi kreasi anda sendiri :

1. Buka Notepad (pertama dan utama) disini saya menggunakan Notepad++ 

2. Jika menggunakan Notepad++, save as (Ctrl+Shift+S) terlebih dahulu agar format menjadi HTML

 untuk nama terserah anda yang penting type HTML

 3. Kemudian tulis script dasar dari HTML seperti ini :

4. Lalu masukan Script untuk membuat tabel 

6. Buatlah header menggunakan Photoshop/Corel Draw dengan Ukuran 1024x125 (1024 x variasi) beri nama header.png simpan sefolder dengan HTML tadi. kemudian menjadi seperti ini :

7. Kemudian kita akan membuat tabel 3x2 untuk memasang produk kita.

8. Kemudian buat gambar produk dengan ukuran 273x273 sebanyak 6 buah (karna kita hanya membuat table 3x2) sesuaikan nama dengan nama yang berda diHTML, Taruh seFolder dengan HTML tadi. 

9. Kemudian Lakukan variasi untuk warna Tabel dan Background Web-nya.

10. Untuk menyesuaikan letak "menu" ganti angka pada kotak merah.

11. Selanjutnya tinggal membuat HTML tentang "profil, Produk, Hubungi Kami"

12. Jadilah Sebuah Online Shop sederhana menggunakan Notepad HTML.

Untuk membuat Judul Berjalan Gunakan Script Berikut

Untuk membuat tabel seperti ini

Gunakan Script ini :

<table style="background: Black; color:white; padding: 10px 20px 30px 25px; text-align: center; font-family: comic sans ms; font-size: 18px; width: 1024px; border: 4px outset #3d85c6; border-radius:15px; -moz-box-shadow: 0px 0px 5px 4px #6fa8dc; -webkit-box-shadow: 0px 0px 5px 4px #6fa8dc; box-shadow: 0px 0px 5px 4px #6fa8dc" height="125" width="1024" bgcolor="black" border="1" align="center">

Berikut adalah hasil Online Shop yang telah kita buat dari tutorial diatas :

Jika ada pertanyaan
Bisa kirim email rizqyfadholi@gmail.com
Via Twitter
Via Facebook

loading...