Install

# Configuration

Customize your SvelteShip app with the centralized site configuration

SvelteShip uses a centralized configuration file to manage your app's branding, contact information, social links, and theme settings. This makes it easy to customize your app in one place.

# Location

The configuration file is located at:

        /src/lib/config.ts

      

# Configuration Options

Here's the complete configuration structure:

        export const siteConfig = {
  name: "SvelteShip",
  tagline: "Ship your SvelteKit App, Set Sail!",
  url: "https://svelteship.com",
  docsUrl: "https://docs.svelteship.com",

  contact: {
    supportEmail: "[email protected]",
  },

  social: {
    twitter: "https://twitter.com/your_handle",
    productHunt: "https://www.producthunt.com/products/your-product/reviews",
  },

  theme: {
    default: "svelteship",
    available: ["svelteship", "light", "dark", "bumblebee", "corporate"],
  },

  legal: {
    lastUpdated: "2025-02-14",
    contactEmail: "[email protected]",
  },
}

      

# Field Reference

# Where It's Used

The config is imported throughout the app:

• Navbar - Displays the app name
• Footer - Shows brand name, support email, and social links
• Hero/Landing - Uses tagline for the main heading
• Legal Pages - Privacy Policy and Terms of Service use legal settings
• Theme Switcher - Uses available themes array
• SEO/Meta Tags - Page titles and descriptions

# Adding New Themes

SvelteShip uses DaisyUI for theming. To add more themes:

1. Update the config

   Add the theme name to the available array:

           theme: {
     default: "svelteship",
     available: ["svelteship", "light", "dark", "bumblebee", "corporate", "cupcake"],
   },
   
         

2. Enable in Tailwind config

   Make sure the theme is listed in your tailwind.config.js:

           daisyui: {
     themes: ["svelteship", "light", "dark", "bumblebee", "corporate", "cupcake"],
   }