Content Configuration

The .dcs/content.yaml file stores text content overrides managed through the DCS Portal.

Portal-Managed File

This file is automatically updated by the DCS Portal. Manual edits may be overwritten during content synchronization.

Overview

# .dcs/content.yaml
version: 1
lastUpdated: "2025-12-15T10:30:00Z"
updatedBy: user@example.com
global:
  site.tagline: Your custom tagline
pages:
  home:
    hero.title: Welcome to Our Site
    hero.subtitle: Building the future

Schema

Property	Type	Required	Description
version	integer	Yes	Schema version (currently 1)
lastUpdated	string	No	ISO 8601 timestamp of last update
updatedBy	string	No	Email of user who last updated
global	object	No	Global text content shared across pages
pages	object	No	Page-specific text content

Properties

global

Text content shared across all pages. Keys are flat strings that can be referenced anywhere.

global:
  site.tagline: Your business tagline
  site.phone: (555) 123-4567
  footer.copyright: "© 2025 Your Company"

pages

Page-specific text content organized by page slug. Keys within each page correspond to text keys defined in your Vue components.

pages:
  home:
    hero.title: Welcome
    hero.subtitle: Building something great
    features.title: Our Features
  about:
    hero.title: About Us
    mission.description: Our mission statement

Value Types

Content values can be:

Strings

Simple text content:

pages:
  home:
    hero.title: Welcome to Our Site

Arrays

For repeating content blocks:

pages:
  home:
    features:
      - title: Feature One
        description: Description of feature one
      - title: Feature Two
        description: Description of feature two

Objects

For structured content:

pages:
  home:
    cta:
      title: Get Started
      description: Begin your journey today
      buttonText: Sign Up

Text Key Conventions

Naming Pattern

{section}.{element}

Examples

# Page-specific keys
hero.title
hero.subtitle
features.title
features.item1.title

# Global keys (in global section)
site.tagline
site.phone
footer.copyright

Editor Schema

Enable intelligent autocompletion in VS Code by configuring the YAML schema:

{
  "yaml.schemas": {
    "https://schema.duffcloudservices.com/1.0.0/content.json": "/.dcs/content.yaml"
  }
}

Workflow

1. Define text keys in your Vue components using useContent()
2. Discover keys automatically during deployment snapshots
3. Edit content through the DCS Portal text editor
4. Sync changes - Portal commits updates to .dcs/content.yaml
5. Deploy - Content is embedded at build time

Example: Full Configuration

version: 1
lastUpdated: "2025-12-15T10:30:00Z"
updatedBy: editor@company.com

global:
  site.name: Acme Corporation
  site.tagline: Building Tomorrow's Solutions
  site.phone: "(555) 123-4567"
  footer.copyright: "© 2025 Acme Corp. All rights reserved."

pages:
  home:
    hero.title: Welcome to Acme
    hero.subtitle: Innovation meets excellence
    hero.cta: Get Started
    features.title: Why Choose Us
    features:
      - title: Quality First
        description: We never compromise on quality
        icon: shield
      - title: Fast Delivery
        description: Get results in record time
        icon: rocket
      - title: Expert Support
        description: 24/7 dedicated support team
        icon: headphones

  about:
    hero.title: About Acme Corporation
    hero.subtitle: Our story since 1985
    mission.title: Our Mission
    mission.description: |
      To provide innovative solutions that empower 
      businesses to achieve their full potential.
    team.title: Meet Our Team

  contact:
    hero.title: Get in Touch
    form.title: Contact Form
    form.submitButton: Send Message
    address.title: Visit Us
    address.street: 123 Business Ave
    address.city: San Francisco, CA 94102

Related

• Text Editing — Portal text management
• Text Content API — API reference
• pages.yaml — Page definitions with text keys