Configuration
Learn how to configure your TanStarter website
This guide provides a detailed reference for configuring your TanStarter website.
Configuration Structure
The configuration is split into several files in the src/config directory, each responsible for a specific aspect of the website.
Configuration Files
The configuration files are used to define the structure and content of the website.
Website Configuration
Core settings for the website
Navbar Configuration
Configure the navigation menu in the header
Footer Configuration
Set up links and sections in the website footer
Sidebar Configuration
Customize the dashboard sidebar navigation
Avatar Configuration
Configure the user avatar dropdown menu
Social Configuration
Manage social media links and sharing options
Shared Data Types
The configuration uses consistent data types across different menus:
MenuItemConfig
Basic menu item with the following properties:
| Property | Type | Description |
|---|---|---|
title | string | Display text for the menu item |
description | string? | Optional description for dropdown items |
icon | TablerIcon? | Optional icon component from Tabler Icons |
href | string? | Link URL destination |
external | boolean? | Whether the link opens in a new tab |
authorizeOnly | string[]? | User roles that can see this item |
items | MenuItemConfig[]? | Submenu items for dropdowns |
Best Practices
- Use consistent icons from Tabler Icons
- For role-based items, always use the
authorizeOnlyproperty to limit visibility - Use the
Routesobject (insrc/lib/routes.ts) for defining URLs to ensure consistency
Next Steps
Now that you understand the configuration structure, explore these related topics:
TanStarter Docs