HiÐΞで使うマークダウン記法の使い方まとめ
HiÐΞで使うマークダウン記法をまとめてみました。
慣れると簡単なんですが、最初は戸惑うと思うので…
使いこなせるようになりましょう! ここまで使えたら大丈夫。
もっと詳しく知りたい方は自分で調べてみてね~
参考:マークダウン(記法)とは
https://tech-camp.in/note/technology/84353/
(1)文章構成
①見出し
行頭に#
をつける(#の次は「半角スペース」)
#の数が多いものが見出しレベルが高い。(最大6つ)
HiÐΞにおいては#
と##
は自動的に目次に反映される。
#が3つまでは自動的に目次が付番される
`# 見出し1`
`## 見出し2`
`### 見出し3`
`#### 見出し4`
`##### 見出し5`
`###### 見出し6`
表示:
見出し1
見出し2
見出し3
見出し4
見出し5
見出し6
②改行・段落
改行は行末に
(「半角スペース」2つ) をつける(<br>
と入力してもよい)
段落は空行で一行あける。
これはテスト1。
これはテスト2。<br>
これはテスト3。
これはテスト4。
表示:
これはテスト1。
これはテスト2。
これはテスト3。
これはテスト4。
③ナンバリング
- 行頭に
半角数字.
をつける(.
の次は半角スペース)
一覧の列挙中に空行を入れると、連番が最初に戻る - 一覧の途中で改行したいときは、行末に半角スペースを2つ入れる
- 箇条書き以外で行頭に、
1.
を持ってきたい場合は、1\.
でエスケープできる - さらに、
\\
マーク自体を表示させたいときは、\\
と2回重ねる
1. タイトル1
2. タイトル2
表示:
- タイトル1
- タイトル2
④箇条書き
行頭に*
をつける(*
の次は半角スペース)
* タイトル1
* タイトル2
表示:
- タイトル1
- タイトル2
⑤引用表記
引用元の前に >
を入力する
>引用
>>引用
>>>引用
表示:
引用
引用
引用
⑥袋とじ設定
HiÐΞ独自の袋とじ(文章を隠す)機能は、任意の場所に任意の数だけ設定可能です。
別途、投稿画面で有料記事として公開にチェックを入れ、最低投げ銭額をJPYCで設定します。
匿名投げ銭は、チェックボックスにチェックをつけるだけでできます。(トランザクションは公開されています)
::: hide
かくしごと
:::
⑦コードブロック(2021.5.14追加)
プログラミング言語などで書かれたコードを表示する文を```
(`3つ)で囲む。
文が横幅を超えると横にスクロールが必要となる。
表示:
function shortenString(str) {
var newStr = str;
if (str.length >= 20) {
newStr = str.slice(0, 20) + '...';
}
return newStr;
}
⑧水平線
行頭に---
または***
または___
をつける
---
⑨テーブル
下記リンクで作った表をコピー&ペースト
表テーブル作成ツール
表示:
No | 都道府県 | 人 口 | 市町村数 |
---|---|---|---|
1 | 東京都 | 13,942,856 | 39 |
2 | 神奈川県 | 9,200,166 | 33 |
3 | 大阪府 | 8,823,453 | 43 |
4 | 愛知県 | 7,552,873 | 54 |
5 | 埼玉県 | 7,337,330 | 63 |
⑩折りたたみ機能
追加情報としたいテキストを<details>
タグで囲む。
要約として表示したい文章を<summary>
タグで囲む。
<details><summary>HiÐΞは、分散型ブログ管理サービスです。</summary>ブログプラットフォーマーの支配から解放されます。</details>
表示:
HiÐΞは、分散型ブログ管理サービスです。
ブログプラットフォーマーの支配から解放されます。⑪吹き出しを表示するコード
HiÐΞに吹き出しを表示するコード を好永アカネさんが作ってくれました。コピペで使用可能です。
(2)文字修飾など
①太字
修飾したい文字列を**
または __
で囲む
**hide**
表示: hide
②斜体
修飾したい文字列を*
または _
で囲む
*hide*
表示: hide
③訂正線
修飾したい文字列を ~~
で囲む
hide~~aki~~
表示: hideaki
④アンダーバー(2021.5.14追加)
修飾したい文字列を ++
で囲む
++hide++
表示: hide
⑤下付き文字(2021.5.14追加)
下付きしたい文字を ~
で囲む
H~2~O
表示: H2O
⑥上付き文字(2021.5.14追加)
上付きしたい文字を ^
で囲む
1^st^、2^nd^
表示: 1st 、2nd
⑦文字色
修飾したい文字列を <font color="Red"></font>
で囲む
色はご自由にblueなどお選びください
<font color="Red">HiÐΞ</font>
表示:HiÐΞ
⑧ハイライト(2021.5.14追加)
==黄色にハイライト==
表示:黄色にハイライト
⑨絵文字(2021.5.14追加)
絵文字が利用可能に。これでおじさん構文もつくれるよ(違)
チートシート
おはよう:smiley::wave:犬かいたい:dog:
**表示:おはよう😃👋犬かいたい🐶
⑤KaTeXによる数式の表示
$$
や$
で囲うと数式表示になる(LaTeX のサブセットなのでできない表記もあり)
記法一覧:https://katex.org/docs/supported.html
⑩インラインコード(2021.5.14追加)
文章中にコードを表示する。
`**2021.5.15**`
2021.5.15
(3)URLリンク・画像・動画
①URLリンク
[リンクテキスト](URL)
と入力する
[HiÐΞ](hide.ac)
表示:HiÐΞ
②画像挿入
![画像タイトル](URL)
と入力する
URLはHiÐΞのギャラリーのところで画像リンクを作成する
![JPYC](https://firebasestorage.googleapis.com/v0/b/hideaki-97c59.appspot.com/o/images%2FfbizVlcme5eubHImuFnloztGVUB3%2F-YKOA0Ww0.png?alt=media)
表示:
③Youtube/twitter/slideshare等埋込
iframely.comに埋込したい動画などのiframelyで許可されているドメインのリンクを入れることでマルチデバイス対応が実現。 YouTube動画等の埋め込み機能をそのまま使う方法もあるが、リサイズ等いろいろ手間がかかる。
● 動画埋込の例
● twitter埋込の例
GW利用者急増のHiÐΞライターの皆さん、是非ご活用ください。
— TAAKE🐄 (@taka4198aq) May 9, 2021
HiÐΞで使うマークダウン記法の使い方まとめ https://t.co/Q2rMlUDawA
● スライド埋込の例