Educate Website - README Introduction Welcome to the "Educate" website! This is a simple education-based website that can be run locally for development and testing purposes. The site includes features like a blog, course categories, and more. Below are the instructions on how to get it up and running on your local machine, as well as some tips for customizing and making changes to the website.

Prerequisites Before you can run the website on your local machine, make sure you have the following installed:

Code Editor: A code editor like VS Code is recommended. Live Server Extension: The Live Server extension for Visual Studio Code (VS Code) is required to easily view your site on your local machine. Getting Started

1. Clone or Download the Repository If you received the project as a ZIP file, extract it to a location on your machine. If you're using Git, clone the repository using the following command: bash Copy code git clone https://github.com/AbdulHaseeb262/HaseebDev
2. Open the Project in VS Code Open the extracted or cloned folder in Visual Studio Code (VS Code). You should see all the necessary files like index.html, blog.html, and style.css inside the folder.
3. Install Live Server Extension To view the website on your local machine, you need to install the Live Server extension in VS Code.

Open VS Code. Go to the Extensions view by clicking the Extensions icon in the Activity Bar on the side of the window. Search for "Live Server" and click Install. 4. Run the Website Locally Once Live Server is installed, open your index.html file in VS Code. Right-click on the index.html file and select Open with Live Server. This will automatically open the website in your browser, usually at http://127.0.0.1:5500/. Customizing the Website If you want to make changes to the website, here's how you can do it:

1. Updating Content Home Page (index.html): You can modify the text, links, and images on the homepage by editing the index.html file. Blog Page (blog.html): To add or edit blog posts, update the content in the
   section inside the blog.html file. Other Pages: The rest of the website, including the "About," "Contact," and "Studying Process" pages, are located in their respective .html files. Modify the content of these files to suit your needs.
2. Changing Styles The website's look and feel are controlled by the style.css file. You can change the layout, colors, fonts, and more by editing the styles in this file. For example, to change the background color of the website, find the body section in style.css: css Copy code body { background-color: #f0f0f0; /_ Change to any color you prefer _/ }
3. Adding New Blog Posts To add a new blog post:

Copy one of the existing

sections in the blog.html file. Modify the image source, title, and content for the new post. Update the Read More link to point to the actual blog post page if necessary. Example of a new blog post section:

html Copy code

Your New Blog Post Title

Your blog post content goes here. Describe the topic and provide valuable insights.

Read More

4. Adding New Pages or Sections To add a new page or section:

Create a new HTML file (e.g., new-page.html). Add content for the new page similar to the structure used in index.html or blog.html. Update the navigation links (e.g., in the navbar) to point to the new page. Example:

html Copy code

New Page

Notes Images: Any images used on the website should be placed in the /images/ directory. Ensure the paths to the images in the HTML are correct. Navigation: If you add new pages or sections, don’t forget to update the navigation links in the header (navbar) for easy access. Responsive Design: This website is designed to be responsive, meaning it will adjust to different screen sizes (desktop, tablet, mobile). Make sure to check the design on different devices. FAQ 1. How do I change the website's title? The title of the website is set in the <title> tag inside the section of each HTML file. You can change it as follows: html Copy code <title>Your New Title</title> 2. How can I change the course categories in the dropdown menu? To change the course categories, modify the

section in the index.html file. For example, change "Web Development" to a new course name: html Copy code
• Your New Course
3. Can I add more blog posts? Yes, you can add more blog posts by following the instructions under the "Adding New Blog Posts" section above. Conclusion With these simple steps, you can run and customize the Educate website on your local machine. Feel free to make any changes as needed to suit your content and branding. If you have any further questions, don't hesitate to reach out!