« 【素材1】かわいくて落ち着くRSSアイコンなど | ホーム | 【Jリーグ観戦1】4/23 川崎F VS 仙台 »

2011年4月22日

movabletypeのブログ記事内の画像の有無で振り分ける条件分岐

movabletypeをCMSとして現在Webサイトを使っているのですが、
サイトをにぎやかに見せるために写真や画像を多く使いたいと思い、エントリーの画像の使用有無で条件分岐をさせるスクリプトを書きました。

スクリーンショット(2011-04-22 17.34.44).png 上記画像のように、ブログ内に写真が使われているときと、使われていないときで、吐き出すhtmlを変化させるかつ、自動的にエントリー内の画像を読み込んで表示させています。

ここで、使用しているのは、以下のようなスクリプトです。
//▼予め、画像を使用しているエントリーに名前をつける変数をセット
<MTSetVarBlock name="img"><MTEntryAssets type="image">photo</MTEntryAssets></MTSetVarBlock>
<$mt:EntryTrackbackData$>
<div class="blog_list_body">
<h3 class="list_title list_h3_info"><a href="<$mt:EntryPermalink$>"><$mt:EntryTitle$></a><$mt:EntryDate format="%x"$></h3>

//▼もしエントリー内で画像を使っていたら以下を読み込み
<mt:If name="img" like="photo">
<MTEntryAssets type="image" lastn="1">//エントリー内の画像で、上から1番目の物を取得する。
//▽<$MTAssetThumbnailURL width="100"$>が、取得した画像のURLパス
<p class="list_photo"><a href="<$MTEntryPermalink$>" title="<$MTEntryTitle$>"><img src="<$MTAssetThumbnailURL width="100"$>" alt="<$MTEntryTitle$>" /></a></p>
<div class="list_photo_summary">
<p><$MTEntryExcerpt$>...</p>
<ul class="list_category">
<mt:IfArchiveTypeEnabled archive_type="Category">
<mt:If tag="EntryCategories">
<li><mt:EntryCategories glue='</li><li>'><a href="<$mt:CategoryArchiveLink$>" rel="tag"><$mt:CategoryLabel$></a></mt:EntryCategories></li>
</mt:If>
</mt:IfArchiveTypeEnabled>
</ul>
</div><!--list_photo_summary-->
</div><!--blog_list_body-->
</MTEntryAssets>
//▲ここまでが、エントリーに画像が使われている場合に読み込むスクリプト

<mt:Else>

//▼エントリー内に画像が使われていない場合は、以下を読み込み
<p><$MTEntryExcerpt$></p>
<ul class="list_category">
<mt:IfArchiveTypeEnabled archive_type="Category">
<mt:If tag="EntryCategories">
<li><mt:EntryCategories glue='</li><li>'><a href="<$mt:CategoryArchiveLink$>" rel="tag"><$mt:CategoryLabel$></a></mt:EntryCategories></li>
</mt:If>
</mt:IfArchiveTypeEnabled>
</ul>
</div><!--blog_list_body-->
//▲ここまでが、エントリーに画像が使われていない場合に読み込むスクリプト
</mt:If>

意外に、すんなりとできました。。。
OpenID対応しています OpenIDについて

このブログ記事について

このページは、HAKASHUNが2011年4月22日 17:31に書いたブログ記事です。

ひとつ前のブログ記事は「【素材1】かわいくて落ち着くRSSアイコンなど」です。

次のブログ記事は「【Jリーグ観戦1】4/23 川崎F VS 仙台」です。

最近のコンテンツはインデックスページで見られます。過去に書かれたものはアーカイブのページで見られます。