Skip to main content

Project Gallery

Display your portfolio projects with rich details and custom URLs.

Features

  • Custom URL slugs for SEO-friendly links
  • Image galleries with lightbox
  • Category filtering
  • Featured projects for homepage
  • Rich text descriptions
  • Project details (client, date, tools, etc.)
  • External project links

Admin URLs

PageURL
Project Management/admin/projects
Categories/admin/project-categories

Creating a Project

1

Create Category

Go to /admin/project-categories and add categories (e.g., “Web Development”, “GIS”, “Design”).
2

Add New Project

Go to /admin/projects → Click Add Project
3

Basic Info

  • Title: Project name
  • Category: Select category
  • Description: Short summary
  • Thumbnail: Main project image
4

Gallery

Upload multiple images for the project gallery.
5

Details

Add project details like:
  • Client name
  • Completion date
  • Technologies used
  • Project link
6

URL Settings

  • Custom Slug: URL-friendly identifier
  • Use Project Prefix: Toggle /project/ prefix
    • ON: /project/my-project
    • OFF: /my-project
7

Save

Toggle Featured if desired, then save.

Public URLs

PageURL Pattern
All Projects/projects
Single Project/project/{slug} or /{slug}
By Category/projects?category={name}

Database Schema

projects Collection

{
  title: "GIS Mapping Platform",
  category: "GIS",
  description: "Interactive mapping solution...",
  thumbnailUrl: "https://...",
  galleryUrls: ["https://...", "https://..."],
  fullDescription: "<h2>Overview</h2>...",
  customSlug: "gis-mapping-platform",
  useProjectPrefix: true,
  projectLink: "https://example.com",
  projectDetails: [
    "Client: ABC Corp",
    "Date: 2024",
    "Tech: React, Leaflet"
  ],
  featured: true,
  likes: 0
}
The URL system prevents collisions with:
  • Other projects
  • Blog posts
  • Static pages
  • Shortlinks
When creating a custom slug, the system checks for conflicts and warns you.

Tips

Use descriptive slugs like gis-mapping-platform instead of project-1 for better SEO.
Keep thumbnails at 800×600px for consistent card displays.