WordPressで使えるマークダウンと、音声入力+マークダウン

ブログ記事を書くのって面倒くさいですね。(オイオイ……(-_-;))

画像いっぱい用意したり、文章書いたり、文字装飾したり、、、

その面倒くささを少しでもなくせるかもしれないマークダウンをWordPressで使おう!という記事です。WordPressで使えたマークダウンを紹介します。

スポンサーリンク

マークダウンは手軽

ネット上の文章の多くはウェブブラウザで表示されます。ウェブブラウザでページを表示するには、HTMLという方法で書く必要があります。HTMLってこういうやつです。

<p><strong>ネット上の文章</strong>のほとんどは<strong><em>ウェブブラウザ</em></strong>で表示されます。ウェブブラウザでページを表示するには、<strong>HTML</strong>という方法で書く必要があります。HTMLってこういうやつです。</p>
そだ
そだ

途中に何かいっぱい混ざってて読みにくいわね。

  • さらに、
  • 箇条書きは
  • こうですね。
  • 見た目は
  • さっぱりしてますけど
  • 正体は
  • こんなですよ
<ul><li>さらに、</li><li>箇条書きは</li><li>こうですね。</li><li>見た目は</li><li>さっぱりしてますけど</li><li>正体は</li><li>こんなですよ</li></ul>
そだ
そだ

ぜんぜん箇条書きじゃないわね。

これを、マークダウンという方法で書くとこうなります

**ネット上の文章**のほとんどは***ウェブブラウザ***で表示されます。ウェブブラウザでページを表示するには、**HTML**という方法で書く必要があります。HTMLってこういうやつです。
そだ
そだ

記号がうるさいけど、さっきのよりは読めるわね。

* さらに、
* 箇条書きは
* こうですね。
* 見た目は
* さっぱりしてますけど
* 正体は
* こんなですよ
そだ
そだ

あら、見た目ほとんど一緒じゃないの。わかりやすいわね。

ウェブページのように表示しなくても、見出しなどの文章構成がわかりやすいのがマークダウンのいいところです。マークダウンエディタなどを使えばウェブページのように表示できますし、HTMLファイルやPDFに変換できることもあります。

下書きの段階で見出しやリストなどをマークしておけば、実際の記事の状態を想像しやすくなります。

また、プレーンテキスト(文字情報のみで装飾を含まない)なので汎用性があります。マークダウンファイルの拡張子は.mdですが、中身はプレーンテキストなので.txtファイルと同じように開くことができます。

覚えることが少ない

HTMLは覚えるのも書くのも大変ですが、マークダウンは少し覚えればすぐに使えます。

WordPressで使えるマークダウンはそれほど多くないですし(マークダウン自体それほど多くない)、使うのは記号やスペースだけです。今覚えればすぐに使えるようになります。

WordPressで使えるマークダウン

WordPress編集画面ではどのマークダウンが使えるのか。ひととおり試してみたので、使えたものを紹介していきます。

マークダウン記号とスペースはすべて半角英数で書きます。
ブロック要素(リストや引用)のあとには空行を入れます。空行なしで続けるとそのブロックに飲み込まれます。

見出し

行頭半角シャープ + 半角スペース。シャープの数が見出しレベルに対応しています。

## 見出し2
### 見出し3
#### 見出し4

文字装飾

強調(太字、斜体)

強調したい文字をアスタリスク「*」ではさみます。*の代わりに _ も使えます。日本語は斜体にならないことが多いのでアルファベットの例も添えます。

文章の一部分を**強調します**(strong)強い強調 
文章の一部分を*強調します*(em)
Markdown *Markdown* **Markdown** ***Markdown***

文章の一部分を強調します(strong)強い強調
文章の一部分を強調します(em)
Markdown Markdown Markdown Markdown

取り消し線

取り消し線をのせたい文字を半角チルダ2個「~~」ではさみます

※WordPressツールバーの打ち消し線(s)ではないことに注意。
(HTML5では、s は、すでに正確ではなくなった内容を表す)

文章の一部分に~~取り消し線をのせます~~(del)削除された箇所という意味

文章の一部分に取り消し線をのせます(del)削除された箇所という意味

改行、段落、水平線

普通にエンターキーで改行すれば改行になります。行と行の間に空行を入れれば段落分けできます。

(本来の改行は半角スペース2 + 改行らしいのですが、WordPressでは改行のみで反映されました)

水平線は一行にアスタリスク3つ以上(- か _ も使える)のみで。

改行は普通に改行すればOK

段落は空行を挟めばOK

***

改行は普通に改行すればOK

段落は空行を挟めばOK


リスト

順序なしリスト

行頭に、アスタリスク + 半角スペース。続けて内容を書く。

入れ子にするときは、半角スペース4つでインデントする。

「*」以外に「-」「+」が使える 。リストと次の段落の間には必ず空行を入れること。

* リスト「*」「-」「+」が使える
* リスト
* リスト


* リスト「*」「-」「+」が使える
* リスト
    * リスト「*」「-」「+」が使える
    * リスト
    * リスト
* リスト

  • リスト「*」「-」「+」が使える
  • リスト
  • リスト
  • リスト「*」「-」「+」が使える
  • リスト
    • リスト「*」「-」「+」が使える
    • リスト
    • リスト
  • リスト

番号付きリスト

行頭に、半角数字 + ピリオド + 半角スペース。続けて内容を書く。

入れ子にするときは、半角スペース4つでインデントする。

