FC2ブログで綺麗なサムネイル画像を作成して管理する方法

FC2ブログは細かいところまでカスタマイズができて便利なんだけど、唯一と言えるぐらいの欠点がサムネイル画像が汚いこと。

サムネイル画像を縦横サイズをpx単位で細かく設定できて、画像アップロードと同時に生成してくれるのは非常に便利なんだけど、俺みたいに写真を見せたい！（腕はともかく）という人にはあまり使い勝手は良くないと思う。

色々と調べてみたが、自動的に生成されるサムネイル画像を綺麗にする方法は無く、強いて出来ること言えば、小さめのサイズに設定すると汚さが目立たなくなるという程度。

やっぱりサムネイル画像は自分で作った別ファイルとしてアップロードするのが良いと思う。そこで自分なりに元の画像とサムネイル画像を管理する方法を紹介してみたい。

俺がやっている管理方法は非常に簡単で、サムネイルのファイル名を元々のファイル名の末尾に「_s」をつけているだけ。

手順は、まずは元の画像ファイルをアップする、次にサムネイル画像をアップする。ブログにはサムネイル画像を貼り付けると、その画像にはリンクが張られている。リンクのURLにはサムネイル画像のURL、つまり元のファイル名に「_s」を付けたものになっているから、この「_s」を削除する。
すると、リンク先は元のファイル名になるという訳だ。

分かりやすく例を挙げて説明すると以下の通り。

元画像をアップロードする

上の画像が元のファイルとして、ファイル名を「080921_vietnam_16.jpg」とする。これをアップロードしておく訳だ。
（ちなみにこの写真のエントリーはこちらです。）

サムネイル画像のファイル名は「元画像のファイル名+_s」でアップロードする

次にサムネイル画像をアップする。ファイル名は先にアップロードしたファイル名に「_s」を付けたもの。つまり「080921_vietnam_16_s.jpg」とする。

サムネイル画像をアップロードするとリンク先、つまり「a href=""」のURLは「http://blog-imgs-29.fc2.com/a/m/a/amatoboss/080921_vietnam_16_s.jpg」と、当然、サムネイル画像へのURLになっている。

サムネイル画像のURLから「_s」を削除する

このリンク先URLから「_s」を削除すると、元のファイル名へのURL「http://blog-imgs-29.fc2.com/a/m/a/amatoboss/080921_vietnam_16.jpg」となる。
つまり、上の写真の通りブログ記事に貼られているのはサムネイル画像だが、クリックで元ファイルが開くという訳だ。
これで綺麗なサムネイル画像を貼れると同時に元ファイルへリンクすることもできる。

サムネイル画像のファイル名を「元画像のファイル名+_s」としているのは、管理がしやすいようにするため。「_s」とすることでサムネイル画像だと分かるし、リンクを修正する時も「_s」を削除するだけで済む。

この方法の欠点

この方法の欠点は、元画像とサムネイル画像の2つの画像を作成しない点と、URLを修正する点。画像が1つ、2つ程度なら難なく作成してURLも修正できるけど、画像が10個、20個と増えてくるとかなり面倒になる。

俺のブログでは旅行の記事やパソコンの記事で写真を沢山使うことがあるので、根気良く一つ一つ作業するしかないです。

一番良いのはFC2ブログのサムネイルが綺麗になってくれれば良いんだけどね。

関連記事

• 「自己紹介工場」を紹介してみる
• 桜庭VS秋山のレフリーのブログが大炎上
• 面白い写真共有サイト-Webshots
• 写真共有サイト「livedoor PICS」が最大容量2GBに拡張していました
• 大ヒットDTMソフト「初音ミク」の画像がネットから消えた！？
• 今さら！？「Netscape Navigator 9、正式リリース」だって
• 暑い夏にヒヤっっとする怪談・奇談「死ぬ程洒落にならない怖い話を集めてみない？」
• 奇妙な動画・不思議な動画・不気味な動画を集めてみた
• FC2ブログで記事に付けたタグにブログ内タグ検索を実装する方法
• FC2ブログで画像のfloat（左寄せ）を解除する「<br clear="all" />」を簡単に挿入する方法

タグ（ブログ内検索もできます）：FC2ブログ カスタマイズ サムネイル 画像

自分もブログを書いていてサムネイルが汚いなーと思い、
何か解決策は無いか探してたら、この記事へたどり着きました。

とても参考になりました！