【はてなブログ】気軽に使える「Markdown」チートシート一覧

当サイトにお越しいただきありがとうございます。

ブログ運営者のポチ（@sunrise_033）です。

[jin_icon_checkcircle color=”#66cdaa” size=”18px”]この記事の信用性

ポチ

サクサクした記事作成が魅力の「Markdownモード」。

この記事では、「Markdownモード」で気軽に使えるチートシートをいくつかご紹介したいと思います。

個人的に使っているものがメインなので、足りない情報もあると思いますがご了承ください。

「Markdownモード」ってなに？という人はこちらの記事から見てみてくださいね。

あわせて読みたい

【はてなブログ】Markdownモードの使い方、上手に活用して効率アップ はてなブログの「Markdownモード」の特徴と使い方、「見たままモード」との違いを見ていきます。

Markdownモード　チートシート①　見出し

見出しは「#」記号で表記します。

はてなブログの場合は、エディタの左上に「見出し」項目があるのでそこから見出しをつけることができます。

Markdownモード　チートシート②　引用

記事作成には、欠かせない表示である「引用」です。

テスト

「>」の記号を文章の前に入れるだけで「引用」にすることができます。

Markdownモード　チートシート③　コードブロック

htmlなどの文章を囲いたい時に使いたい時には、コードブロックです。

→文章

上記のようなボックス枠を作ることができます。

HTMLコードを貼り付ける時に使っています。

スマートな見た目にすることができるので良いです。

Markdownモード　チートシート④　ブロック

文字や文章自体に枠をつけたい時はこちらです。

文章

文章に枠をつけます。

説明文で文字を強調したい時に便利です。

Markdownモード　チートシート⑤　表（テーブルシート）

レビュー記事などでよく使う「表」です。

上のこれが表になります。

|             |              |               |
|:-------|--------:|:--------|
|             |              |               |
|             |              |               |

表は、Markdown記法だと、上手くいかないので、Evernoteのテーブル機能を貼り付けて使っています。

（難しいことは分からんです。笑）

Markdownモード　チートシート⑥　画像の横幅調整

「w」はwidthで横幅を指定する時に使用します。

「300」は幅のことなので、ここを調整します。

例を出します。

画像は、「さんログ」アイコンです。

↓

こんな感じになります。

スマホだと若干しか変わらないかもですが、PCだと全体的にが小さくなってますよね。

用途としてはオリジナル画像の大きさを調整したりします。

「Markdownモード」では、画像をクリックで調整できないんですよね。

（「見たままモード」ではできます。）

横幅が大きすぎると、PC表示などでバランスが悪くなるので、調整して見やすくします。

Markdownモード　チートシート⑦　画像の縦幅調整

続いては、縦幅の調整です。

「h」はheightで高さを指定する時に使用します。

「300」は幅のことなので、ここを調整します。

↓

上記の調整の縦バージョン。

ポチ

なんか、PCだとあまり変わらないかもですね。

スマホだと、イラストが細長くなってます。笑

まとめ

個人的によく使うMarkdownモード」簡単に使えるスタイルシートをご紹介しました。

慣れれば、サクサク作業が進むので、ぜひ活用してみてくださいね。

最後まで読んでいただき、ありがとうございます。

あわせて読みたい

はてなブログ基本カスタマイズ、手順まとめ【初心者向け】 今回は、はてなブログの基本カスタマイズ記事をまとめてみました。 いろんな方のブログから情報を得て、自分なりにカスタマイズした内容をくわしく見ていきたいと思います。

ポチ

この記事が良いと思ったら、ポチっ！してくれると嬉しいです！