Quick Start

Get your directory up and running in minutes.

Overview

This tutorial walks you through the essential steps to go from a fresh DirectoryKit installation to a working directory with your own branding.

Make sure you've completed the Installation guide before starting this tutorial.

1. Set your brand

Edit config/site.config.ts:

config/site.config.ts
export const siteConfig = {
  name: "My Directory",
  tagline: "Discover the best tools and resources",
  url: "https://mydirectory.com",
  contact: {
    email: "hello@mydirectory.com",
    support: "support@mydirectory.com",
  },
  social: {
    twitter: "https://twitter.com/mydirectory",
    github: "https://github.com/mydirectory",
  },
}

2. Choose your features

Toggle features in config/features.config.ts:

config/features.config.ts
export const featuresConfig = {
  partners: true,
  badges: true,
  ratings: true,
  comments: true,
  newsletter: true,
  blog: true,
  promotions: true,
  analytics: true,
  ai: false,        // Enable for AI-powered features
  i18n: false,      // Enable for multi-language support
}

3. Set up pricing

Configure your plans in config/plans.config.ts. DirectoryKit comes with a free tier and a paid "Premium" tier.

4. Choose a theme

DirectoryKit includes 14 built-in color themes. Pick one in the admin panel at /admin/theme, or customize colors in config/themes.config.ts.

5. Add categories

Go to /admin/categories to create categories and spheres for your directory. You can also import categories from a CSV file.

6. Deploy

Follow the Deploy in 5 Minutes tutorial to get live on Vercel.