Campus kit User Guide

Learn how to create, manage, and publish your interactive lab reports and projects.

1
Getting Started

Welcome to CampusKit! This platform allows you to create interactive web projects and host PDF documents easily. To start your first project:

  1. Click the New Project button on the top right of the dashboard.
  2. Enter a Project Name and Subject (e.g., Physics, Chemistry).
  3. Choose your project type: Code (HTML/CSS/JS) or PDF.

2
Using the Editor

The code editor is designed for real-time web development. It supports HTML, CSS, and JavaScript with live preview.

Key Features:

  • Tabs: Switch between index.html, style.css, and script.js files.
  • Live Preview: Click the eye icon to see your changes instantly.
  • Mobile View: Toggle between desktop and mobile preview modes.

3
Managing Assets

You can upload images, PDFs, and other files to use in your projects.

Relative Paths

When you upload an asset, you can reference it in your code using a simple relative path:

<!-- HTML example --> <img src="assets/my-image.png" /> /* CSS example */ .background { background-image: url("assets/bg-pattern.png"); }

Note: CampusKit automatically resolves these paths to the correct URL when you preview or publish.

4
Publishing

Once you are happy with your project, click the Deploy button.

Published projects appear on the main dashboard and can be viewed by anyone with the link. You can update your deployed project at any time by saving changes and deploying again.