はてなブログでは「見たまま編集」で記事を書いたり写真を挿入するのは楽なのだが、アップロードした画像が縦長だと記事内のサムネイル画像がやけに大きく、画像をクリックして表示させる画像は、「あれれ? サムネイル画像より小さい!!」 となる。このカラクリについて調べる気はないが、少なくとも
①記事内写真はサムネイルらしいサイズ
②サムネイル画像をクリックして表示させる画像はMax1200ピクセル(縦横のどちらか)とするには、どうやって編集すればよいか。
答えの一つは「はてな記法」を使うと上記の事は達成できる、と分かった。以下の方法でサムネイル画像サイズを小さくすると、何故かクリックした画像は大きく表示されるようになる。
はてな記法での編集手順
・「記事を書く」で編集画面になったら、
画面左上にある「編集 見たまま」の
右横のν記号をクリックして「はてな記
法」を選択。
・記事は見たまま編集と同様に書く。
但し改行する場合は見たまま編集とは
全く異なるので、プレビューで確認し
ながら編集する。
・写真をアップロードし、記事内に貼り
付ける。
すると写真挿入文章の下側に [f*******************:plain] のような文字列が追加される。
f:の中のid:*****は写真の管理番号で、次の:plainはサムネイル画像のdefault設定のような意味合いになる。
・サムネイルらしい画像にするには上記の「:plain」を縦長写真の場合なら「:plain」を消して「:image:h500」のように変更する。 (例) *[f*********************:image:h500]
ここでhは高さheightの意味で、横方向サイズで指定したいときは「w350」のように書く。またサムネイル画像の大きさはプレビュー (上記画像参照)を押すと確認できるので、修正するなら「編集***」をクリックして編集画面に戻す。数字は画像サイズのピクセル数。
・記事文章の右側に小さい写真を配置したい場合は、左寄せの文章を書いて最初の行の右端に写真を挿入し、表示された文字列の:plainを下記のように書き換える。
(例) *[f******************:image:right:w300]
位置を制御するright を入れ、サムネイル画像サイズの幅 :w*** はプレビユー画面で確認しながら調整すればよい。
はてな記法では、改行後の最初の文字位置は制御できず文字位置が見っともない配置になってしまう。整形テキストが使えるとあるが背景が必ず色付きになって使い難い。
