« 【素材1】かわいくて落ち着くRSSアイコンなど | ホーム | 【Jリーグ観戦1】4/23 川崎F VS 仙台 »
2011年4月22日
movabletypeのブログ記事内の画像の有無で振り分ける条件分岐
movabletypeをCMSとして現在Webサイトを使っているのですが、
サイトをにぎやかに見せるために写真や画像を多く使いたいと思い、エントリーの画像の使用有無で条件分岐をさせるスクリプトを書きました。
上記画像のように、ブログ内に写真が使われているときと、使われていないときで、吐き出す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>
意外に、すんなりとできました。。。