| title | tags | |
|---|---|---|
Learning Markdown |
|
If you're new to Markdown and just starting to explore its capabilities, this guide is for you. Here you'll learn the basics, from simple text formatting to creating lists and more. By the end, you'll have the skills you need to write clean and structured documents with ease.
The Markdown syntax will be written in the code blocks and an example of how it will appear is shown underneath.
With that, let's get started!
Syntax: - unordered list
- unordered list
Syntax: 1. ordered list
- ordered list
Syntax: - [ ] task
- task
:::success
[!Tip] Pressing Tab within a line will achieve the effect of a sublist. Edit according to your needs.
- order list
- unorder list
- order list
- task :::
Syntax: > quote
quote
Syntax: Enter >[] , move your mouse to the right and a menu (second option) will appear allowing you to insert the current time in the document.
Just like this 👇
[time=Wed, Oct 30, 2024 8:23 PM]
Syntax: Type >[!] and move your cursor after the! (if it's not already. From there, type or select either Note, Tip, Important, Warning, or Caution.
[!Note]
[!Tip]
[!Important]
[!Warning]
[!Caution]
Use these color blocks to emphasize important information. Simply replace the text after ::: with info/success/warning/danger, and the text editor will do the rest.
Syntax:
:::warning
text
:::
Color blocks will look like these 👇
:::warning
:::danger :radioactive_sign: Danger :::
:::info :information_source: Info :::
:::success :100: Success :::
Syntax: [Display name](URL)
Display name
Put # at the beginning of a line and it becomes a header. Two #s create a level 2 header, and so on.
# text
## text
### text
#### text
##### text
###### text
Syntax: **bold**
bold
Syntax: _italics_
italics
Syntax: Wrap the text with ` ` before and after.
Literal example
Syntax: ~~strikethrough~~
strikethrough
Syntax: ==highlight==
==highlight==
Syntax: 21^th^ Century
21^th^ Century
Syntax: H~2~O
H2O
- Use
```to wrap the syntax on the first and last lines. - You can specify the type of language in the code block, e.g. html, javascript, python, markdown.
- Just like this 👇
```python print('Hello, world!') # See if you can set arbitrary line number or # change syntax highlighting for different language # in this code block. - Then you can move the mouse to the right of the language name, and use the menu to select adding line number, auto-wrap1, or no effect at all.
This is what it looks like after rendering 👇
print('Hello, world!')
# See if you can set arbitrary line number or
# change syntax highlighting for different language
# in this code block.
Did you find this guide helpful? Answer one question in this survey and let us know.
Creating tables with Markdown can be messy, so we created a tool to make it easier. Simply click the Table icon in the toolbar at the top of the text editor.
| Column 1 | Column 2 | Column 3 |
|---|---|---|
| Some | thing | nice |
| Text | Text | Text |
Then, if you click on any cell within the table, the Table Editing Mode appears within the toolbar at the top of the page.
→ Learn more about creating a table here
You can also paste a table directly from Excel.
Simply select "Enable smart paste" in the text editor settings and you're set.
You can type [toc] to add a table of contents of your note as below:
[toc]
:::info :bulb: Navigating Menu
If it's not already shown, you can bring up the table of contents by clicking the ☰ icon at the bottom-left of the View pane:
Did you find this guide helpful? Answer one question in this survey and let us know.
The Edit page of the HackMD editor is where all the magic happens -- it's your place for writing and formatting content with Markdown.
The View page of the HackMD editor displays how your note will be rendered; a display of the formatted text, including headings, links, and images. It's a great way to ensure your content appears exactly as you intend before sharing or publishing.
You can jump back into editing at any time by clicking the 🖌️ Edit button at the top right-hand corner of the page.
:::success :bulb: Three modes in your editor
Please locate these three icons at the top of HackMD. Here you can toggle between Edit/Both/View mode (from left to right).
We like to set it to Both mode so that you can take notes in Markdown in the left pane and see how it renders in the right pane. :::
Want to learn more ways you can use HackMD? Check out the Beginner and Expert Guides in your workspace.
The Beginner Guide covers:
- Workspace & sidebar
- Personal workspace
- Create a note
- Start with a template
- Insert images & gifs
- Comments
- Suggest edit
- Share & set permissions
- Publishing
The Expert Guide covers:
- Team workspace
- Sync with GitHub
- API calls
- Book mode
- Custom templates
- Embed notes
- LaTeX & MathJax
- UML diagrams
Before you go, HackMD has an official user manual with instructions for all its features!
In our tutorial book, you'll find detailed guides to all the main features of HackMD that boost your productivity.
Don't want to miss the latest news and feature updates from HackMD? Be sure to follow our social channels or join us on Discord.
Did you find this guide helpful? Answer one question in this survey and let us know.
Footnotes
-
The system will automatically line-break 'Code block text that exceeds the width of the document' so that the content of the code block can be displayed in its entirety without the need to roll the scroll wheel to view it. ↩