MWebで目次の入れ子を簡単に作成する方法

スポンサーリンク

ハァ〜イナベです。
先日↓の記事を公開したのですが、

こんにちは。 本日はブログ記事で初めて「目次」をプラグイン無しで作成してみたので手順を紹介します。 そんなに大変ではないですし、HT...

入れ子に関しては特に書いてませんでした。
1つ1つの章の文量が増えてくると中に小さな節を作った方がわかりやすくなります。
それが「入れ子」です。
今回はMWebというマークダウンエディタ(記事プレビューを見ながら記事を書けるソフト)で、入れ子を簡単に作るやり方を紹介します。

そもそもMWebってなんやねんって人は↓をご覧ください。オススメです。(作成中)

そもそもMWebでの目次の作り方って?

↑が私のMWeb上での画面です。
左半分に文章・コード・画像を記載して、右半分のプレビューで確認していきます。

リスト化するだけ

やることはリスト化くらいです。
目次にしたい項目を箇条書きにすることを「リスト化」と呼びます。
MWebでは、-(ハイフン)と半角スペースの隣に目次にしたい項目を打ち込むと、リストとして認識されます。
下の画面はハイフンとのみ入力した状態です。

(ハイフンのみ)

ハイフンの隣にスペースを入れると・・・

(ハイフン+半角スペース)
元々あったハイフンが薄いグレーになり、右の画面ではハイフンだったものが中点(・)になっているのがわかるかと思います。

次の項目を作る際は、改行してまた同じことをします。

以上がリスト化のやり方です。

Tabキーを押すだけで入れ子にできる

↑の画像の、「そもそもMWebでの目次の作り方って?」という母章の下に、入れ子として「リスト化するだけ」を入れたいと思います。
まず、改行して2つの目次の間に「リスト化するだけ」を入れます。

(改行してリストの間に入れると自動的にリスト化されます)

入れ子にしたい「リスト化するだけ」のハイフンの手前にポインターを持ってきて、Tabキーを押します。

「リスト化するだけ」がインデントされて入れ子になりましたね。

最後に体裁を整えます。

えっ?えっ?ってなった方もいるかと思いますが、お許しください。笑
<divなんとかとか、<a hrefなんとかってコードは以下で解説しています。↓

こんにちは。 本日はブログ記事で初めて「目次」をプラグイン無しで作成してみたので手順を紹介します。 そんなに大変ではないですし、HT...

これと同じことをMWeb上で書いているだけです。
入れ子にするやり方はひとまず理解頂けたかと思います。
以下が実際ブラウザ上で表示された目次です。

まとめ

・MWebで簡単にリスト化可能→目次にする
・Tabキーを押すとインデントできる→すぐ入れ子に

その他にもMWebには便利な機能がいっぱいあります。
MWebの文字方式は全てマークダウン記法にのっとっているので、以下のURLをご参照ください。

マークダウン記法のまとめはコチラ→Markdown

以上です!!!アディオス!!!