Course Content
Introduction to the Web & How Websites Work
This lesson explains what web design is and why it matters. Students learn how the internet works, including the roles of browsers, servers, and websites. It introduces the basic building blocks of a website—HTML for structure, CSS for style, and JavaScript for interactivity—and clarifies the difference between web design and web development. The lesson also highlights essential tools like text editors, browsers, and online resources to get started.
0/3
What is Web Design?
00:00
How the Internet Works
00:00
Introduction to the Web – Basics & Concepts
00:05:00
Getting Started with HTML
HTML (HyperText Markup Language) is the standard language used to create and structure content on the web. It defines the building blocks of every website. What HTML does: HTML is the foundation of every website, giving structure to web pages. It uses tags like <h1>, <p>, and <img> to define content. A basic HTML page has , , , and . The contains metadata (title, styles), while the holds visible content. HTML works together with CSS (design) and JavaScript (functionality).
0/8
Structure of a web page (doctype, html, head, body)
00:00
Headings, paragraphs, and text formatting
00:00
Links and navigation (internal & external links)
00:00
Images, audio, and video embedding
00:00
Lists (ordered & unordered)
00:00
Tables & forms (inputs, buttons, labels)
00:00
Semantic HTML (header, nav, article, footer)
00:00
Mini Project: Build a personal profile page with HTML
00:00
WordPress Basics
In this module, we will explore the foundation of WordPress, the most popular Content Management System (CMS) for building websites. You’ll learn how to set up WordPress, navigate the dashboard, and understand key features such as posts, pages, themes, and plugins. By the end, you’ll be able to manage a WordPress site with confidence and customize it to suit your needs.
0/10
Introduction to WordPress & Dashboard Overview
00:00
Installing WordPress Locally with XAMPP / MAMP
00:00
Posts vs. Pages in WordPress
00:00
Creating and Managing Menus
00:00
Installing and Customizing Themes
00:00
Installing and Using Plugins
00:00
Widgets and Sidebars
00:00
WordPress Media Library (images, videos, documents)
00:00
WordPress Settings & User Management
00:00
Mini Project: Build a Blog Website with WordPress
00:00
Web Design

Installing and Customizing Themes in WordPress

Themes control the design, layout, and style of your WordPress website. By installing and customizing themes, you can make your site look professional and unique.

1. Installing a Theme

Method A: From WordPress Repository

Go to your WordPress Dashboard.

Navigate to Appearance > Themes.

Click Add New.

Browse free themes or use the search bar (e.g., Astra, Neve, OceanWP).

Hover over a theme → Click Install → then Activate.

Method B: Uploading a Theme (.zip)

Download the theme from a marketplace (e.g., ThemeForest, TemplateMonster).

Go to Appearance > Themes > Add New > Upload Theme.

Choose the .zip file → Click Install Now.

After installation, click Activate.

2. Customizing a Theme

Once activated, you can adjust the theme to suit your brand:

Using the Customizer

Navigate to Appearance > Customize.

Options usually include:

Site Identity: Change site title, tagline, and logo.

Colors: Adjust background, header, and link colors.

Typography: Select fonts and sizes.

Menus: Assign and customize navigation menus.

Widgets: Manage sidebar and footer content.

Homepage Settings: Choose between a static homepage or latest posts.

Additional CSS: Add custom styles.

Using Theme Settings (if available)

Some themes (like Astra or Divi) come with extra settings panels.

You can import starter templates for quick setup.

3. Best Practices for Choosing a Theme

Responsive Design → Works well on mobile, tablet, and desktop.

Lightweight & Fast → Avoids slowing down your site.

Customizable → Flexible for branding and layout changes.

Plugin Compatibility → Works with LMS plugins (like Tutor LMS), WooCommerce, etc.

Regular Updates → Ensures security and compatibility.

Examples of Good Themes for Schools/Business

Astra → Lightweight, fast, integrates with Elementor & Tutor LMS.

Neve → Simple, customizable, mobile-friendly.

OceanWP → Feature-rich, works well for e-commerce.

Educenter → Designed specifically for schools and learning platforms.

Divi (Premium) → Drag-and-drop builder, powerful for custom designs.

By installing and customizing themes, you control the look and feel of your website without touching code.

Previous
Next
Scroll to Top