cara membuat form pembayaran dengan html

Bagaimana cara membuat form pembayaran dengan html ?. Banyak sekali jenis form pembayaran ini, namun seperti yang kita ketahui, intinya hanya fokus pada siapa yang membayar, apa yang dia bayarkan, jumlah uang yang dibayarkan, dan melalui apa transaksi pembayaran itu dilakukan. untuk membuat form pembayaran, maka kita hanya memerlukan kode tag input, radio, select, dan sebagainya (sesuai kebutuhan).

Untuk contoh pembayaran kali ini, maka kita hanya menggunakan jenis tag masukan menggunakan kode berikut ini

<table> </table>

<input type=”radio”>

<button type=”submit”>

Sekarang mari kita sisipkan dalam kode html, silahkan buka notepad atau text editornya, dan ketikan kode html seperti berikut ini.

<html>
<head>
<title>Contoh cara membuat form pembayaran dengan html</title>
</head>
<body>
contoh form pembayaran seperti berikut<br/>
------------------------------------<br/>
<table border="1" style="font-family:verdana;">
 <th>pembeli</th>
 <th>Barang</th>
 <th>Jumlah Perbarang</th>
 <th>harga barang</th>
 <th>kode pembayaran</th>
 <th>Metode pembayaran</th>
 <th>Total pembayaran
 <tr>
 <td>Ari Prayogi Putra</td>
 <td>Celana Rock N Roll</td>
 <td align="center">2</td>
 <td align="center">800.000</td>
 <td align="center">#U678746</td>
 <td>Piih metode pembayaran :<br/>
 <input type="radio" name="form_bayar" value="pembayaran_tunai">Bayar Tunai<br/>
 <input type="radio" name="form_bayar" value="pembayaran_transfer"> Transfer Bank (BRI, BNI, BCA)<br/>
 <input type="radio" name="form_bayar" value="pembayaran_mart"> Market (Indomart, Alfamart)
 </td>
 <td align="center">
 1.600.000
 </td>
 </tr>
 <tr style="border:0px;margin-top:5px;"><td><button type="submit" style="font-size:20px;padding:5px;">Bayar Sekarang</button></td></tr>
</table>
</body>

</html>

Setelah selesai, silahkan simpan dengan nama form_pembayaran.html, hasilnya kurang lebih akan tampak seperti gambar berikut ini :

sedikit penjelasan kode :
untuk membuat kode pembayaran, yang kita perlu perhatikan adalah data apa yang akan kita muat pada halaman tersebut. umumnya, data yang ditampilkan pada form pembayaran adalah siapa yang membeli, untuk pembelian apa, metode yang akan dibayar, serta total pembayarannya berapa. namun, seperti yang saya bilang, tergantung kebutuhannya, misalnya ingin menambahkan metode kredit, atau mungkin menambahkan kode diskon.

<html> merupakan kode pembukus dari suatu file html, yang akan diakhiri dengan tag </html>.
<head> merupakan tag area kepala yang berfungsi sebagai penampung judul, tag meta, kode CSS, kode JavaScript, Iklan Adsense dan sebagainya. tag ini harus ditutup dengan kode tag </head>.
<title> merupakan tag judul yang akan tampil di bar, di bungkus dengan akhiran </title>
<input> adalah tag masukan, dimana tag ini bisa di isi dengan berbagai atribut masukan, seperti type=”radio”, type=”text”, type= “password”, dan sebagainya, untuk menutup tag ini, kita hanya menggunakan kode tag slash “/” di akhir tag .
<body> merupakan tag yang digunakan untuk menampilkan isi web kepada pengunjung, tag ditutup dengan kode </body>.
<table> merupakan tag untuk membuat tabel, pada tag ini, kita bisa menambahkan tag <th> yang berguna sebagai judul, lalu tag <tr> yang berfungsi sebagai kolom ke samping. pada tag tr ini di isi dengan tag <td>, yang berfungsi untuk menampilkan isi. tag table diakhiri dengan kode </table>.
tadi saya juga menambahkan atribut “style=”, tag ini digunakan untuk memperindah suatu tag. terdapat berbagai banyak isian pada atribut ini seperti untuk merubah jenis text, maka menggunakan isi “font-family=”, untuk mengubah ukuran text maka menggunakan isi “font-size”, dan masih banyak lagi. namun cara ini kurang fleksibel, lebih baik kita menggunakan CSS, lebih mudah dan powerfull.

Related posts:

Leave a Reply Cancel reply