Top > Movable Type > 3.2x-ja > moblog用のアイコンを作ったよ

« ブタメン | main | 巻いて、かぶってあったかい »

2006-01-19

3.2x-ja

moblog用のアイコンを作ったよ

moblog-img.gifアトムさんのブログで「ケータイからの投稿の時、タイトルに表示されるアイコン」が羨ましく、
わたしも挑戦してみました!
(エキサイトは標準でそうなるみたい。いいなあ)

まずアイコン作ろうと、自分の携帯電話を参考に頑張ったんだけど、
できてみたら、ただの「白いかたまり」になってしまった・・。
わたしには、二つ折り携帯を15×15ピクセルで表現するのは無謀だったようです。
なので、ここはやっぱり、見た目に分かりやすい形状にしました。

何とかアイコンも完成して、設置もできて大満足!
パッと見て「これはケータイからの投稿!」って分かるのが楽しい。
しばらくは、このアイコン出したくて携帯電話からの投稿が増えそう・・。

それでは、「カテゴリごとにデザインを変更する」についての覚え書き。

このカスタマイズは、Compare プラグインを入れることで、エントリに対して「○○だったら、××を表示する」という条件指定した表示ができるようになります。

Drk7jp : Movable Type の文字列比較プラグイン

こちらをブックマークしていたのですが、使いどころがイメージできなかったので
そのままになっていたところ、この本でも紹介されていました。

4839919445Movable Typeブログ拡張パーツ&デザインガイド―プラグインや無料サービスを活用したブログの機能/デザインパワーアップ術
エ・ビスコム・テック・ラボ

あらためて本についているサンプルを見て、理解も深まり、やりたいことのイメージもかたまりました。
(書中では「投稿者ごとにデザインをかえる」という解説になっています)

それでは、プラグインを入手します。

Compare Plugins for Movable Type staggernation.com

ファイルをダウンロードしたら、 pluginsディレクトリにアップロードします。
そしてテンプレートの条件指定したい箇所の書き換えです。

下記は「moblogカテゴリの時は、エントリタイトルにmoblog用画像を使う。それ以外のカテゴリはその他用の画像を使う」という指定になっています。

<h4
<MTIfEqual a="[MTCategoryLabel]" b="moblog">
class="moblog"
<MTElse>
class="other"
</MTElse>
</MTIfEqual>
>
<MTEntryCategories glue=", "><a href="<$MTCategoryArchiveLink$>" title="<$MTCategoryDescription$>"><$MTCategoryLabel$></a></MTEntryCategories>
</h4>

条件の見方は、「aが、bだったら class="moblog"を使う。aがそれ以外だったら class="other" を使う」という感じです。
このテンプレートで moblog投稿した時に吐き出されるソースはこんな感じ。

<h4 class="moblog"> <a href="http://junjun.peewee.jp/blog/moblog.php" title="moblog">moblog</a> </h4>

あとは、それぞれの要素にスタイルを追加すれば完成です。

余談ですが。
わたしの場合、普段の投稿とモブログ投稿では投稿者名が違うので、
投稿者名で今回と同じ結果になる条件を作ることもできました。

でも、他のカテゴリにもアイコンを作りたいと思った時に対応できるよう、
カテゴリでの条件分けにしました。
アイコンができたら追加していこうかな?と思ってます。

コメントありがとう!

反応遅くてゴメーンっ
見たよ!
アイコン自分で作ったの?
そうか、じゅんじゅんさんはそういうこと得意なんだ!
上手!かわいい!天才!  ※反応が遅れた分、サービスされています

■アトムさん
こちらこそ呼び出してすみませーん!
でも、アトムさんのエントリ見るたびに羨ましかったんです。
だから真似しちゃいましたー。
サービスたっぷり誉めてくれてありがとうございました!

・・そうか、わたしって得意なのか。
上手でかわいくて、天才で、素敵で、美しいのか。
(賛美が増えていても気にしないこと)

コメントはこちらから (お気軽にどうぞ!)

ご利用のブラウザ、設定ではご利用になれません。