はてなブログで画像サイズを変更する方法を、備忘録としてまとめておきます。
## 大見出しや*太文字*、- 箇条書きなどを記号で指定できるのが便利です。
画像のアップロード先にはてなフォトライフを使っているので、画像のサイズ指定は はてな独自の記法を使い写真の幅を設定するのはw、高さの指定にはhを使って指定します。
備忘録として書いておきます。
画像の仕組み
はてなブログに画像をアップロードすると、
自動的に はてなフォトライフ というサービスに保存されます。
そして記事編集画面では次のような形で参照されます：
[f:id:ユーザー名:タイムスタンプ:p:plain]
- ユーザー名 … 自分のはてなID
- タイムスタンプ … 画像ごとに割り当てられるユニークな値
- p:plain … 表示形式（plain = 通常表示）
サイズを指定する方法
高さを指定する【:h230】
- コロン【:】
- 高さを意味するhightの頭文字【h】
- 指定したい画像の縦ピクセル数
例：高さを 230px にする場合
[f:id:ユーザー名:タイムスタンプ:p:plain:h230]
幅を指定する【:w100】
- コロン
- 幅を意味するwidthの頭文字w
- 指定画像の横ピクセル数
例：幅を 100px にする場合
[f:id:ユーザー名:タイムスタンプ:p:plain:w100]
幅と高さを同時に指定する
例：幅 200px、高さ 150px にする場合
[f:id:ユーザー名:タイムスタンプ:p:plain:w200:h150]
スクリーンショットのサイズが多少バラバラでも、
[f:id:ED105:20250××××××××p:plain:h230]の様に高さをそろえれば違和感が少なくなります。
p:オプション
p:plain:画像の表示形式を指定するオプションです。p:plain は、画像が元のサイズで表示されることを意味します。他のオプションとして、p:small (サムネイルサイズ)、p:medium (中サイズ)などがあります。
[f:id:ED105:202508******p:plain]
上記の画像のp:以降を書き換えて見ました。
plainと指定
mediumと指定
smallと指定
まとめ
- はてなブログの画像は はてなフォトライフに保存される
- Markdownで編集している場合は、HTMLが使えないので、一般的な画像サイズ編集方法が使えない
- 画像リンクは
[f:id:...]の独自形式 - サイズ変更は末尾に
:w数値や:h数値を追加するだけでOK - 小さめにするなら
plainの部分をmidiumやsmallに変える
過去記事
複数の画像を横並びに並べる方法です。
