Markdown on Gno
Introduction
Markdown on Gno is based on standard markdown, but also has some unique features, making it the Gno Flavored Markdown. This document describes the current markdown support in Gno, demonstrating both the syntax and its rendered output.
[!NOTE] Markdown support in Gno is still evolving. New features and improvements will be added in future releases.
Basic Syntax
Headings
Headings are created using hash symbols (#). The number of hash symbols indicates the heading level.
1# Heading 1
2## Heading 2
3### Heading 3
4#### Heading 4
5##### Heading 5
6###### Heading 6
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Text Formatting
You can format text using the following syntax:
1**Bold text**
2*Italic text*
3~~Strikethrough text~~
4**Bold and _nested italic_**
5***All bold and italic***
Bold text
Italic text
Strikethrough text
Bold and nested italic
All bold and italic
Links
Links can be created using the following syntax:
1[Link text](https://example.com)
2[Link with title](https://example.com "Link title")
XXX: custom CSS for internal/external links and if possible for "in the same realm/namespace".
Lists
Unordered lists use asterisks, plus signs, or hyphens:
1* Item 1
2* Item 2
3 * Nested item 1
4 * Nested item 2
- Item 1
- Item 2
- Nested item 1
- Nested item 2
Ordered lists use numbers:
11. First item
22. Second item
3 1. Nested item 1
4 2. Nested item 2
- First item
- Second item
- Nested item 1
- Nested item 2
Blockquotes
Blockquotes are created using the > character:
1> This is a blockquote
2>
3> It can span multiple lines
This is a blockquote
It can span multiple lines
Code
Inline code uses single backticks:
1Use `func main()` to define the entry point.
Use func main()
to define the entry point.
Code blocks use triple backticks with an optional language identifier:
1```go
2package main
3
4func main() {
5 println("Hello, Gno!")
6}
1package main
2
3func main() {
4 println("Hello, Gno!")
5}
Horizontal Rules
Horizontal rules are created using three or more asterisks, hyphens, or underscores:
1---
Tables
Tables are created using pipes and hyphens:
1| Header 1 | Header 2 |
2| -------- | -------- |
3| Cell 1 | Cell 2 |
4| Cell 3 | Cell 4 |
Header 1 | Header 2 |
---|---|
Cell 1 | Cell 2 |
Cell 3 | Cell 4 |
Images
Images can be included using the following syntax:
1
Gno-Specific Features
HTML Support
By design, most typical HTML support is disabled in Gno's markdown implementation. This is an intentional decision for both security and ecosystem cohesion.
While traditional markdown often allows arbitrary HTML tags, Gno Flavored Markdown takes a more controlled approach:
- We may progressively whitelist certain HTML components or add custom ones over time
- Our priority is to enhance our flavored markdown to natively support all essential components
- We aim to eventually support all the initially HTML-supported features, but with syntax that is:
- More readable when viewing the source directly
- More integrable with custom browsers such as gnobro in CLI
This approach allows for a more consistent rendering experience across different Gno interfaces while maintaining security and readability as core principles.
Columns
Gno Flavored Markdown introduces a column layout system using special HTML-like tags. This system allows content to be organized into multiple vertical columns using heading elements as separators. On GnoWeb, up to four columns can be displayed in a single row; exceeding this limit will transfer additional columns to another row, and so on.
Basic Syntax
Wrap your column content in <gno-columns>
tags and use standard markdown headings (from h1 #
to h6 ######
) to define column breaks:
1<gno-columns>
2## Column 1 Title
3
4Column 1 content
5
6## Column 2 Title
7
8Column 2 content
9</gno-columns>
This will render as:
Column 1 Title
Column 1 content
Column 2 Title
Column 2 content
Key Features
- Heading Levels: Any heading level from
#
(h1) to######
(h6) can be used as column separators. The first one will be the reference for subsequent separator.
1<gno-columns>
2# Main Section
3
4Content
5
6## Subsection
7
8More content
9
10# Second section
11
12Content
13
14## Subsection
15
16More content
17</gno-columns>
Main Section
Content
Subsection
More content
Second section
Content
Subsection
More content
- Empty Headings: Use empty headings to create columns without titles:
1<gno-columns>
2###
3
4
5Content without title
6
7### Second Column
8
9Another column
10</gno-columns>
Content without title
Second Column
Another column
Validation Rules
The column system will ignore invalid structures and generate errors in the form of comments in the following cases:
- Unclosed Tags
1<gno-columns>
2## Title
3Content
4<!-- Missing closing tag -->
- Nested Columns
Nested columns tag will be ignored, e.g.
1<gno-columns>
2## Parent
3<gno-columns> <!-- this tag will be ignored -->
4 ## Child
5</gno-columns>
6</gno-columns> <!-- this tag will be ignored -->
- Invalid Headings.
Invalid stating heading will generate an error, e.g.
- Headings in list:
1<gno-columns>
2- ## List Heading
3</gno-columns>
- Headings beyond h6:
1<gno-columns>
2####### Invalid
3</gno-columns>
- Content Before First Heading
Setting content before first heading, is considered as invalid and will generate an error.
1<gno-columns>
2Invalid content
3## Title
4</gno-columns>
Best Pratices
- Always start column content with a heading
- Maintain consistent heading levels within a columns block
- Close tags immediately after final column content
- Prefer simple markdown structures within columns
- Use empty headings (##) for image-focused columns
Usernames
XXX: TODO (add again this feature that was removed)
Bech32 Addresses
XXX: TODO
Gno markdown can automatically recognize and render Bech32 addresses.
1g1jg955hm9a6f0yen878c2hur6q7stqz7rzpyrwpe
g1jg955hm9a6f0yen878c2hur6q7stqz7rzpyrwpe
Smart Contract Integration
XXX: TODO
1gno.land/r/boards
2gno.land/r/boards:foo/bar
3gno.land/r/docs/markdown$source
gno.land/r/boards gno.land/r/boards:foo/bar gno.land/r/docs/markdown$source
And more...
XXX: TODO
Future Enhancements
The markdown support in Gno is being actively developed. Future enhancements may include:
- Extended support for custom components
- Interactive elements specific to blockchain functions
- Rich rendering of on-chain data
- Better integration with Gno's package system
Conclusion
Markdown on Gno provides a familiar syntax for developers who have experience with GitHub Flavored Markdown, while adding blockchain-specific extensions that make it more powerful in the context of the Gno platform.
As the Gno ecosystem grows, expect the markdown capabilities to expand accordingly, providing even richer formatting and interactive elements for documentation and user interfaces.