insertr/demos

Demo Sites Collection

This directory contains demo sites for testing and showcasing Insertr CMS functionality across different layouts, CSS frameworks, and content types.

Available Demo Sites

default/ - Basic Demo Site

• Simple HTML with explicit class="insertr" markings
• Demonstrates basic text and link editing
• Vanilla CSS styling

simple/ - Minimal Example

• Single page with minimal styling
• Shows container expansion (.insertr on parent elements)
• Good starting point for new implementations

dan-eden-portfolio/ - Real-World Portfolio

• Clean personal portfolio with modern styling
• Uses automatic element discovery (no manual .insertr classes)
• Demonstrates style-aware editing with complex CSS

devigo-web/ - Multi-Page Site

• Multiple HTML files with navigation
• Various content types (headings, paragraphs, buttons, links)
• Tests cross-page content management

Demo Server Usage

Development Testing

# Start demo server with all sites
just dev

# Access sites at:
# http://localhost:8080/sites/default/
# http://localhost:8080/sites/simple/  
# http://localhost:8080/sites/dan-eden-portfolio/
# http://localhost:8080/sites/devigo-web/

Configuration

Each demo site is configured in insertr.yaml:

server:
  sites:
    - site_id: "default"
      source_path: "./demos/default"
      path: "./demos/default_enhanced"
      auto_enhance: true
      discovery:
        enabled: false    # Uses explicit .insertr markings
        
    - site_id: "dan-eden-portfolio"  
      source_path: "./demos/dan-eden-portfolio"
      path: "./demos/dan-eden-portfolio_enhanced"
      auto_enhance: true
      discovery:
        enabled: true     # Auto-discovers editable elements

Testing Features

• Style-Aware Editing: Each site tests different CSS frameworks and styling approaches
• Element Discovery: Compare manual .insertr vs automatic discovery modes
• Content Types: Test text, rich content, links, and multi-property elements
• Authentication: Mock authentication for easy testing without setup

Adding New Demo Sites

1. Create new directory in demos/
2. Add HTML files and assets
3. Configure in insertr.yaml under server.sites
4. Run just dev to test