はてなブログのmarkdown記法での記事テンプレートを考える
はてなブログのmarkdown記法での記事テンプレートを考える
はてなブログのmarkdown記法での記事テンプレートを考えてみたのでメモ．
セクション
セクションを表すmarkdown記法はないので，各セクションを<section>タグで囲む．
難点：markdownでは，タブを使うとコードブロックになってしまうので使えない．そのため，入れ子構造が見にくくなる
<section> ## section1 contents1 <section> ### section1-1 contents1-1 </section> </section> <section> ## section2 contents2 </section>
目次
はてなブログの目次記法では<ul>タグのみで展開されるので，
<nav>タグで囲む．
<nav> [:contents] </nav>
続きを読む
記事が長くなる場合，<\!-- more --> を挿入．
常に目次がみられるように，目次の後に挿入する．
ただし，<section>などの要素途中には，タグ構造が壊れるので挿入しない．
詳細は，以下の記事参照．
<nav>[:contents]</nav>
...
<!-- more -->
画像
<figure>タグを使って，
記事の画像は基本的に図として表す．
<figcaption>タグでキャプション入れる．
<figure> ![]() <figcaption></figcaption> </figure>
コードブロック
markdown記法の場合，コードブロックは，バッククォート3つで囲む．またはスペース4つまたはタブを入れて書く．
```
code
```
はてなブログの場合，次のように言語を指定すると，シンタックスハイライトができる.
```html
<html>
<head></head>
<body></body>
</html>
```
<html> <head></head> <body></body> </html>
```python
import re
```
import re
はてなブログ用の記事テンプレート
以上をまとめるとこんな感じ．
# 記事タイトル
概要
- list1
- list2
- list3
<figure>
![]()
<figcaption>図</figcaption>
</figure>
<nav>[:contents]</nav>
<!-- more -->
<section>
## 見出し1
本文1
<figure>
![]()
<figcaption>図1</figcaption>
</figure>
<section>
### 見出し1-1
本文1-1
<figure>
![]()
<figcaption>図1-1</figcaption>
</figure>
</section>
<section>
### 見出し1-2
本文1-2
<figure>
![]()
<figcaption>図1-2</figcaption>
</figure>
</section>
<section>
### 見出し1-3
本文1-3
<figure>
![]()
<figcaption>図1-3</figcaption>
</figure>
</section>
</section>
<section>
## 見出し2
本文2
<figure>
![]()
<figcaption>図2</figcaption>
</figure>
<section>
### 見出し2-1
本文2
<figure>
![]()
<figcaption>図2-1</figcaption>
</figure>
</section>
</section>
<section>
## 見出し3
本文3
<figure>
![]()
<figcaption>図3</figcaption>
</figure>
<section>
### 見出し3-1
本文3
<figure>
![]()
<figcaption>図3-1</figcaption>
</figure>
</section>
</section>
<aside id="reference-links">
## 参考リンク
- []()
- []()
- []()
</aside>
<aside id="related_links">
## 関連リンク
- []()
- []()
- []()
</aside>
