Support Center
v1.0
Features
Comments
Title
Message
Create new category
What is the title of your new category?
Edit page index title
What is the title of the page index?
Edit category
What is the new title of your category?
Edit link
What is the new title and URL of your link?
Markdoc Format
Summarize Page
Copy Markdown
Open in ChatGPT
Open in Claude
Markdoc format is the format used when pages are synced on DeveloperHub using GitHub Sync. Markdoc is markdown-based authoring framework for writing documentation.
Frontmatter Syntax
Every page has a frontmatter header, such as this one:
Frontmatter
xxxxxxxxxx---type: pagetitle: Getting Startedlisted: trueslug: getting-starteddescription: index_title: Getting Startedhidden: falsekeywords: keyword1,keyword2tags: tag1,tag2---Markdoc Syntax
Markdoc is a superset of Markdown, so you can still write Markdown as you usually do, including the following nodes:
Markdown
xxxxxxxxxx## Headers **Bold** _Italic_ [Links](/docs/nodes)  Unordered Lists- Item 1- Item 2- Item 3 Ordered Lists1. Item 12. Item 2 1. Item 1 under 23. Item 3 > Callouts `Inline code` ```Code fences```In addition to Markdown, we provide tags and attributes for all blocks and inline blocks.
Blocks have the following syntax:
Markdown
xxxxxxxxxx{% block-type attr1="value1" attr2="value" %}contents{% /block-type %}While inline blocks have the following syntax:
Markdown
xxxxxxxxxx{% block-type attr1="value1" attr2="value2" /%}The syntax is shown below for every block with an example:
Code Block
Markdown
xxxxxxxxxx{% code %}{% tab language="javascript" %}function fibonacci(num, memo) { memo = memo || {}; if (memo[num]) return memo[num]; if (num <= 1) return 1; return memo[num] = fibonacci(num - 1, memo) + fibonacci(num - 2, memo);}{% /tab %}{% /code %}Images
Markdown
{% image url="https://uploads.developerhub.io/dev/V5Na/u0dpegq8xdpnclhctkpxycekhj04sev9j2kztstph3bnj41cde13o7vuzlpxw6yj.jpg" caption="Image example" mode="responsive" height="1200" width="1920" %}{% /image %}Tables
Markdown
xxxxxxxxxx{% table widths="null,100" %}| Parameter | Type | Default Value | | ---- | ---- | ---- | | user_id | int | Auto generated | | user_name | string | John Doe | | user_age | int | 25 | {% /table %}Callouts
Markdown
xxxxxxxxxx{% callout type="success" title="Success" %}Great **success**!{% /callout %}Videos
Markdown
xxxxxxxxxx{% video videoId="e5b8c04bca094dd8a5507925ab887002" provider="loom" %}{% /video %}Synced Blocks
Markdown
xxxxxxxxxx{% synced id="open-block-menu" %}{% /synced %}Custom HTML
Markdown
{% html %}<a href="https://docs.developerhub.io/?goto=wide" target="_blank" style="background-color: #333; color: white; padding: 12px; border-radius: 3px; text-decoration: none !important"> See Wide Layout</a>{% /html %}Tabs
Markdown
xxxxxxxxxx{% tabs %}{% tab title="Android" %}Android Tab{% /tab %}{% tab title="iOS" %}iOS Tab{% /tab %}{% /tabs %}GitHub Code
Markdown
xxxxxxxxxx{% github-code url="https://github.com/torvalds/linux/blob/master/kernel/signal.c#L152-L170" %}{% /github-code %}Index List
Markdown
xxxxxxxxxx{% index-list %}{% /index-list %}Inline Blocks
Markdown
xxxxxxxxxxVariables: %user.id%Badges: {% badge type="success" text="Great" /%}Icons: {% icon classes="layers" /%}Keyboard Keys: {% key key="F" /%}Glossary: {% glossary term="product" /%}Inline Images: {% inline-image url="https://img.com/img.url" width="100" /%}Type to search, ESC to discard
Type to search, ESC to discard
Type to search, ESC to discard
Last updated on May 4, 2025
Was this page helpful?
Next to read:
Code Stepsnull
Discard Changes
Do you want to discard your current changes and overwrite with the template?
Archive Synced Block
Message
Create new Template
What is this template's title?
Delete Template
Message