DataTable Setup
The plugin uses UE's standard URichTextBlock styling system. To style your markdown output, you create a DataTable of row type RichTextStyleRow and define how each markdown element (headers, bold, code, links, etc.) should look. Assign that DataTable to your RichTextBlock's Text Style Set and add the Azimuth decorators so the tags map correctly.
Creating the DataTable
- In the Content Browser, click Add > Miscellaneous > DataTable
- Select RichTextStyleRow as the row struct
- Name it
DT_AzimuthMarkdownStyles(or any name you prefer) - Add rows for each tag name (see table below)
Recommended Row Configuration
| Row Name | Font | Size | Typeface | Color Suggestion |
|---|---|---|---|---|
| Default | Roboto | 14 | Regular | White / Light Gray |
| Bold | Roboto | 14 | Bold | White |
| Italic | Roboto | 14 | Italic | White |
| BoldItalic | Roboto | 14 | Bold Italic | White |
| Code | Courier New | 13 | Regular | Light Green / Cyan |
| CodeBlock | Courier New | 13 | Regular | Light Green / Cyan |
| Header1 | Roboto | 24 | Bold | White |
| Header2 | Roboto | 20 | Bold | White |
| Header3 | Roboto | 17 | Bold | White |
| Header4 | Roboto | 15 | Bold | White |
| Header5 | Roboto | 14 | Bold | Light Gray |
| Header6 | Roboto | 14 | Bold | Light Gray |
| Bullet | Roboto | 14 | Regular | White |
| Numbered | Roboto | 14 | Regular | White |
| BlockQuote | Roboto | 14 | Italic | Gray |
| Link | Roboto | 14 | Regular | Blue (0.2, 0.5, 1.0) |
| Strikethrough | Roboto | 14 | Regular | Gray |
These are suggestions. Customize fonts, sizes, and colors to match your project's visual style.
Important: The row names must match the tag mapping. If you use the default tag mapping, use the row names exactly as shown above. If you use a custom tag mapping, your row names must match whatever you set in your FMarkdownTagMapping.
Assigning to a RichTextBlock
- Select your
URichTextBlock(orAzimuthRichTextBlock) in the widget designer - In the Details panel, find Text Style Set and assign your DataTable
- In the Decorator Classes array, add:
AzimuthRichTextStyleDecoratorAzimuthRichTextLinkDecorator
Both decorators are required. The style decorator handles all visual formatting. The link decorator makes [text](url) links clickable.