きっと明日はいい日になるっ

小さなライフハックネタ、デジタルガジェットの使い方、手帳などのアナログツールの使い方などつづります。

はてな記法で画像のサイズを変える方法

はてな記法の紹介 画像について

このブログ、Markdownで書いているんですけどずっと困っていることがあって。

ブログに表示する画像のサイズなんですけど、この表示するサイズを指定する方法がいままでわからなくて。みたままモードで書いている方だとこんな悩みはないでしょうけど。

いままでは画像の元のサイズを小さくして表示していたんですけど、これだと解像度がさがっちゃってなんとなく台無しになっちゃうんですよね。

それが、やっとわかったのでうれしくて。

うれしさついでにここにまとめておきます。

画像のサイズを変更する方法

はてな記法について

みなさん、はてな記法てご存知でしょうか?はてなダイアリーの時代からある記法でHTMLをしらなくてもブログが書ける便利なものなんですよ。

はてな記法ってなに? - はてなダイアリーのヘルプ

iPhoneからブログを投稿するとき、リンクや画像などを挿入すると自動でこの記法でリンクがつくられているんです。

はてなフォトライフから引用する

はてなブログの場合、画像ははてなフォトライフからの引用になっているのでアプリで挿入されるはてな記法は以下の通り

[f:id:hatenadiary:20041007101545j:image]

[f:ユーザ名:ファイル名:image]の順になります

サイズの指定

サイズを指定するには、縦サイズだけ指定するなら:h480を追加する。480は指定したいサイズですね。

横サイズだけなら:w360を追加する。360も指定したいサイズです。

両方一緒に指定もできます。

[f:id:hatenadiary:20041007101545j:image:h480] [f:id:hatenadiary:20041007101545j:image:w360]

サイズ感

サイズ感的にはこんな感じに

480x360

320x240

120x90

普段使っているはてな記法

ついでに普段よく使っているはてな記法を。と、言ってもブログカードぐらいなもんですけどね。

ブログカードはこうです。

[http://www.chml-iwbht.net/:embed:cite]

こんな感じになります。

www.chml-iwbht.net

これでもいいみたいです。

[http://www.chml-iwbht.net/:embed]

通常のリンクだとこう

[http://www.chml-iwbht.net/:title]

きっと明日はいい日になるっ

リンク時のタイトルを変えたければこう

[http://www.chml-iwbht.net/:title=このブログ]

このブログ

スクリーンショットを表示したければこう

[http://www.chml-iwbht.net/:image]

screenshot

うちのサイトだと何も出ない・・・。

はてな記法だけでも色々できますね。

まとめ

調べててわかったのははてな記法ってすごく便利なんですよね。

markdownと一緒に書くとすごくサクサクブログの記事が書けるんですよ。

皆さんもはてな記法を活用してみませんか?

はてな記法一覧 - はてなダイアリーのヘルプ

スポンサーリンク