このマニュアルは、a-blog cms 1.0.1をもとに説明しています。ご利用のバージョンによって、画面表示や内容が若干異なる場合があります。ご了承ください。

ここでは、マークダウン記法で記事の本文を入力する方法を説明します。

---

マークダウン記法とは

マークダウンを利用すると、HTMLを書かずに簡易記法で書けば自動的にHTMLに変換されます。通常の本文入力では段落ごとに入力欄が分かれますが、マークダウン入力の場合は１つの入力欄で複数の段落を入力することができます。

マークダウン記法を入力する

マークダウン記法で入力するには、テキストの入力画面で[マークダウン]を選択します。

---

---

---

見出し（h1〜h6）

例）マークダウン表記

見出し 1

サンプル
========
# サンプル
# サンプル #

見出し 2

サンプル
--------
## サンプル
## サンプル ##

見出し3

### サンプル

見出し4

#### サンプル

見出し5

##### サンプル

見出し6

###### サンプル

IDを付ける場合

# サンプル {#sample}

例）ブラウザでの表示

見出し 1

サンプル

サンプル

サンプル

見出し 2

サンプル

サンプル

サンプル

見出し3

サンプル

見出し4

サンプル

見出し5

サンプル

見出し6

サンプル

IDを付ける場合

サンプル

---

改行（br）

例）マークダウン表記

行末に2つ以上の半角スペースを入れると  
改行されます。

例）ブラウザでの表示

行末に2つ以上の半角スペースを入れると
改行されます。

---

引用（blockquote）

例）マークダウン表記

> 文章などを引用するときに
> 使います。

>> 入れ子もできます。

> ## 見出しや

> * リストを追加できます。
> * 引用のマークダウン表記です。

例）ブラウザでの表示

文章などを引用するときに 使います。

入れ子もできます。

見出しや

• リストを追加できます。
• 引用のマークダウン表記です。

---

強調（em）、より強調（strong）

例）マークダウン表記

文字を斜めにする

*サンプル*
_サンプル_

文字を太くする

**サンプル**
__サンプル__

斜めで太い文字にする

***サンプル***
___サンプル___

例）ブラウザでの表示

文字を斜めにする サンプル サンプル

文字を太くする サンプル サンプル

斜めで太い文字にする サンプル サンプル

---

整形済みテキスト（pre）、ソースコード（code）

例）マークダウン表記

全ての行に4つ以上の半角スペースかタブでインデントします。

    //ここは整形されたコードブロックです。
    http://example.com/

例）ブラウザでの表示

全ての行に4つ以上の半角スペースかタブでインデントします。

//ここは整形されたコードブロックです。
http://example.com/

---

コード（code）

例）マークダウン表記

`<code>`タグをインラインで使いたい場合はバックティックで囲みます。  
バックティックをそのまま表示させたい場合は`` `<code>` ``

例）ブラウザでの表示

<code>タグをインラインで使いたい場合はバックティックで囲みます。 バックティックをそのまま表示させたい場合は`<code>`

---

横罫線（hr）

例）マークダウン表記

3つ以上のハイフンかアスタリスクをいれます。

---

* * *

- - - -

例）ブラウザでの表示

3つ以上のハイフンかアスタリスクをいれます。

---

---

---

画像（img）

例）マークダウン表記

パターン１

![画像１](http://www.a-blogcms.jp/themes/www/images/siteLogo.gif "画像１")

パターン2

![][img1] ![][img2]

[img1]: http://www.a-blogcms.jp/themes/www/images/siteLogo.gif "画像２"
[img2]: http://www.a-blogcms.jp/themes/www/images/siteLogo.gif "画像３"

例）ブラウザでの表示

パターン１

パターン2

---

画像のリンク（img）

例）マークダウン表記

パターン１

[![test](http://www.a-blogcms.jp/themes/www/images/siteLogo.gif)](http://www.appleple.com/)

パターン２

[![test][lnkimg1]][lnk1]

[lnk1]: http://www.appleple.com/ "test"
[lnkimg1]: http://www.a-blogcms.jp/themes/www/images/siteLogo.gif "image"

例）ブラウザでの表示

パターン１

パターン２

---

リンク（a）

例）マークダウン表記

パターン１

[example](http://example.com/ "Title部分は任意で")

パターン２

[Sample1][1]、[Sample2][2]、[Sample3][3]  
[1]: http://example.com/  "Sample1"  
[2]: http://example.com/  "Sample2"  
[3]: http://example.com/  "Sample3"

例）ブラウザでの表示

パターン１

example

パターン２

Sample1、Sample2、Sample3

---

リスト（ul、li）

例）マークダウン表記

* Sample1
* Sample2
* Sample3
* Sample4
* Sample5
- Sample1
- Sample2

例）ブラウザでの表示

• Sample1
• Sample2
• Sample3
• Sample4
• Sample5
• Sample1
• Sample2

---

順序リスト（ol、li）

例）マークダウン表記

1.  Sample1
2.  Sample2
3.  Sample3
4.  Sample4
5.  Sample5

例）ブラウザでの表示

1. Sample1
2. Sample2
3. Sample3
4. Sample4
5. Sample5

---

入れ子したリスト（ul、li、ol）

例）マークダウン表記

*   Sample1
*   Sample2
*   Sample1
1.  Sample2
2.  Sample2
*  Sample3
*  Sample4
3.  Sample2
*   Sample1

例）ブラウザでの表示

• Sample1
• Sample2
• Sample1
  1. Sample2
  2. Sample2
• Sample3
• Sample4
  1. Sample2
• Sample1

---

定義リスト（dl、dt、dd）

例）マークダウン表記

定義する用語
:   用語の説明A
:   用語の説明B
:   用語の説明C

例）ブラウザでの表示

定義する用語

用語の説明A

用語の説明B

用語の説明C

---

テーブル（table、thead、tr、th、td）

例）マークダウン表記

左寄せ     | 中央寄せ      | 右寄せ
:----------|:-------------:|--------:
A          | A             | A
B          | B             | B
| **C**         | [C](http://example.com/)

例）ブラウザでの表示

左寄せ	中央寄せ	右寄せ
A	A	A
B	B	B
	C	C

---

HTMLをそのまま反映

例）マークダウン表記1

<p>HTMLタグをそのまま反映<del>しません</del>します。ブロックタグ内ではそのまま表示されます 。[http://example.com/](http://example.com/)</p>

例）ブラウザでの表示1

HTMLタグをそのまま反映しませんします。ブロックタグ内ではそのまま表示されます 。[http://example.com/](http://example.com/)

例）マークダウン表記2

<div markdown="1">markdown="1"を属性として記述することで中をマークダウンさせることができます。[http://example.com/](http://example.com/)</div>

例）ブラウザでの表示2

---