PlantUML Studio for Confluence - User Guide

Quick Start

Inserting a PlantUML Diagram

1. In Confluence page edit mode, type /plantuml or search for "PlantUML"

2. Select "PlantUML Diagram" macro

3. The editor will open automatically, and you can start creating your diagram

Open

Open

Editor Interface

The editor features a split-screen design with real-time preview:

Open

Layout

• Left Panel: PlantUML code editor

  • Syntax highlighting

  • Line numbers

  • Real-time syntax validation

• Right Panel: Live diagram preview

  • Auto-rendering

  • What you see is what you get

• Top Toolbar:

  • Size (display size selection)

  • Pan & zoom (pan and zoom controls)

  • Template Library (pre-built templates)

  • Documentation (help docs)

  • Support (support resources)

• Bottom Action Bar:

  • Cancel: Discard changes

  • Save: Save to Confluence page

Features

1. Size Adjustment

Choose the appropriate display size based on diagram complexity:

Open

Available Sizes:

• Extra Small - Smallest size for simple diagrams

• Small - Small size

• Medium - Medium size (Default, Recommended)

• Large - Large size

• Extra Large - Extra large size for complex diagrams

💡 Tip: After saving, the diagram will display in the selected size on the page

2. Pan & Zoom

Enable to freely navigate and zoom large diagrams:

Open

How to Use:

• Zoom: Click + / - buttons in the bottom-right corner

• Pan: Drag the diagram with mouse

• Reset: Click 100% to restore default size

• Double-click: Quick center

3. Template Library

25+ pre-built templates to quickly start diagramming:

Open

Template Categories:

• Sequence Diagram

  • Basic Sequence Diagram - Simple interactions

  • Advanced Sequence Diagram - Complex scenarios

• Use Case Diagram

  • Basic Use Case Diagram - System functionality

  • Advanced Use Case Diagram - Relationships and inheritance

• Class Diagram

• Activity Diagram

• Component Diagram

• State Diagram

• And more...

How to Use:

1. Click Template Library button

2. Browse or search for templates

3. Click Use Template button

4. Template code will be automatically inserted into the editor

Viewing in Pages

After saving, diagrams will display at the selected size on Confluence pages:

Open

Page Behavior:

• ✅ Diagrams render in SVG format (high-quality vector)

• ✅ Maintains your selected size

• ✅ Automatically adapts to page width

Editing Existing Diagrams:

1. Hover over the diagram

2. Click the Edit icon

3. The editor will reopen