This tutorial will walk you through advanced configuration options to customize your site for production.

Step 1: Environment Setup

First, set up your environment variables by creating a .env file:

cp .env.example .env

Configure the following variables:

• SITE_URL - Your production domain
• API_KEY - Your API key (if needed)
• ENVIRONMENT - Set to production for production builds

Step 2: Tailwind Configuration

Edit tailwind.config.js to customize your theme:

export default {
  theme: {
    extend: {
      colors: {
        primary: '#your-color',
      }
    }
  }
}

Step 3: Build Optimization

For production builds, enable minification and compression in postcss.config.js.

Step 4: Deployment

Deploy your site to your hosting platform:

• Vercel: Push to GitHub and connect
• Netlify: Point to your repository
• Traditional Hosting: Run npm run build and upload _site/

Step 5: SEO Configuration

Update src/_data/site.yaml with:

• Accurate page titles
• Meta descriptions
• Open Graph tags

This is an example of the help-tutorial layout with a sidebar for navigation.