リストと次の段落の間には必ず空行を入れること。

1. 番号付きリスト
2. 番号付きリスト
3. 番号付きリスト


1. ミケちゃん
2. ドードーくん
    1. ぴーちゃん
    2. ぷーちゃん
    3. ぽーちゃん
3. スージーくん

  1. 番号付きリスト
  2. 番号付きリスト
  3. 番号付きリスト
  1. ミケちゃん
  2. ドードーくん
    1. ぴーちゃん
    2. ぷーちゃん
    3. ぽーちゃん
  3. スージーくん

リンク

[]と()を使って書く。またはURLやメールアドレスを<>で囲む。

[リンクテキスト](URL) リンク
<https://ja.markdown.net.br> URLを<>で囲むとリンクになる
<email@host.com> メールアドレスを<>で囲むとリンクになる

リンクテキスト リンク
https://ja.markdown.net.br URLを<>で囲むとリンクになる
email@host.com メールアドレスを<>で囲むとリンクになる

引用

行頭に、半角の大なり記号「>」をつける。

引用と次の段落の間には必ず空行を入れること。

>引用文

引用文

複数行も可。

>吾輩は、
猫である。

>名前はまだない。

吾輩は、
猫である。

名前はまだない。

コード

バッククオートでコードを表現します。

バッククオート一つで囲むと`インラインコード`になります

``インラインコード内で `バッククオート`を使います``

```
バッククオート3つの行で挟むとコードブロックになります
```

バッククオート一つで囲むとインラインコードになります
インラインコード内で `バッククオート`を使います

バッククオート3つの行で挟むとコードブロックになります

WordPress の編集画面で使える

+ボタンから入れるより早い

WordPressの編集画面で直接入力可なのは、見出し・リスト・コードブロックです。

見出しを入れたいときは、+ボタンをクリックして見出しを選択するよりも、半角で#とスペースを打ってEnterキーを押したほうが速いです。

リストコードも同様で、リストは半角スペースキーを押した時点でリストに変換されますし、コードブロックはバッククオートを3つ入力してEnterキーを押すとコードブロックに変換されます。

引用、水平線、他インライン要素はWordPress編集画面で直入力しても変換されないようです。

そだ
そだ

他エディタからコピペで貼り付けると、ちゃんと変換されるんですけどね。

マークダウンで書いた文章をコピペすれば反映される

他アプリでマークダウンを入れた文章を書き、コピーしてWordPress編集画面にペーストすれば、見出しなどがすぐに反映されます。

直入力で変換されないマークダウンも、他からコピペだとちゃんと反映されました。

マーカーや吹き出しなどは編集画面でやらないといけませんが、マークダウンで済むところがあるなら少しでも時短になります。

音声入力でマークダウン文書を作る

エディボイスでマークダウン入力

音声入力アプリ紹介記事にも書いた「エディボイス」というAndroidアプリは、音声入力しながら記号などの入力ができます。さらに単語登録や、いくつかのキーには割当の変更ができます。

「これマークダウンを入れながら音声入力で記事の下書きが作れる、すげぇ♪」と思いましたね。

で、何を単語登録するか?何をキーに割り当てるか?と考えましたが、結局半角スペースだけをキーに割り当てました。

理由は、文字の表示エリアをタップするとスマホのキーボードが出てきて、必要な記号(半角スペース以外)は全部入力できるから。日本語入力モードなのでいちいち確定させなきゃですが、まあしばらくはこれでやってみようと思います。

どうしても面倒くさいウキー!ってなったら単語登録します。

下書きが出来上がったら「送る」ボタンで Google keep かどこかに全文保存して、PCからそこを開いてコピー、WordPress編集画面にペーストします。

Sokki voiceでマークダウン入力

やはり音声入力アプリ紹介記事に書いたWindows用のソフト「Sokki voice」も、単語登録ができるので、がーっと登録してしまえばラクかもしれません。

ただこちらはキーボードを前にした状態で使うと思うので、半角モードにして記号キーでどんどん入力すれば喋る手間が省けます。

それより、 Sokki voice はWordPress編集画面に直入力できるのでマークダウンを書く必要はないかもしれません。

マークダウンエディタ

マークダウンをプレビューできるマークダウンエディタもたくさんあります。OS関係なく、ブラウザで使えるものがこちらで紹介されています。

私はObsidian(PC)を使っています。Obsidianはマークダウンエディタとしてよりも別の機能がすごいので、ご興味あれば調べてみてください。

まとめ

すぐ覚えられてすぐ使えるマークダウンでWordPress記事の下書きをしてみませんか、という記事でした。記事の下書きだけでなく、普段のメモ書きでも見出しをマークしておくだけでぐっと読みやすくなります。

スマホならどこでも記事の下書きができます。文章を考えるついでにマークダウンも入れて、編集画面での手間を減らしましょう!

この記事を書いた人
たまに、加賀 一
そだ ひさこ

子ども時代はもちろん、大人になっても昔話好き。
不調で落ち込んでいた30代のある日。記憶の底から突如、子ども時代に読んだ昔話の場面がよみがえる。その不思議さに心を奪われて、一瞬不調であることを忘れた。自分は昔話で元気が出るんだと気づいた。

そだ ひさこをフォローする
書くためのツール
スポンサーリンク
そだ ひさこをフォローする
「塑田久子、お話を作る」の記録ブログ

コメント

タイトルとURLをコピーしました