Digital Garden Setup

How my Obsidian vault publishes to my public Digital Garden (its-me-cindy.com)

This note documents the full setup of my Digital Garden — the architecture, folder structure, publishing pipeline, customization, and the unexpected quirks I had to solve along the way. Future me (and anyone else curious about how this works) can reference this to understand or update the system.

🌱 Purpose

I publish my notes publicly as a way to think out loud, develop clarity, and share what I’m learning. This garden isn’t a polished blog — it’s a living notebook that grows as I grow. My goal is to keep writing friction low while maintaining a clean, navigable site.

This setup lets me:

• Keep my preferred Obsidian folder organization (with numeric prefixes for sorting)
• Publish seamlessly to a GitHub → Vercel pipeline
• Customize the sidebar/filetree so the public site displays clean, human-readable titles
• Iterate on the system over time without breaking it

📁 Vault Structure

My top-level structure in Obsidian looks like:

00_Start-Here
10_Systems-Lab
20_Learning-Log
30_Canon
40_About
99_Playground

The numbers keep everything ordered in Obsidian but are hidden on the published site.

This note lives here:

10_Systems-Lab / Digital Garden Setup.md

because it’s part of my publishing system architecture.

🚀 Publishing Pipeline (How Notes Go Live)

My setup follows this flow:

1. Write or update notes in Obsidian

2. Digital Garden plugin pushes selected notes to GitHub

3. GitHub repository stores the built site files

4. Vercel automatically deploys every commit to production

5. The site updates at its-me-cindy.com

No manual deployment needed.

🧱 Sidebar Filetree Customization

The default Digital Garden template exposes folder names exactly as they appear in Obsidian — including:

• numeric prefixes (00_, 10_)

• .md extensions

• hyphens and underscores

I updated the template to clean these names so the public version is simple and readable.

Where the customization lives

I edited the component:

src/site/_includes/components/filetree.njk

This file controls how folder and note names are rendered in the sidebar.

The cleaning logic

Here’s the exact code that removes prefixes, extensions, and formatting characters:

{% set cleanedName = fileOrFolderName
    | replace('00-','')
    | replace('00_','')
    | replace('10_','')
    | replace('20_','')
    | replace('30_','')
    | replace('40_','')
    | replace('.md','')
    | replace('-', ' ')
%}

This removes:

• 00_, 00-, 10_, 20_, etc. → hides sorting prefixes

• .md → hides file extensions

• - → converts hyphens to spaces for readability

Why both 00_ and 00-?

Digital Garden sometimes rewrites underscores as dashes internally.
Both forms need to be removed for the sidebar to stay consistent.

🎨 Visual Style Notes

(These will expand later.)

• Using a community theme selected in the Digital Garden plugin

• Accent color customized via the garden settings

• Future: adjust margins, spacing, folder icons, and typography in custom CSS

⚠️ Quirks + Lessons Learned

A few things worth remembering:

• Digital Garden normalizes some folder names (particularly ones starting with 00_)
• The filetree receives different string formats depending on whether the item is a folder or a note
• Prefix removal needs to be flexible — multiple patterns must be cleaned
• Deploys can take ~5–15 seconds; always hard refresh before assuming something is broken
• Document your setup as you go — clarity compounds

🛠 Future Improvements

• Add emoji or icon support per folder
• Build a “Now” page or landing page
• Customize the theme with polished CSS variables
• Clean URLs (no date slugs, no .html)
• Add search improvements or backlinks styling
• Write a public “How I built my Digital Garden” article

📚 References

• Digital Garden plugin documentation

• Eleventy template structure

• 🌿 Digital Garden Troubleshooting & Learning in Public

💬 Last Thoughts

This setup is now stable, understandable, and mine.
It supports how I think, write, experiment, and show my work.

Keeping this note updated will help future me evolve the garden with intention — not confusion.

Tags: #DigitalGarden #Obsidian #Vercel #KnowledgeManagement #Publishing