はてなが提供するウェブアルバムサービス「はてなフォトライフ」にアップロードした画像を、fotolife記法でブログ記事に貼り付けることができます。
編集サイドバーの「写真を投稿」で画像をアップロードすると、はてな記法モードおよびMarkdownモードではfotolife記法で貼り付けられます。
fotolife記法の構文
fotolife記法は、次のような構文をしています。オプションはコロン（:）に続けて記述します。
[f:id:はてなID:画像番号:オプション]
はてなIDや画像番号は、はてなフォトライフの画像ページの上部に表示されている記法により確認できます。
fotolife記法の使用例
編集サイドバーの「写真を投稿」では、デフォルトで次のplainオプションが指定されます。
[f:id:hatenablog:20170217161727j:plain]
これは次のように表示され、PC環境で画像をクリックするとブラウザサイズのビューワで表示されます。
オプションを省略すると、画像をクリックまたはタップしたときに、はてなフォトライフの画像ページに移動するリンクになります。これは、imageオプションと同じ動作です。
※編集サイドバーから写真を投稿すると、非公開の「Hatena Blog」フォルダにアップロードされるため、リンク先に移動してもユーザー本人にしかページは表示されません。
そのほかのオプション
plainオプションやimageオプションと同時に、画像のサイズや属性を指定することができます。
| オプション | 説明 |
|---|---|
w00 |
:wに続けて、画像の表示幅を数字で指定します。 |
h00 |
:hに続けて、画像の表示高さを数字で指定します。 |
alt |
:alt=に続けて、画像の代替テキスト（alt属性）を指定します。 |
title |
:title=似続けて、画像のtitle属性を指定します。 |
altオプションとtitileオプションを省略したときには、はてな記法そのものがデフォルト値になります。また、等号（=）の右側に何も指定しないと、属性値を空にできます。
オプションは複数を続けて指定でき、順序を入れ替えてもかまいません。例えば、次のように指定できます。
[f:id:hatenablog:20170217161727j:plain:w120:title=小さいパンダをクリックすると大きくなります] [f:id:hatenablog:20170217161727j:plain:alt=アドベンチャーワールドで見たパンダ:title=]
それぞれ次のように表示されます。