頻出はてな記法&頻出HTMLタグメモ

いくつか記事を書いてみて「これはよく使うな~」と思った
はてな記法とHTMLタグのメモと、うまく表現できなかった場合に
自分でなんとかしたバッドノウハウ集。


目次


はてな記法一覧

以下のリンクを見れば大体全部わかる。
はてな記法一覧 - はてなダイアリーのヘルプ


見出し

見出しをつける(見出し記法) - はてなダイアリーのヘルプ
小見出しをつける(小見出し記法、小々見出し記法) - はてなダイアリーのヘルプ

先頭に*(アスタリスク)を付けると見出しになる。
アスタリスク1個 = h3相当
アスタリスク2個 = h4相当
アスタリスク3個 = h5相当

* ここが見出し1(h3)
** ここが小見出し2(h4)
*** ここが小々見出し3(h5)

 ↓

f:id:ultgen:20180128115226p:plain

HTMLタグ

はてな記法と同じ表示をしようと思うと以下のようになる。

><h3>ここが見出し1(h3)</h3><
><h4>ここが小見出し2(h4)</h4><
><h5>ここが小々見出し3(h5)</h5><

ちなみに、見出しのレベルを合わせておけば、はてな記法で書いても
HTMLタグで書いても目次は自動生成してくれる。

 


好きなname属性の見出しをつける(name属性付き見出し記法) - はてなダイアリーのヘルプ
以下のように記述すると見出しにIDを割り振ることができる。

*IDisHere* 見出し
HTMLタグ

以下のように記述すると見出しにIDを割り振ることができる。

><h3 id="midashi">見出し</h3><
リンクの記述

以下のように記述することでリンクを作成することができる。

<a href="#midashi_link">見出しへのリンクへのリンク</a>

 ↓
見出しへのリンクへのリンク

 


目次

目次を挿入するには以下の1行を記述する。

[:contents]

なお、目次の項目は見出しに対応するので
文章に適宜見出しをつける必要がある。

目次に目次が入ってしまう場合の対策

目次に「目次」という見出しを付けると
自動生成される目次に「目次」が入ってしまう。

* 目次
[:contents]

* 見出し1
* 見出し2
* 見出し3

 ↓
f:id:ultgen:20180128121151p:plain

とりあえずの解決方法としては、目次を見出しにせずに
フォントを変更することで解決できる。*1

<span style="font-size: 150%"><b>目次</b></span>
[:contents]

* 見出し1
* 見出し2
* 見出し3


f:id:ultgen:20180128121834p:plain

 


pタグ停止(不自然な余白の解消)

pタグの挿入を止める(pタグ停止記法) - はてなダイアリーのヘルプ
「><」で始まる行があると、pタグが自動で挿入されないようになる。
pタグを自動で挿入されないようにすると
不自然な余白が表示されないようになる場合がある。

<hr>
↑ここに不自然な余白がある。

><hr><
↑ここの不自然な余白がなくなる。

 ↓

f:id:ultgen:20180128125713p:plain

 


画像の位置

画像を挿入するとデフォルトでは以下のような記述となっている。

[f:id:ultgen:20180128132614p:plain]
画像の横に文字を表示したい人生だった...。

 ↓

f:id:ultgen:20180128132614p:plain
画像の横に文字を表示したい人生だった...。

末尾にleftとかrightを追加すると画像を左右に寄せて
横に文字を入れたりできる。

[f:id:ultgen:20180128132614p:plain:left]
画像が左寄せになる

 ↓

f:id:ultgen:20180128132614p:plain:left
画像が左寄せになる


[f:id:ultgen:20180128132614p:plain:right]
画像が右寄せになる

 ↓

f:id:ultgen:20180128132614p:plain:right
画像が右寄せになる



 


表組みをつくる(表組み記法) - はてなダイアリーのヘルプ
基本的な表の書き方は上記リンク参照。
表のセル内の文字を中央揃え等にしたい場合は以下のように記述する。

<div align="left">左揃え</div>
<div align="center">中央揃え</div>
<div align="right">右揃え</div>

 ↓

名前 個数
左揃え
中央揃え
右揃え
グレープフルーツ
黄色
5,000,000個
みかん
スパニッシュ・オレンジ
2個

 


[続きを読む]を表示する

見出し毎に「続きを読む」を表示する(続きを読む記法) - はてなダイアリーのヘルプ
その日全体に「続きを読む」を表示する(スーパー続きを読む記法) - はてなダイアリーのヘルプ
見出し単位で「続きを読む」をクリックして読ませたい場合はイコール4つ
記事単位で「続きを読む」をクリックして読ませたい場合はイコール5つ
を任意の場所に記述することで「続きを読む」を表示することができる。


*1:もっといい方法知ってたら教えてください><;