LogoShipSaaS
Configuration

Configuration

Learn how to configure the ShipSaaS template

This document provides a detailed reference for configuring the ShipSaaS template.

Configuration Structure

Configurations are separated into several files within the src/config directory, each responsible for configuring specific aspects of the website.

src/config

  • website.ts
  • navbar-config.ts
  • footer-config.ts
  • sidebar-config.ts
  • avatar-config.ts
  • social-config.ts

Configuration Files

Configuration files are used to define the structure and content of the website.

Shared Data Types

Configurations use consistent data types across different menus:

A basic menu item with the following properties:

PropertyTypeDescription
titlestringDisplay text of the menu item
descriptionstring?Optional description for dropdown items
iconTablerIcon?Optional Tabler Icons icon component
hrefstring?Target URL link
externalboolean?Whether the link opens in a new tab
authorizeOnlystring[]?User roles that can see this item
itemsMenuItemConfig[]?Sub-menu items for dropdown menus

Best Practices

  1. Consistently use icons from Tabler Icons to ensure uniformity.
  2. For menu items visible only to specific roles, use the authorizeOnly property to restrict visibility.
  3. Use the Routes object (defined in src/lib/routes.ts) to define commonly used links to ensure consistency.

Next Steps

Now that you understand the configuration structure, explore these related topics:

On this page