Abdu's Garden

Digital Garden Setup

3 min read

Outline and plan for Project ShrubGarden

Below is a step-by-step outline for converting selective parts of your Obsidian vault into a Hugo-powered digital garden, while maintaining privacy for your personal notes.

1. Project Setup

1.1. Prepare Your Environment

  • Ensure Obsidian is up to date.
  • Install Hugo (the extended version is recommended).
  • Confirm you have Git installed and access to GitHub.

1.2. Organize Your Obsidian Vault

  • Add frontmatter (e.g., publish: true) to notes you wish to publish.
  • Optionally, maintain a dedicated folder or use specific tags for publishable notes.

2. Create Hugo Blog Repository

  • Initialize a new Hugo site: 
    hugo new site my-digital-garden
  • Choose and install a Hugo theme suited for personal blogs (e.g., PaperMod, Digital Garden).
  • Commit and push this project to a public GitHub repository that will serve your blog.

3. Automate Note Export

3.1. Scripting Selective Export

  • Write a script (bash, Python, or Node.js) to:
    • Scan your Obsidian vault for notes with publish: true in the frontmatter.
    • Convert Obsidian’s [[wikilinks]] to standard Markdown links.
    • Extract tags from inline/metadata to Hugo frontmatter.
    • Copy matching markdown files and their media (images, attachments) to the Hugo content/ directory.

3.2. Example Workflow (Shell Outline)

  • Find markdown files for publishing: 
    grep -rl 'publish: true' /path/to/obsidian/vault
  • Process each file:
    • Convert Obsidian-style links.
    • Move/copy corresponding attachments.
    • Adjust internal links as needed for Hugo processing.

4. Version Control & Sync

  • Push your main Obsidian vault to a private GitHub repository for backup and versioning.
  • Push the Hugo site content (with exported notes) to the public repository.

5. Configure Hugo for Digital Garden Features

  • Set up taxonomy for tags in your config.toml: 
    [taxonomies]
tag = "tags"
  • Customize templates to display backlinks, tags, and note metadata.
  • Add or adapt templates/scripts to generate backlink sections on each page, drawing from Hugo’s data files or frontmatter metadata.

6. Build and Publish

  • Connect your public Hugo GitHub repository to Netlify or GitHub Pages for automatic deployments.
  • Set up build triggers for push events on main or master.
  • Ensure published content updates whenever you run the export and push workflow.

7. Update and Iterate

  • Edit notes in Obsidian as usual.
  • Update publish frontmatter or folder organization for new content.
  • Rerun the export script and push to update your blog.
  • Refine the script as your needs or folder structure evolve.

Quick Reference Table

StepDescription
Obsidian OrganizationTag notes for publication using frontmatter or folders
Hugo Site SetupCreate and configure Hugo blog, select theme
Selective Export ScriptScript copies/adjusts publishable notes from vault to blog
Version ControlPrivate repo for vault, public for blog content
DeploymentNetlify or GitHub Pages for automatic publication
IterationKeep exporting, pushing, and refining workflow as you grow

Tips:

  • Leverage community Hugo templates and exporter scripts to accelerate setup.
  • Test your automation regularly to catch edge cases (link resolution, media paths).

With this workflow, you’ll maintain full control, privacy for personal notes, and rich connectivity for your published digital garden.

Graph View