
Learn the difference between live and local environments, set up a local environment with laragon and a local domain like site.test, and install WordPress locally to build an LMS.
Install the sublime text editor and connect it to laracon to begin developing a WordPress theme by accessing the web content and themes folders.
Learn the minimum requirements to create a WordPress theme recognizable by WordPress, including adding a theme folder, index.php, and style.css with a proper header, screenshot, and activation steps.
Create and load the front page of your WordPress theme by adding front-page.php, saving HTML content, including a title and paragraph, and then refresh to view the loaded page.
Load the header and footer with get_header and get_footer in WordPress, creating header.php and footer.php templates that include logo, navigation, and a sign up button on the front page.
Learn to load CSS in a WordPress theme by registering and enqueuing styles, targeting text with a class, and adjusting color and font size while troubleshooting path issues.
Register a custom post type named courses in WordPress, using the code example and init hook; tailor labels and supports to include title, editor, excerpt, and thumbnail.
Add custom fields to a WordPress course post type, including subtitle, trailer, price, skills, curriculum, and instructor details, using an add meta box in the admin dashboard.
Master how to access and configure a local database using phpMyAdmin on localhost, install phpMyAdmin, set the root password, and view or create tables for your plugin data.
Create a WordPress database table to store course details, including subtitle and trailer URL, and implement db delta during theme activation.
Create a save data function to store subtitle and trailer in the course_details table using the post id as the course id, triggered on publish or update via save_post.
Retrieve data from the WordPress database using the course ID to display subtitle and trailer by querying the database and echoing the results.
Build a dynamic add/remove skills system using JavaScript and jQuery for custom fields. Create input fields with add and remove skill controls that append to a course skills container.
Learn to save and retrieve skills as a post meta array in WordPress, updating via the update post meta function and displaying with a for-each loop.
Build a WordPress course curriculum feature by adding and removing lectures with title, URL, and duration using custom fields and jQuery.
Save lecture data by naming inputs as lecture title, URL, and duration, and store them in arrays in post meta via the save function.
Retrieve lecture data from the database, extract post meta into arrays, and render titles, urls, and durations with a foreach loop; enable updating and removing lectures.
Style WordPress custom fields with CSS by wrapping content in cf-all and cf-unit divs, applying background colors, widths, centered text, borders, radii, and typography to create polished, responsive fields.
Design a responsive top navigation bar in HTML with an icon, site name, a link list (home, courses, contact us), and a sign-up call-to-action, then style with css.
Learn to load icons in your design with Font Awesome by copying an icon, importing the CDN into CSS, and refreshing to render the loaded icon.
Learn how to transform a header into a horizontal navigation bar using CSS flex, remove list dots, style links as buttons, and fine-tune spacing, colors, and alignment.
Make the navigation bar responsive by using a media query at max width 1200 pixels to switch to a column layout, center items, and hide the nav ul.
Apply Google fonts to your WordPress theme headlines by importing fonts like a bell and Anton, updating CSS with font-family rules for the headline and nav, and consolidating into style.css.
Design and load a WordPress course page by creating a single-course template, saving it as single-course.php, and previewing it after publishing a new course in wp-admin.
Design a WordPress course page with a two-column layout: left panel for title, subtitle, ratings, and enroll buttons, right panel for a video trailer; implement styling and responsiveness.
Create a what you will learn skills list on the course page, with check icons, centered layout, font size adjustments, and responsive styling for the WordPress course.
Design the course curriculum section by adding a course content header, a list of lectures (Introduction to WordPress, Setting up your WordPress websites), and icons with responsive flex layouts.
Design a courses page section that showcases student ratings and feedback with a styled rating tile, including the student name, image, rating stars, feedback text, and submission time.
Create the meet your instructor section on the single course page, placing the image left and text right with a responsive flex layout. Next lecture adds the footer.
Design the theme footer in a WordPress project by building a three-section footer (logo with icon, links column, and bottom line with a dynamic year) using flex, typography, and colors.
Load the footer on the courses page with the get_footer function and place it beneath the content. Move the CSS into the course page CSS for consistent styling.
Remove the WordPress admin bar by adding a show_admin_bar function set to false in functions.php, ensuring the top white bar disappears from templates.
Make the course page dynamic by retrieving the title, subtitle, and trailer from the database and displaying them on the course view.
demonstrates how to add, save, and display course skills on a dynamic WordPress course page by using post meta, foreach loops, echoing skills with icons in a list.
Make the course page dynamic by loading lectures, titles, URLs, and durations from the curriculum using PHP, printing them in a loop, and preparing a dynamic ratings system.
Design a dynamic WordPress course content page with a two-panel layout: a left curriculum loaded from the database and a right video player, plus top navigation for lectures.
This lecture demonstrates making the course content page responsive with a 1200 px max width, media screen adjustments, flex direction changes, video and lectures reordering, and 480 px height.
Learn to make a WordPress course content page dynamic by loading lectures, replacing static titles with a retrieved curriculum, and turning the course title and permalink into dynamic, clickable elements.
Develop a dynamic course content page in WordPress by echoing lecture URLs from an array and updating the video iframe src via JavaScript when a lecture is clicked.
Create and assign custom login and registration templates in a WordPress theme, publish the login and register pages, and prepare to automate their creation with functions.php.
Automatically create login and registration pages on theme activation. Check existence, build page arguments, publish, and assign templates with wp_insert_post and the after_switch_theme hook.
Create a WordPress registration page to let students sign up, featuring username, email, and password fields with a post method and WordPress create_user handling, including success and error messages.
Apply security measures to the WordPress registration process by sanitizing usernames and emails with sanitize_user and sanitize_email, and ensure server-side form submission via post.
Log in new WordPress users after registration by using the create user function with username, password, and email, then sign in via the sign-on function with remember-me.
Learn to redirect users to any page, including the dashboard or admin, by implementing a correct login check and dynamic URL routing in WordPress.
Explore loading a registration page design with ready-to-use HTML and CSS, download the file, and paste it into your register template to apply the same design.
Create a custom login page with WordPress login form, redirect users after login to the dashboard using is_user_logged_in and home_url, and conditionally load the header and footer.
Design a polished login page by wrapping the form in a login-form-container div, moving elements accordingly, and applying the login page CSS copied from resources.
Learn to customize the top navigation in a WordPress header by showing the logged in user, replacing sign up with login/out links, and adding icons and a username display.
Create a student dashboard template page in a WordPress theme, register a dashboard page, and auto-create it on theme activation so enrolled students can view progress, courses, and ratings.
Design a WordPress dashboard page using HTML and CSS, displaying user name, courses, progress, rating, and action buttons for overview and resume.
Learn to build a responsive dashboard by expanding the course card container to 100 percent on smaller devices, adjust margins, and implement media queries to display multiple courses cleanly.
Learn to manage student enrollments in a WordPress course by showing continue learning or enroll now based on login and enrollment status, and set up an enrollments table.
Learn to execute a PHP function on a button click in WordPress, saving course ID, username, email, and enrollment date to the database via the WordPress insert function.
Display a continue learning button for enrolled students and an enroll button for non-enrolled users by querying WordPress database with PHP conditionals.
Enforce access control on the WordPress course content page by checking the user's enrolled status and redirect non-enrolled or unauthenticated users to the login or home page.
Learn how to secure a WordPress dashboard for logged-in students, fetch their enrolled courses from the enrollment table, and display dynamic course cards with titles and links.
Enable and display course thumbnails by adding theme support for post thumbnails in the custom post type, then retrieve the thumbnail URL with get_post_thumbnail_url and show it in the dashboard.
Build an archive page for the courses custom post type, display all created courses by retrieving ids from the course details, and apply a refreshed dashboard design.
Build a dynamic course rating feature on the dashboard, with per-course rating buttons and a form to submit the rating, updating the WordPress database by course ID and student username.
Learn to include external files in PHP using the include function with get_template_directory to load a template file into the dashboard.
Display rating submission message in WordPress dashboard by validating the rating and echoing a confirmation. Check for errors using the WordPress database variable and show your rating is submitted successfully.
Calculate the course average rating by aggregating all student ratings from the WordPress database for the course ID, then divide the sum by the count and round to two decimals.
Create a pop up rating feature activated by a 'rate this course' button, loading the real student rating from the database with a styled JavaScript and CSS popup.
Add a close button to the rating popup and wire an event listener to close it by setting its display to none, using the close rating popup ID.
Improve the rating popup by adding padding around the content, shrinking the close button, applying a 10px border radius, centering elements, and renaming the submit button to give your rating.
Display student rating stars by calculating full and empty stars from the rating number using floor, looping to render stars on the course page and dashboard course cards.
Build a WordPress learning management system theme from setup to templates, post types, and custom fields, including enrollment and rating systems. Practice with the provided project files to compare progress.
Build a Learning Management System Theme LMS - to Manage Courses Like Udemy
In this course, the theme that we're going to be building is an LMS theme that helps us create & list courses on our website, just like this website Udemy
The process of building this theme will help you learn everything you need to Build Premium WordPress themes
Create CUSTOM POST TYPE - You will learn how to Create Custom Post Types in your WordPress Dashboard
You will have you own custom CPT here
You can name it anything you want, also you can change it's icon
Add CUSTOM FIELDS - You will learn how to Add Custom Fields (Without the need for External Plugins)
Learn how to customize Custom Fields with CSS to fit your design
In our Case we will add the course details like trailer video, the course price and it's content
After that we will learn how to save all these details in the database so that we can retrieve them later on in our course page
DATABASE - You will learn how to create database tables
This table will be created automatically once our plugin is activated
Second You will learn about Database:
How to Insert Data, Save it, Update it & Retrieve it from Any Database Table: Your plugin will be doing this for you automatically in the background
WEB DESIGN
You will learn how to Design Awesome Templates associated with your CPT using Html & CSS
You will learn how to Dynamically Load Your Courses Details from the custom fields that we built, Each course page will have it's own price, video trailer, content. And everything will be controlled from the WordPress Dashboard. You can make changes here and you'll see them in front-end.
This is the Power of using Themes in WordPress. It allows us to manage our content easily from the Dashboard
Also Keep in mind that this LMS Theme that you're going to be building is just one example. With this knowledge in this course you can build different plugins that serve different purposes - Selling T-shirts
So If you are interested in learning WordPress development by Building this LMS Theme, join me and let's get down to it