Articles by "HTML"
Twitter Facebook

12:22:00 AM ,
Selamat sore gan, ane kali ini akan share tutorial membuat upload file dengan PHP,

Apa itu Upload ?

Upload adalah mengunggah suatu file,gambar,musik,dokumen,dll, kedalah server website atau server virtual.

untuk mengupload file ke website kita,kita harus membuat file upload,oke langsung saja ke pembahasan gan.

yang pertama adalah membuat form upload dengan HTML

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>Upload Belajar PHP Indonesia</title>
</head>
<body>
<form action="" method="post" enctype="multipart/form-data">
 <input type="file" name="img" />
 <button type="submit" name="btn-upload">upload</button>
</form>
</body>
</html>
 dengan penjelasan :
  • method=”POST” : berfungsi untuk menentukan motode pengiriman, apakah POST atau GET
  • enctype=”multipart/form-data” : berfungsi untuk menentukan jenis dokumen yang akan di upload
  • type = “file”: berfungsi untuk memastikan bahwa kita membuat sebuah field untuk browse semua gambar yang ada di komputer.
dan selanjutnya adalah membuat proses upload yang pastinya dengan PHP :

<?php
if(isset($_POST['btn-upload']))
{
 $pic = rand(12345,67890)."-".$_FILES['pic']['name'];
 $pic_loc = $_FILES['pic']['tmp_name'];
 $folder="belajar/";
 if(move_uploaded_file($pic_loc,$folder.$pic))
 {
  echo "<script>alert('Upload Sukses!!!');</script>";
 }
 else
 {
  echo "<script>alert('Upload Gagal');</script>";
 } 
}
?>

dengan penjelasan:
  • $folder : adalah untuk menentukan nama folder tempat gambar akan ditampung dalam contoh diatas file upload akan di simpan di dalam folder "belajar"
  • move_uploaded_files : adalah fungsi PHP untuk mengupload file ke lokasi tertentu.
  • $img : untuk membuat nama file baru yang lebih unik (gabungan angka acak dan nama file).
  • rand() : adalah fungsi PHP untuk mengacak angka, dengan begini maka setiap file yang Anda upload akan memiliki nama file yang unik nantinya.
dan selanjutnya gabungkan kedua script di atas gan :

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>Upload Belajar PHP Indonesia</title>
</head>
<body>
<form action="" method="post" enctype="multipart/form-data">
 <input type="file" name="img" />
 <button type="submit" name="btn-upload">upload</button>
</form>

<?php
if(isset($_POST['btn-upload']))
{
 $pic = rand(12345,67890)."-".$_FILES['pic']['name'];
 $pic_loc = $_FILES['pic']['tmp_name'];
 $folder="belajar/";
 if(move_uploaded_file($pic_loc,$folder.$pic))
 {
  echo "<script>alert('Upload Sukses!!!');</script>";
 }
 else
 {
  echo "<script>alert('Upload Gagal');</script>";
 }
}
?>
</body>
</html>
Twitter Facebook

1:15:00 AM 1 ,
Selamat sore dan balik lagi bersama H admin kece Belajar PHP Indonesia, kali ini ane akan berbagi turotial membuat tampilan atau layout website sederhana dengan HTML dan CSS. oke langsung aja yu ke pembahasan artikel.

pertama yang paling penting untuk layout adalah membuat CSS, sebelum belajar artikel ini kalian harus membaca artikel pembahasan CSS dulu gan, setelah kalian sudah faham dengan pembahasan CSS langsung saja baca artikel ini,
metode yang di gunakan adalah metode <DIV>, seperti halnya website lainnya kita menggunakan class head,body, dan footer

berikut kode css nya simpan dengan nama "style.css" :

body{
    background:black;
    text-align:center;
}
#box{
    width:50%;   
    height:50%px;
    margin:0px auto;
}
#header{
    width:750px;   
    height:100px;
    background:#00D0D0;
}
#body{
    width:750px;   
    height:450px;
    background:#FFFFFF;
    float:left;
}
#left{
    width:200px;   
    height:450px;
    background:#FCA400;
    float:left;
}
#right{
    width:200px;   
    height:450px;
    background:#FCA400;
    float:right;
}
#footer{
    width:750px;   
    height:100px;
    background:#F66C6C;
    float:left;
}

dan berikut kode HTML nya dan simpan dengan nama "index.html" :

<html>
<head>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="box">
    <div id="header">
        <h1>TITLE</h1>
    </div>
    <div id="body">
        <div id="left">
        <h3>SIDEBAR KIRI</h3>
        </div>
<div id="right">
        <h3>SIDEBAR KANAN</h3>
        </div>
        <h1>BODY</h1><br>
contoh artikel
    </div>

    <div id="footer">
        <h1>FOOTER</h1>
    </div>
</div>
</body>
</html>
pada kode di atas saya menggunakan 6 class DIV yang saya beri nama header,box,body,left,right dan footer yang kalian bisa ganti-ganti sesuka selera bila kurang mengerti silahkan baca di artikel CSS.


berikut file yang sudah saya buat beserta tampilan hasil coding tadi

Screenshoot Coding
agan bisa edit sesuai keinginan agan dengan menambahkan javascript,css,html dan lain-lain.
artikel ini hanya artikel html dan css dasar dari ane untuk pembelajaran pemula, semoga bermanfaat.
Twitter Facebook

2:20:00 AM
Selamat sore gan, harusnya ane posting ini tadi pagi gan sehubung dengan kendala dalam internet tadi sempet mati jadi ane lupa dan baru bisa bikin posting sore ini, oke langsung aja materi kali ini tentang dasar HTML yaitu membuat tabel basic dengan HTML tanpa CSS, langsung aja yo ke materi.


kita perlu memahami 3 tag dasar untuk membuat tabel :

TABEL,TR, dan TD.

apa itu TR dan RD?

TR adalah berfungsi untuk membuat baris pada tabel.
TD adalah berfungsi untuk membuat kolom pada tabel.
untuk tabel yang tidak menggunakan border atau default ukuran border itu sendiri adalah 0

langsung saja contoh yang pertama :

<table border=1><tr>     
<td> No</td>
<td>Nama</td>
<td>Kelas</td>
</tr>
<tr>
<td>1</td>
<td>Fikri</td>
<td>XII IPA 3</td>
</tr>
</table>
Hasil dari codingan di atas :
 
untuk membuat tabel dengan CSS silahkan baca artikel selanjutnya 

semoga bermanfaat gan.

MKRdezign

Contact Form

Name

Email *

Message *

Powered by Blogger.
Javascript DisablePlease Enable Javascript To See All Widget