1. Buat database dan tabel nya
CREATE TABLE upload_berkas (
id INT AUTO_INCREMENT PRIMARY KEY,
id_users INT(50),
ijazah VARCHAR(100),
kk VARCHAR(100),
akta VARCHAR(100),
foto VARCHAR(100),
ktp_ayah VARCHAR(100),
ktp_ibu VARCHAR(100),
tanggal_upload TIMESTAMP DEFAULT CURRENT_TIMESTAMP
);
2. buat file dengan nama upload_berkas.php di dalam forder siswa
//contoh css untuk formulir upload_berkas
<style type="text/css">
.container {
width: 450px;
background: white;
margin: 50px auto;
padding: 25px;
border-radius: 10px;
box-shadow: 0 0 10px rgba(0,0,0,0.2);
}
h2 {
text-align: center;
color: #333;
}
label {
font-weight: bold;
}
input[type="file"] {
width: 100%;
padding: 6px;
margin-top: 5px;
margin-bottom: 15px;
}
button {
width: 100%;
background: #007bff;
color: white;
border: none;
padding: 10px;
font-size: 16px;
border-radius: 5px;
cursor: pointer;
}
button:hover {
background: #0056b3;
}
.success {
background: #d4edda;
padding: 15px;
border-radius: 5px;
color: #155724;
margin-top: 15px;
text-align: center;
}
</style>
///contoh formulir standar dari upload_berkas.php
<div class="container">
<h2>Form Upload Berkas PPDB SMK</h2>
<form action="proses_upload.php" method="post" enctype="multipart/form-data">
<label>Ijazah:</label>
<input type="file" name="ijazah" required>
<label>Kartu Keluarga (KK):</label>
<input type="file" name="kk" required>
<label>Akta Lahir:</label>
<input type="file" name="akta" required>
<label>Pas Foto Siswa:</label>
<input type="file" name="foto" required>
<label>KTP Ayah:</label>
<input type="file" name="ktp_ayah" required>
<label>KTP Ibu:</label>
<input type="file" name="ktp_ibu" required>
<button type="submit" name="upload">Upload Berkas</button>
</form>
</div>
CONTOH PADA FILE UPLOAD_BERKAS.PHP
<?php
include"session_start.php";
?>
<!-- https://chatgpt.com/c/6976e6cc-76f0-8323-be8b-f3f50a60f99b -->
<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>SMK DIGITAL</title>
<style>
* {
box-sizing: border-box;
font-family: 'Segoe UI', Tahoma, sans-serif;
}
body {
margin: 0;
background: #f4f6f9;
color: #333;
}
header {
background: linear-gradient(135deg, #0d47a1, #1976d2);
color: white;
padding: 15px 30px;
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
}
.logo-box {
display: flex;
align-items: center;
gap: 10px;
}
.logo {
width: 55px;
height: 55px;
border-radius: 50%;
background: white;
color: #0d47a1;
font-weight: bold;
font-size: 18px;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 0 6px rgba(0,0,0,0.2);
}
nav a {
color: white;
text-decoration: none;
margin: 0 12px;
font-weight: 500;
}
nav a:hover {
text-decoration: underline;
}
.hero {
background: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)),
url("https://images.unsplash.com/photo-1588072432836-e10032774350") center/cover no-repeat;
color: white;
padding: 100px 20px;
text-align: center;
}
.hero h1 {
font-size: 42px;
margin-bottom: 10px;
}
.hero p {
font-size: 18px;
margin-bottom: 25px;
}
.btn {
background: #ffc107;
color: #333;
padding: 12px 22px;
border-radius: 6px;
text-decoration: none;
font-weight: bold;
transition: 0.3s;
}
.btn:hover {
background: #ffb300;
}
section {
padding: 60px 20px;
max-width: 1100px;
margin: auto;
}
section h2 {
text-align: center;
margin-bottom: 40px;
color: #0d47a1;
}
.about p {
text-align: center;
max-width: 800px;
margin: auto;
line-height: 1.7;
}
.cards {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
gap: 20px;
}
.card {
background: white;
padding: 25px;
border-radius: 12px;
box-shadow: 0 4px 10px rgba(0,0,0,0.08);
text-align: center;
transition: 0.3s;
}
.card:hover {
transform: translateY(-5px);
}
.card h3 {
margin-bottom: 10px;
color: #1976d2;
}
.contact {
background: #e3f2fd;
border-radius: 12px;
padding: 40px 20px;
}
.contact p {
text-align: center;
margin: 8px 0;
}
footer {
background: #0d47a1;
color: white;
text-align: center;
padding: 15px;
margin-top: 50px;
font-size: 14px;
}
.container {
width: 450px;
background: white;
margin: 50px auto;
padding: 25px;
border-radius: 10px;
box-shadow: 0 0 10px rgba(0,0,0,0.2);
}
h2 {
text-align: center;
color: #333;
}
label {
font-weight: bold;
}
input[type="file"] {
width: 100%;
padding: 6px;
margin-top: 5px;
margin-bottom: 15px;
}
button {
width: 100%;
background: #007bff;
color: white;
border: none;
padding: 10px;
font-size: 16px;
border-radius: 5px;
cursor: pointer;
}
button:hover {
background: #0056b3;
}
.success {
background: #d4edda;
padding: 15px;
border-radius: 5px;
color: #155724;
margin-top: 15px;
text-align: center;
}
@media (max-width: 600px) {
.hero h1 {
font-size: 32px;
}
nav {
margin-top: 10px;
}
}
</style>
</head>
<body>
<!-- HEADER -->
<header>
<div class="logo-box">
<div class="logo"><img src="../img/logo.png" width="80" height="80"></div>
<div>
<strong>SMK DIGITAL</strong><br>
<small>Sekolah Teknologi Masa Depan</small>
</div>
</div>
<nav>
<a href="#">Beranda</a>
<a href="profil.php">Profil</a>
<a href="upload_berkas.php">Upload berkas</a>
<a href="kontak.php">Kontak</a>
<a href="bantuan.php">Bantuan</a>
<a href="logout.php">keluar</a>
</nav>
</header>
<!-- HERO -->
<section class="hero">
<h1>Selamat Datang di SMK DIGITAL</h1>
<p>Mewujudkan generasi unggul di bidang teknologi dan industri digital</p>
<a href="#profil" class="btn">Lihat Profil Sekolah</a>
</section>
<div class="container">
<h2>Form Upload Berkas PPDB SMK</h2>
<form action="proses_upload.php" method="post" enctype="multipart/form-data">
<label>Ijazah:</label>
<input type="file" name="ijazah" required>
<label>Kartu Keluarga (KK):</label>
<input type="file" name="kk" required>
<label>Akta Lahir:</label>
<input type="file" name="akta" required>
<label>Pas Foto Siswa:</label>
<input type="file" name="foto" required>
<label>KTP Ayah:</label>
<input type="file" name="ktp_ayah" required>
<label>KTP Ibu:</label>
<input type="file" name="ktp_ibu" required>
<button type="submit" name="upload">Upload Berkas</button>
</form>
</div>
<!-- KONTAK -->
<section id="kontak" class="contact">
<h2>Kontak Kami</h2>
<p>📍 Alamat: Jl. Teknologi No. 123, Indonesia</p>
<p>📞 Telp: (021) 12345678</p>
<p>📧 Email: info@smkdigital.sch.id</p>
</section>
<!-- FOOTER -->
<footer>
© 2026 SMK DIGITAL | Website Resmi Sekolah
</footer>
</body>
</html>
3. Buat file baru dengan nama "proses_upload.php" dan buat folder untuk menampung berkas upload dengan nama "file_uploads"
/siswa
│── index.php
│── upload_berkas.php
│── proses_upload.php
│── file_uploads/
file : proses_upload.php
<?php
session_start();
include '../koneksi.php';
if (isset($_POST['upload'])) {
$folder = "file_uploads/";
$allowed_ext = ['jpg', 'jpeg', 'png', 'pdf'];
$id_users = $_SESSION['id_user']; // ambil dari session
function uploadFile($name, $folder, $allowed_ext, $id_users) {
$file = $_FILES[$name];
$ext = strtolower(pathinfo($file['name'], PATHINFO_EXTENSION));
if (!in_array($ext, $allowed_ext)) {
die("Format file tidak diperbolehkan!");
}
// Format nama file: id_users_namafile.ext
$namaBaru = $id_users . "_" . $name . "." . $ext;
move_uploaded_file($file['tmp_name'], $folder . $namaBaru);
return $namaBaru;
}
$ijazah = uploadFile('ijazah', $folder, $allowed_ext, $id_users);
$kk = uploadFile('kk', $folder, $allowed_ext, $id_users);
$akta = uploadFile('akta', $folder, $allowed_ext, $id_users);
$foto = uploadFile('foto', $folder, $allowed_ext, $id_users);
$ktp_ayah = uploadFile('ktp_ayah', $folder, $allowed_ext, $id_users);
$ktp_ibu = uploadFile('ktp_ibu', $folder, $allowed_ext, $id_users);
$query = "INSERT INTO upload_berkas
(id_users, ijazah, kk, akta, foto, ktp_ayah, ktp_ibu)
VALUES ('$id_users', '$ijazah', '$kk', '$akta', '$foto', '$ktp_ayah', '$ktp_ibu')";
mysqli_query($conn, $query);
//echo "<script>alert('Berhasil upload');window.location='upload_berkas.php';</script>";
}
?>
CATATAN PENTING :
Tambahkan $_SESSION['id_user'] = $data['id']; pada bagian penyimpanan session dalam file proses_login.php
if ($cek > 0) {
$_SESSION['username'] = $data['username'];
$_SESSION['role'] = $data['role'];
$_SESSION['id_user'] = $data['id'];
Tidak ada komentar:
Posting Komentar