Web Dev

Creating an Educational Website Using PHP and MySQL

By Razi Digi3 min read

Creating an education-based website using PHP involves several steps and components depending on your goals. Below is a complete guide with structure, essential features, and sample code to help you build a responsive, PHP + MySQL powered educational website for courses, resources, or schools.

Goals for the Educational Website

Let's assume you want a site that includes: course listings, instructor pages, an enrollment form (non-payment), a blog or article section, a contact page, and an admin panel to add courses.

Suggested Folder Structure

/education-site/
├── index.php                 (Homepage)
├── courses.php               (All courses)
├── course.php                (Course details)
├── contact.php               (Contact form)
├── about.php                 (About page)
├── enroll.php                (Enrollment form)
├── admin/
│   └── add_course.php        (Admin course entry)
├── includes/
│   ├── db.php                (DB connection)
│   ├── header.php            (Site header/nav)
│   └── footer.php            (Footer)
├── uploads/                  (Images/files)
├── css/
│   └── style.css             (Custom styles)
└── database.sql              (DB schema)

Step-by-Step Guide

1. Database Setup (database.sql)

CREATE DATABASE education;
USE education;

CREATE TABLE courses (
    id INT AUTO_INCREMENT PRIMARY KEY,
    title VARCHAR(255),
    slug VARCHAR(255) UNIQUE,
    description TEXT,
    instructor VARCHAR(100),
    duration VARCHAR(50),
    image VARCHAR(255),
    created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
);

CREATE TABLE enrollments (
    id INT AUTO_INCREMENT PRIMARY KEY,
    name VARCHAR(100),
    email VARCHAR(100),
    course_id INT,
    created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
);

2. DB Connection (includes/db.php)

<?php
$conn = new mysqli("localhost", "root", "", "education");
if ($conn->connect_error) die("Connection failed: " . $conn->connect_error);
?>

3. Header/Footer (includes/header.php)

<!DOCTYPE html>
<html>
<head>
  <title>EduSite</title>
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-primary">
  <div class="container">
    <a class="navbar-brand" href="index.php">EduSite</a>
    <div class="collapse navbar-collapse">
      <ul class="navbar-nav">
        <li class="nav-item"><a class="nav-link" href="courses.php">Courses</a></li>
        <li class="nav-item"><a class="nav-link" href="about.php">About</a></li>
        <li class="nav-item"><a class="nav-link" href="contact.php">Contact</a></li>
      </ul>
    </div>
  </div>
</nav>

includes/footer.php:

<footer class="bg-dark text-white text-center p-3 mt-4">
  &copy; <?= date("Y") ?> EduSite. All rights reserved.
</footer>
</body>
</html>

4. Homepage (index.php)

<?php include 'includes/db.php'; include 'includes/header.php'; ?>
<div class="container mt-4">
  <h2 class="mb-4">Popular Courses</h2>
  <div class="row">
    <?php
    $result = $conn->query("SELECT * FROM courses LIMIT 3");
    while($course = $result->fetch_assoc()):
    ?>
    <div class="col-md-4">
      <div class="card mb-3">
        <img src="uploads/<?= $course['image'] ?>" class="card-img-top" alt="">
        <div class="card-body">
          <h5><?= $course['title'] ?></h5>
          <p><?= substr($course['description'], 0, 100) ?>...</p>
          <a href="course.php?slug=<?= $course['slug'] ?>" class="btn btn-primary">View Course</a>
        </div>
      </div>
    </div>
    <?php endwhile; ?>
  </div>
</div>
<?php include 'includes/footer.php'; ?>

5. Course Page (course.php)

<?php include 'includes/db.php'; include 'includes/header.php';

$slug = $_GET['slug'];
$stmt = $conn->prepare("SELECT * FROM courses WHERE slug = ?");
$stmt->bind_param("s", $slug);
$stmt->execute();
$result = $stmt->get_result();
$course = $result->fetch_assoc();

if (!$course) { echo "Course not found."; exit; }
?>
<div class="container mt-4">
  <h2><?= $course['title'] ?></h2>
  <img src="uploads/<?= $course['image'] ?>" class="img-fluid mb-3" alt="">
  <p><strong>Instructor:</strong> <?= $course['instructor'] ?></p>
  <p><strong>Duration:</strong> <?= $course['duration'] ?></p>
  <p><?= nl2br($course['description']) ?></p>
  <a href="enroll.php?course=<?= $course['id'] ?>" class="btn btn-success">Enroll Now</a>
</div>
<?php include 'includes/footer.php'; ?>

6. Enrollment Form (enroll.php)

<?php include 'includes/db.php'; include 'includes/header.php';

$course_id = $_GET['course'] ?? 0;

if ($_SERVER['REQUEST_METHOD'] == 'POST') {
  $name = $_POST['name'];
  $email = $_POST['email'];
  $stmt = $conn->prepare("INSERT INTO enrollments (name, email, course_id) VALUES (?, ?, ?)");
  $stmt->bind_param("ssi", $name, $email, $course_id);
  $stmt->execute();
  echo "<div class='alert alert-success'>Enrolled successfully!</div>";
}
?>
<div class="container mt-4">
  <h2>Enroll in Course</h2>
  <form method="post">
    <input type="text" name="name" placeholder="Your Name" class="form-control mb-2" required>
    <input type="email" name="email" placeholder="Your Email" class="form-control mb-2" required>
    <button type="submit" class="btn btn-primary">Submit</button>
  </form>
</div>
<?php include 'includes/footer.php'; ?>

7. Admin Course Entry (admin/add_course.php)

<?php
$conn = new mysqli("localhost", "root", "", "education");
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
  $title = $_POST['title'];
  $slug = strtolower(trim(preg_replace('/[^a-z0-9]+/', '-', $title)));
  $desc = $_POST['description'];
  $instructor = $_POST['instructor'];
  $duration = $_POST['duration'];
  $image = $_FILES['image']['name'];
  move_uploaded_file($_FILES['image']['tmp_name'], "../uploads/$image");
  $stmt = $conn->prepare("INSERT INTO courses (title, slug, description, instructor, duration, image) VALUES (?, ?, ?, ?, ?, ?)");
  $stmt->bind_param("ssssss", $title, $slug, $desc, $instructor, $duration, $image);
  $stmt->execute();
  echo "Course added!";
}
?>
<form method="post" enctype="multipart/form-data">
  <input name="title" placeholder="Course Title"><br>
  <input name="instructor" placeholder="Instructor"><br>
  <input name="duration" placeholder="Duration"><br>
  <textarea name="description" placeholder="Description"></textarea><br>
  <input type="file" name="image"><br>
  <button type="submit">Add Course</button>
</form>

Running the Website in VS Code

Install XAMPP or Laragon (Apache + MySQL). Create a database named "education" in phpMyAdmin and run database.sql. Place all files inside a folder like education-site/ in htdocs or www. Open the folder in VS Code. Visit http://localhost/education-site in your browser.

Optional Features You Can Add Later

User registration and login, video course hosting (YouTube embed, etc.), online quizzes or tests, an admin dashboard, a payment gateway for paid courses (Stripe, PayPal), a newsletter or blog, and certificate generation.

← Back to all articles