What is YAML metadata and how to use it?

--- robots: index, follow lang: en dir: ltr breaks: true --- # What is YAML metadata and how to use it? :::warning Since 2023-06-20 (GMT+8), HackMD does not accept YAML frontmatter as metadata. All metadata defined in YAML frontmatter has been migrated to HackMD and stored there, after which HackMD ignores all changes in the YAML frontmatter section. This tutorial will close on 2023-08-20. Before then, you may want to review each section to see where the metadata goes. ::: YAML is a human-readable data-serialization language. It is commonly used for configuration files and in applications where data is being stored or transmitted [^from-Wikipedia]. It is a common practice to use YAML to add metadata, such as title, tags, and descriptions, to Markdown documents. [^from-Wikipedia]: https://en.wikipedia.org/wiki/YAML HackMD defines certain properties that you can use for various aims, for example, controlling behaviors in slide mode. First of all, you have to add the following contents at the **first** line of a note. ``` --- YAML metas --- ``` Replace `YAML metas` with the properties below. The source code of this note can be your reference. title --- :::warning Please refer to the tutorial: [How to edit title and tags](/s/osUXHS5sTe21hcecll0d5g). ::: Set the title of the note, overrides the first Header. > Default: not defined. **Example** ```xml title: meta title ``` description --- :::warning Please refer to the tutorial: [How to edit metadata of a note](/s/z9V2N2odTIWfPX5j8Gt4cg) ::: Set description for the note. > Default: not defined. **Example** ```xml description: meta description ``` image --- :::warning Please refer to the tutorial: [How to edit metadata of a note](/s/z9V2N2odTIWfPX5j8Gt4cg) ::: Set the default image for the note, which will be used as preview image for the link. > Default: HackMD default preview image **Example** ```xml image: https://hackmd.io/screenshot.png ``` :::info ### :bulb: Twitter Social Cards Twitter only displays images that meet the ratio of 1200 to 675. ::: tags --- :::warning Please refer to the tutorial: [How to edit title and tags](/s/osUXHS5sTe21hcecll0d5g). ::: Set tags for the note. overrides tags set with `######tags:` > Default: not defined. **Example** ```xml tags: features, cool, updated ``` type --- :::warning Please refer to the tutorial: [How to create a slide deck](https://hackmd.io/@docs/S1wwUhj5E) ::: Set the type of the note. If you'd like to preview slides in Edit Mode, please set this property to `slide`. **Example** ```xml type: slide ``` robots --- :::warning You will be able to set this again soon. ::: By adding this property, HackMD will add the following HTML tag to the `<head>` section: ```xml <meta name="robots" content="your_meta"> ``` You can set the content property to `noindex, nofollow` to prevent search engines from indexing your note. > Default: not set. **Example** ```xml robots: noindex, nofollow ``` lang --- :::warning Please refer to the tutorial: [Edit note metadata](/s/z9V2N2odTIWfPX5j8Gt4cg). ::: Set note language. Please use ISO 639-1 codes: https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes > Default: not defined (`en`) **Example** ```xml lang: ja-jp ``` dir --- :::warning Please refer to the tutorial: [Edit note metadata](/s/z9V2N2odTIWfPX5j8Gt4cg). ::: Set the direction of words. Use `rtl` for languages written from right to left, and `ltr` for those written from left to right. Learn more → http://www.w3.org/International/questions/qa-html-dir > Default: not defined (`ltr`) **Example** ```xml dir: rtl ``` breaks --- :::warning Please refer to the tutorial: [Edit note metadata](/s/z9V2N2odTIWfPX5j8Gt4cg). ::: Tells HackMD to translate a new line into a new line or to be ignored. In original Markdown guideline, you have to add two spaces to make a new line. This property can only be set to `true` or `false`. > Default: note defined (`true`) **Example** ```xml breaks: false ``` GA --- :::warning You will be able to set GA again soon ::: Set Google Analytics ID > Default: not set (disabled) **Example** ```xml GA: UA-12345667-8 ``` disqus --- :::warning Please refer to the tutorial: [Edit note metadata](/s/z9V2N2odTIWfPX5j8Gt4cg). HackMD will provide its own way of commenting on the whole note and is sunsetting disqus. ::: Enable Disqus with your shortname. > Default: not set (disabled) **Example** ```xml disqus: hackmd ``` slideOptions --- :::warning Please refer to the tutorial: [How to create a slide deck](https://hackmd.io/@docs/S1wwUhj5E) ::: Configure presentation behaviors in slide mode. For details, please consult: https://revealjs.com/config/#reconfiguring You can set a theme for the slides. Please consult: https://revealjs.com/themes/ :::warning :bulb: Please indent with two spaces in YAML. ::: > Default: not defined **Example** ```xml slideOptions: transition: fade theme: white ``` lintConfig --- :::warning You will be able to configure lint soon. ::: This option is the vaules for [markdownlint](https://github.com/DavidAnson/markdownlint). For details, please consult [.markdownlint.yaml](https://github.com/DavidAnson/markdownlint/blob/main/schema/.markdownlint.yaml). :::warning :bulb: Please indent with two spaces in YAML. ::: **Example** ```md --- lintConfig: MD004: style: "consistent" MD006: false --- # Your other markdown content ```

Syntax	Example	Reference
# Header	Header	基本排版
- Unordered List	Unordered List
1. Ordered List	Ordered List
- [ ] Todo List	Todo List
> Blockquote	Blockquote
Bold font	Bold font
Italics font	Italics font
~~Strikethrough~~	~~Strikethrough~~
19^th^	19^th
H~2~O	H₂O
++Inserted text++	Inserted text
==Marked text==	Marked text
[link text](https:// "title")	Link
![image alt](https:// "title")	Image
`Code`	`Code`	在筆記中貼入程式碼
```javascript var i = 0; ```	`var i = 0;`
:smile:		Emoji list
{%youtube youtube_id %}	Externals
$L^aT_eX$	L^aT_eX
:::info This is a alert area. :::	This is a alert area.