How to Display JSON, XML, YAML & Code in Confluence (With Syntax Highlighting)
- Developer teams documenting APIs, configs, and schemas in Confluence
- Tech writers who need formatted code samples alongside prose
- Anyone pasting JSON, XML, YAML, or SQL into Confluence and getting an unreadable wall of text
- Why Confluence's built-in code block struggles with JSON, XML, and config files
- How to embed syntax-highlighted code in 85+ languages using a Monaco-powered editor
- Theme configuration, diff views, and screenshot-ready window chrome
- When to use a code block vs. a visual JSON structure diagram
The scenario every engineering team hits: you're documenting an API in Confluence, and the page needs to show a JSON response, an XML config, a YAML deployment manifest, and a SQL query — all on the same page. You paste each one into Confluence's built-in code block macro, publish, and the result is a wall of monochrome text. No syntax colors. No line numbers that work. JSON braces, XML tags, and YAML indentation all blur together. The reader has to copy-paste your snippet into VS Code just to understand it.
The root problem is that Confluence's native code block uses a basic highlighter that wasn't built for the structured data formats modern teams actually work with. JSON, XML, YAML, and SQL each have specific visual conventions — matched braces, nested tags, indentation scopes — that a generic highlighter doesn't handle well.
Modern Code Blocks for Confluence solves this by bringing the Monaco Editor — the same engine that powers VS Code — into Confluence. It accurately highlights 85+ languages including JSON, XML, YAML, SQL, GraphQL, Terraform, Dockerfile, and every mainstream programming language. This guide walks through embedding formatted code and data formats in your Confluence pages.