このカテゴリでは、管理画面よりアップロードして使用するアイテムの取り扱いに関するサンプルを紹介します。
『アイテム関連サンプル』カテゴリ内のエントリ一覧
- アイテムを取得するリスト
- ブログのアイテム数を取得する
- イメージのみを取得する
- イメージの幅と高さを取得する
- アイテムへのファイルリンクを取得する(1)
- アイテムへのファイルリンクを取得する(2)
- アイテムの種類を調べる
- アイテムのファイル拡張子を調べる
- アイテムのファイルサイズを調べる
- アイテムのタグと説明を取得する
- アイテムの追加日時を調べる
- アイテムのIDを調べる
- アイテムの投稿者を調べる
- エントリのアイテムを調べる
- ウェブページのアイテムを調べる
- 1つのアイテムのIDを指定して情報を取得する
- 最新の画像を一枚取り出す
- 指定アイテムと同じタグを持つ他の画像を抜き出す
- 縦横比を保持して全ての画像の幅をそろえる
- サムネイル画像でエントリリスト
- エントリリストへ代表画像を付与する
- カテゴリリストへ代表画像を付与する
アイテムを取得するリスト
以下は、Movable Type 4.1のウィジェットに格納されているアイテムリストのコードから不要部分を除去したコードサンプルです。
MTIfNonZeroでは、画像がある場合実行という意味で、アイテムがひとつも無ければコードは何も生成されません。
MTAssetsHeaderとMTAssetsFooterは、それぞれ「ループ初回であれば」「ループ最終回であれば」挟まれた部分が実行されるテンプレートタグです。
以下例では、MTAssetsタグへtype="image"モデファイアとlastn="10"モデファイアを指定しているので、画像を最新から10枚取得します。
<MTIfNonZero tag="AssetCount">
<MTAssets type="image" lastn="10">
<MTAssetsHeader>
<ul>
</MTAssetsHeader>
<li><a href="<MTAssetURL>"><img src="<MTAssetThumbnailURL height="70">" alt="<MTAssetLabel>" title="<MTAssetLabel>" /></a></li>
<MTAssetsFooter>
</ul>
</MTAssetsFooter>
</MTAssets>
</MTIfNonZero>
また、以下コードは、サムネイルではなくimgタグで元画像を表示・alt属性を付加するようにし、コードを更に簡素にしたサンプルです。
<MTIfNonZero tag="AssetCount">
<MTAssets type="image" lastn="10">
<img src="<MTAssetURL>" width="<MTAssetProperty property="image_width">" height="<MTAssetProperty property="image_height">" alt="<MTAssetProperty property="description">" title="<MTAssetLabel>" />
</MTAssets>
</MTIfNonZero>
ブログのアイテム数を取得する
ブログ内のアイテムの数を調べるには、MTAssetCountファンクションタグを用います。
type="image"などというモデファイアをつけて、ファイルの種類別に数えることが可能です。
モデファイアに指定できるオプション一覧
- image
- 静止画像ファイルが対象となります。
- audio
- 音楽ファイルが対象となります。
- video
- ムービーファイルが対象となります。
- file
- それら以外のファイル(テキストファイルなど)が対象となります。
コード
全アイテム数は、<MTAssetCount><br />
画像数は、<MTAssetCount type="image"><br />
imageでもaudioでもvideoでもない(テキストファイルなど)のファイル数は、<MTAssetCount type="file"><br />
イメージのみを取得する
MTAssetsブロックタグにて、イメージ画像のみを取得したいときなどは、type="image"モデファイアを使用します。イメージのみではなく、以下のリストのように音楽のみ、ムービーのみ、それら以外のファイルのみといった取得も可能です。
モデファイアに指定できるオプション一覧
- image
- 静止画像ファイルが対象となります。
- audio
- 音楽ファイルが対象となります。
- video
- ムービーファイルが対象となります。
- file
- それら以外のファイル(テキストファイルなど)が対象となります。
コード
<!-- 全てのアイテムを取得する -->
<MTIfNonZero tag="AssetCount">
<MTAssets>
<MTAssetLabel>
</MTAssets>
</MTIfNonZero>
<!-- 静止画像のみを取得する -->
<MTIfNonZero tag="AssetCount">
<MTAssets type="image">
<MTAssetLabel>
</MTAssets>
</MTIfNonZero>
イメージの幅と高さを取得する
イメージの幅と高さを取得する場合は、MTAssetPropertyファンクションタグへpropertyモデファイアを指定します。
- image_width
- 幅を取得します。
- image_height
- 高さを取得します。
コード
<MTAssets type="image" lastn="10">
イメージ幅:<MTAssetProperty property="image_width"><br />
イメージ高さ:<MTAssetProperty property="image_height"><br />
</MTAssets>
アイテムへのファイルリンクを取得する(1)
アイテムへのファイルリンクを取得する方法です。
MTAssetThumbnailLinkというファンクションタグで、「サムネイル画像のimgタグコードとオリジナル画像へのリンクaタグコードを一式生成」することが可能です。
モデファイアに、height="70"を付加すると、プレビューには高さ70pxのサムネイル専用画像を使用し、何も付加しないと、プレビューにオリジナル画像と同じサイズのサムネイル専用画像を用います。
imgタグには、width、height、alt属性が付加されます。alt属性はファイルの説明・タグに何かの文字を入れている場合でも、なぜか常に空の状態です。
コード
<MTAssets type="image" lastn="10">
サムネイルのimgとオリジナル画像へのリンクaを一式生成(高さ70pxのサムネイル画像でプレビュー):<MTAssetThumbnailLink height="70"><br />
サムネイルのimgとオリジナル画像へのリンクaを一式生成(オリジナル画像と同じサムネイル画像でプレビュー):<MTAssetThumbnailLink><br />
</MTAssets>
アイテムへのファイルリンクを取得する(2)
アイテムへのファイルリンクを取得する方法です。
アイテムへのファイルリンクに必要な情報を全てばらばらに取得し組み立てています。imgタグには、width、height、alt、title属性を付加しています。
コード
<MTAssets type="image" lastn="10">
<a href="<MTAssetURL>"><img src="<MTAssetURL>" width="<MTAssetProperty property="image_width">" height="<MTAssetProperty property="image_height">" alt="<MTAssetProperty property="description">" title="<MTAssetProperty property="label">" /></a>
</MTAssets>
アイテムの種類を調べる
アイテムの種類を調べる方法です。方法は2つあります。
ひとつは、MTAssetTypeファンクションタグです。アイテムの種類を表示します。アイテムの種類によって、「画像」、「音楽」、「映像」、「アイテム」のいずれかの日本語文字列が表示されます。
もうひとつは、MTAssetMimeTypeファンクションタグです。こちらは、アイテムの種類によって、アイテムの MIME Type を表示します。例えば HTML 文書であれば 「text/html」、JavaScriptであれば「application/x-javascript」、イメージであれば「image/jpeg」などと表示されます。
コード
<MTAssets>
種類:<MTAssetType><br />
MIME Type:<MTAssetMimeType><br />
</MTAssets>
アイテムのファイル拡張子を調べる
アイテムのファイル拡張子を調べる方法です。
MTAssetFileExtファンクションタグを用いると、アイテムのファイル拡張子をドット抜きで取得できます。
コード
<MTAssets>
ファイル拡張子:<MTAssetFileExt><br />
</MTAssets>
アイテムのファイルサイズを調べる
アイテムのファイルサイズを調べる方法です。
MTAssetPropertyファンクションタグにproperty="file_size"モデファイアを組み合わせて用いると、アイテムのファイルサイズを取得できます。
更に、formatモデファイアを組み合わせると、バイト単位/キロバイト単位(単位あり)、キロバイト単位/メガバイト単位 で表記します。formatモデファイアを省略している場合は、format="1"(キロバイト(単位あり))と同じフォーマットとなります。
- format="0"
- バイト(単位なし)
- format="1"
- キロバイト(単位あり)
- format="k"
- キロバイト(単位なし)
- format="m"
- メガバイト(単位なし)
コード
<MTAssets>
ファイルサイズ(バイト単位なし):<MTAssetProperty property="file_size" format="0"><br />
ファイルサイズ(キロバイト単位あり(デフォルト)):<MTAssetProperty property="file_size" format="1"><br />
ファイルサイズ(キロバイト単位なし):<MTAssetProperty property="file_size" format="k"><br />
ファイルサイズ(メガバイト単位なし):<MTAssetProperty property="file_size" format="m"><br />
</MTAssets>
アイテムのタグと説明を取得する
アイテムのタグと説明(ディスクリプション)を取得する方法です。
タグは、MTAssetTags ブロックタグのブロック中でMTTagNameファンクションタグを用いて取得できます(つまり複数タグを想定している仕様)。glueモデファイアで区切り文字も指定できます。
説明(ディスクリプション)は、MTAssetDescription ファンクションタグか、あるいはMTAssetProperty ファンクションタグにproperty="label"モデファイアを指定して取得できます。
コード
<MTAssets>
タグ:<MTAssetTags glue=","><MTTagName></MTAssetTags><br />
説明(1):<MTAssetDescription><br />
説明(2):<MTAssetProperty property="label"><br />
</MTAssets>
アイテムの追加日時を調べる
アイテムの追加日時を調べる方法です。
MTAssetDateAddedファンクションタグを用いると、アイテムの追加日時を取得できます。
モディファイア format と language を指定して、日時の表示方法を変更できます。
format と languageモデファイアに関する説明は、以下リンクの「日付フォーマット・アトリビュート」を参照してください。
http://www.movabletype.jp/documentation/date_formats.htmlコード
<MTAssets>
追加日時:<MTAssetDateAdded><br />
追加日時:<MTAssetDateAdded language="en" format="%B %e, %Y %I:%M %p"><br />
</MTAssets>
アイテムのIDを調べる
アイテムのIDを調べる方法です。
MTAssetIDファンクションタグを用いると、アイテムのIDを取得できます。
注意点ですが、アイテムのIDは、必ずしも連番とはなりません。アイテムに連番を振りたい場合は、下記「アイテムの新しい順から連番を与え、そのIDを調べるコード」を参考にしてください。
単にIDを調べるコード
<MTAssets>
アイテムのID:<MTAssetID><br />
</MTAssets>
アイテムの新しい順から連番を与え、そのIDを調べるコード
<MTSetVar name="Inc" value="0">
<MTAssets>
<MTSetVar name="Inc" op="++">
No.<MTGetVar name="Inc">番目のアイテムのID:<MTAssetID><br />
</MTAssets>
アイテムの投稿者を調べる
アイテムの投稿者を調べる方法です。
MTAssetAddedByファンクションタグを用いると、アイテムの投稿者を取得できます。
コード
<MTAssets>
アイテムの投稿者:<MTAssetAddedBy><br />
</MTAssets>
エントリのアイテムを調べる
エントリのアイテムの各種情報を調べる方法です。
サンプルコードのように、エントリのコンテキストにおいてMTEntryAssetsブロックタグを用い、その中でAsset系のファンクションタグを用いることができます。これらはMTAssetsブロックタグと同じ使用法で使えます。
コード
<ul>
<MTEntries lastn="10">
<MTEntryAssets>
<li><img src="<MTAssetThumbnailURL height="70">" class="asset-img-thumb" alt="<MTEntryTitle>" title="<MTEntryTitle>" /></li>
<li>MTAssetThumbnailLink=<MTAssetThumbnailLink></li>
<li>MTAssetThumbnailURL=<MTAssetThumbnailURL></li>
<li>MTAssetType=<MTAssetType></li>
<li>MTAssetURL=<MTAssetURL></li>
<li>MTAssetLabel=<MTAssetLabel></li>
<li>MTAssetLink=<MTAssetLink></li>
<li>MTAssetMimeType=<MTAssetMimeType></li>
<li>MTAssetProperty-file_size=<MTAssetProperty property="file_size"></li>
<li>MTAssetProperty-image_width=<MTAssetProperty property="image_width"></li>
<li>MTAssetProperty-image_height=<MTAssetProperty property="image_height"></li>
<li>MTAssetProperty-label=<MTAssetProperty property="label"></li>
<li>MTAssetProperty-description=<MTAssetProperty property="description"></li>
<li>MTAssetRank=<MTAssetRank></li>
<li>MTAssetScore=<MTAssetScore></li>
<li>MTAssetScoreAvg=<MTAssetScoreAvg></li>
<li>MTAssetScoreCount=<MTAssetScoreCount></li>
<li>MTAssetScoreHigh=<MTAssetScoreHigh></li>
<li>MTAssetScoreLow=<MTAssetScoreLow></li>
<li>MTAssetAddedBy=<MTAssetAddedBy></li>
<li>MTAssetCount=<MTAssetCount></li>
<li>MTAssetDateAdded=<MTAssetDateAdded></li>
<li>MTAssetFileExt=<MTAssetFileExt></li>
<li>MTAssetFileName=<MTAssetFileName></li>
<li>MTAssetFilePath=<MTAssetFilePath></li>
<li>MTAssetID=<MTAssetID></li>
<li>MTEntryPermalink=<MTEntryPermalink></li>
<li>MTEntryTitle=<MTEntryTitle></li>
</MTEntryAssets>
</MTEntries>
</ul>
ウェブページのアイテムを調べる
ウェブページのアイテムの各種情報を調べる方法です。
サンプルコードのように、ウェブページのコンテキストにおいてMTPageAssetsブロックタグを用い、その中でAsset系のファンクションタグを用いることができます。これらはMTAssetsブロックタグと同じ使用法で使えます。
コード
<ul>
<MTPages lastn="10">
<MTPageAssets>
<li><img src="<MTAssetThumbnailURL height="70">" class="asset-img-thumb" alt="<MTEntryTitle>" title="<MTEntryTitle>" /></li>
<li>MTAssetThumbnailLink=<MTAssetThumbnailLink></li>
<li>MTAssetThumbnailURL=<MTAssetThumbnailURL></li>
<li>MTAssetType=<MTAssetType></li>
<li>MTAssetURL=<MTAssetURL></li>
<li>MTAssetLabel=<MTAssetLabel></li>
<li>MTAssetLink=<MTAssetLink></li>
<li>MTAssetMimeType=<MTAssetMimeType></li>
<li>MTAssetProperty-file_size=<MTAssetProperty property="file_size"></li>
<li>MTAssetProperty-image_width=<MTAssetProperty property="image_width"></li>
<li>MTAssetProperty-image_height=<MTAssetProperty property="image_height"></li>
<li>MTAssetProperty-label=<MTAssetProperty property="label"></li>
<li>MTAssetProperty-description=<MTAssetProperty property="description"></li>
<li>MTAssetRank=<MTAssetRank></li>
<li>MTAssetScore=<MTAssetScore></li>
<li>MTAssetScoreAvg=<MTAssetScoreAvg></li>
<li>MTAssetScoreCount=<MTAssetScoreCount></li>
<li>MTAssetScoreHigh=<MTAssetScoreHigh></li>
<li>MTAssetScoreLow=<MTAssetScoreLow></li>
<li>MTAssetAddedBy=<MTAssetAddedBy></li>
<li>MTAssetCount=<MTAssetCount></li>
<li>MTAssetDateAdded=<MTAssetDateAdded></li>
<li>MTAssetFileExt=<MTAssetFileExt></li>
<li>MTAssetFileName=<MTAssetFileName></li>
<li>MTAssetFilePath=<MTAssetFilePath></li>
<li>MTAssetID=<MTAssetID></li>
<li>MTEntryPermalink=<MTEntryPermalink></li>
<li>MTEntryTitle=<MTEntryTitle></li>
</MTPageAssets>
</MTPages>
</ul>
1つのアイテムのIDを指定して情報を取得する
1つのアイテムのIDを指定して情報を取得する方法です。
MTAssetブロックタグを用いると、アイテムのIDをひとつだけ指定して、そのブロックの中でAsset系ファンクションタグを使用することができます。
以下のサンプルはIDが123番のアイテムの情報を取得します。
コード
<MTAsset id="123">
<li>MTAssetURL=<MTAssetURL></li>
<li>MTAssetLabel=<MTAssetLabel></li>
<li>MTAssetLink=<MTAssetLink></li>
<li>MTAssetMimeType=<MTAssetMimeType></li>
<li>MTAssetProperty-file_size=<MTAssetProperty property="file_size"></li>
<li>MTAssetProperty-image_width=<MTAssetProperty property="image_width"></li>
<li>MTAssetProperty-image_height=<MTAssetProperty property="image_height"></li>
<li>MTAssetProperty-label=<MTAssetProperty property="label"></li>
<li>MTAssetProperty-description=<MTAssetProperty property="description"></li>
</MTAsset>
最新の画像を一枚取り出す
アイテムの中から、最新の画像を一枚取り出すサンプルです。
サンプル1
まず、MTAssetsブロックタグへ type="image" lastn="1"モデファイアを指定して「静止画像の中から最新の一枚の画像のみ」を特定し、MTSetVarBlockを用いてNewestAssetID変数へアイテムのIDを代入します。
次にMTAssetブロックタグへ、先に取得した最新画像のID番号を id="$NewestAssetID"というモデファイア指定を行います(※NewestAssetIDは変数参照となるので、先頭へドルマークを付与せねばいけません)。そのブロック内でAsset系ファンクションタグを用いて、画像の表示・リンクコードを作成しています。
このコードを応用すると、「最古の画像を一枚取り出す」、「毎月の最初の画像を一枚取り出す」、「カテゴリごとの代表画像を一枚取り出す」といったことも可能です。
<!-- アイテム中から最新のimage画像のIDを一件取得 -->
<MTAssets type="image" lastn="1">
<MTSetVarBlock name="NewestAssetID"><MTAssetID></MTSetVarBlock>
</MTAssets>
<!-- アイテム中のIDを指定して情報を表示 -->
<MTAsset id="$NewestAssetID">
<a href="<MTAssetURL>"><img src="<MTAssetURL>" width="<MTAssetProperty property="image_width">" height="<MTAssetProperty property="image_height">" alt="<MTAssetProperty property="description">" title="<MTAssetProperty property="label">" /></a>
</MTAsset>
サンプル2
単純にMTAssets ブロックタグにtype="image" lastn="1"モデファイアを指定するだけで、最新画像を取り出すことができます。
<MTAssets lastn="1">
<a href="<MTAssetURL>"><img src="<MTAssetURL>" width="<MTAssetProperty property="image_width">" height="<MTAssetProperty property="image_height">" alt="<MTAssetProperty property="description">" title="<MTAssetProperty property="label">" /></a>
</MTAssets>
指定アイテムと同じタグを持つ他の画像を抜き出す
指定アイテムと同じタグを持つ他の画像を抜き出すサンプルです。
MTAssetブロックタグにID4番を指定し、この画像に対してタグ文字列の取得を行います。タグ文字列はEntTag変数へ代入されます。
次にMTAssetsブロックタグを用い、全ての画像に対して、「タグをLopTag変数へ代入する」、「LopTags変数が空でないかどうかチェックする」、「LopTag変数とAstTag変数が同じかどうかチェックする」という処理を行っています。
コード
<MTAsset id="4">
<MTSetVarBlock name="AstTag"><MTAssetTags><MTTagName></MTAssetTags></MTSetVarBlock>
</MTAsset>
<MTAssets>
<MTSetVarBlock name="LopTag"><MTAssetTags><MTTagName></MTAssetTags></MTSetVarBlock>
<MTIf name="LopTag" ne="">
<MTIf name="LopTag" eq="$AstTag">
<a href="<MTAssetURL>"><img src="<MTAssetURL>" width="<MTAssetProperty property="image_width">" height="<MTAssetProperty property="image_height">" alt="<MTAssetProperty property="description">" title="<MTAssetProperty property="label">" /></a>
</MTIf>
</MTIf>
</MTAssets>
縦横比を保持して全ての画像の幅をそろえる
縦横比を保持したまま、全ての画像の幅をそろえるサンプルです。
UserWidth変数へ任意の値(100と代入すれば100pixel)を指定してやると、MTAssetsブロックタグで取得できる全ての画像幅を指定幅にし、同時に縦横比が変わらないように最適な高さを計算してくれます。
また、UserWidth変数へ0を代入すると、オリジナルサイズで画像を表示します。
計算される画像高さは sprintf="%d" モデファイアで整数に直されます。
コード
<MTSetVar name="UserWidth" value="100">
<MTAssets type="image" lastn="10">
<MTIf name="UserWidth" eq="0">
<MTSetVarBlock name="ImgW"><MTAssetProperty property="image_width"></MTSetVarBlock>
<MTSetVarBlock name="ImgH"><MTAssetProperty property="image_height"></MTSetVarBlock>
<MTElse>
<MTSetVarBlock name="tmpImgW"><MTAssetProperty property="image_width"></MTSetVarBlock>
<MTSetVarBlock name="tmpImgH"><MTAssetProperty property="image_height"></MTSetVarBlock>
<MTSetVarBlock name="ImgH">
<MTGetVar name="tmpImgW" value="$UserWidth" op="/" setvar="Bairitu">
<MTGetVar name="tmpImgH" value="$Bairitu" op="/" setvar="AnsImgH">
<MTGetVar name="AnsImgH" sprintf="%d">
</MTSetVarBlock>
<MTSetVarBlock name="ImgW"><MTGetVar name="UserWidth"></MTSetVarBlock>
</MTIf>
<img src="<MTAssetURL>" width="<MTGetVar name="ImgW">" height="<MTGetVar name="ImgH">" alt="<MTAssetProperty property="description">">
</MTAssets>
サムネイル画像でエントリリスト
サムネイル画像にエントリへのリンクをつけてリスト化を行うサンプルです。エントリリストとして機能します。
以下のような仕様です。
- インデックスページでは全エントリの最新画像を10件
- カテゴリページではそのカテゴリに属するエントリのサムネイルのみ表示
- エントリページではそのエントリが属する同じカテゴリに属するエントリのサムネイルのみ表示
- サムネイル表示画像数は最大10件
このサンプルコードは、インデックスページ、カテゴリページ、エントリページで使用できますが、場合によっては記事の投稿時に再構築されないエントリが出てきますので、インデックスページにのみ適用するのが無難です。
コード
<MTIf name="main_index">
<MTSetVarBlock name="CurCat"><MTCategoryLabel></MTSetVarBlock>
<MTElse>
<MTIf name="category_archive">
<MTSetVarBlock name="CurCat"><MTCategoryLabel></MTSetVarBlock>
<MTElse>
<MTSetVarBlock name="CurCat"><MTEntryCategory></MTSetVarBlock>
</MTIf>
</MTIf>
<MTIfNonZero tag="AssetCount">
<MTSetvar name="counter" value="0">
<MTEntries lastn="0" category="$CurCat">
<MTEntryAssets type="image">
<MTAssetsFooter>
<MTSetVar name="counter" op="++">
<MTSetVarBlock name="EntryLink[$counter]"><$MTEntryPermalink$></MTSetVarBlock>
<MTSetVarBlock name="imagewidth"><$MTAssetProperty property="image_width"$></MTSetVarBlock>
<MTSetVarBlock name="imageheight"><$MTAssetProperty property="image_height"$></MTSetVarBlock>
<MTIf name="imagewidth" gt="$imageheight">
<MTSetVarBlock name="ImageCode[$counter]"><img src="<$MTAssetThumbnailURL height="70"$>" alt="on <$MTAssetProperty property="description"$>:<$MTAssetProperty property="description"$>" title="on <$MTEntryTitle$> : <$MTAssetProperty property="description"$>" /></MTSetVarBlock>
<MTElse>
<MTSetVarBlock name="ImageCode[$counter]"><img src="<$MTAssetThumbnailURL width="70"$>" alt="on <$MTAssetProperty property="description"$>:<$MTAssetProperty property="description"$>" title="on <$MTEntryTitle$> : <$MTAssetProperty property="description"$>" /></MTSetVarBlock>
</MTIf>
</MTAssetsFooter>
</MTEntryAssets>
</MTEntries>
<MTIf name="counter" gt="10">
<MTSetVar name="forcounter" value="10">
<MTElse>
<MTSetVar name="forcounter" value="$counter">
</MTIf>
<MTIf name="counter" gt="0">
<dl>
<dt>Photos</dt>
<dd>
<ul>
<MTFor var="x" from="1" to="$forcounter">
<li class="item">
<a href="<MTGetVar name="EntryLink[$x]">"><MTGetVar name="ImageCode[$x]"></a>
</li>
</MTFor>
</ul>
</dd>
</dl>
</MTIf>
</MTIfNonZero>
エントリリストへ代表画像を付与する
カテゴリリストへエントリリストを展開し、エントリに画像がつけられているときはその中の先頭画像を一枚表示するエントリリストのサンプルです。
以下のような仕様です。
- カテゴリ内のエントリは無条件で全て展開・リスト化される
- エントリに画像が無い場合は単にエントリ名が表示される
- 画像の幅は幅80pixel、高さ60pixel固定
- 画像をクリックするとオリジナル画像を開く
このサンプルコードは、リストにスペースを必要とするため、小規模サイトに向いています。CSSのカスタマイズで見た目を調整するといいです。
コード
<MTTopLevelCategories>
<MTSubCatIsFirst>
<ul>
</MTSubCatIsFirst>
<MTIfNonZero tag="MTCategoryCount">
<li><a href="<MTCategoryArchiveLink>"<MTIfNonEmpty tag="MTCategoryDescription"> title="<MTCategoryDescription>"</MTIfNonEmpty>><MTCategoryLabel> (<MTCategoryCount>)</a></li>
<MTSetVarBlock name="CurCat"><MTCategoryLabel></MTSetVarBlock>
<li><ul>
<MTEntries category="$CurCat">
<MTEntryAssets>
<MTAssetsFooter>
<li><a href="<MTAssetURL>"><img src="<MTAssetURL>" width="80" height="60" alt="<MTAssetProperty property="description">" title="<MTAssetProperty property="label">" /></a></li>
</MTAssetsFooter>
</MTEntryAssets>
<li><a href="<MTEntryLink>"><MTEntryTitle></a></li>
</MTEntries>
</ul></li>
<MTElse>
<li><MTCategoryLabel></li>
</MTIfNonZero>
<MTSubCatsRecurse>
<MTSubCatIsLast>
</ul>
</MTSubCatIsLast>
</MTTopLevelCategories>
カテゴリリストへ代表画像を付与する
カテゴリリストへエントリ中の画像のなかで一番古い画像を一枚、代表画像として表示するエントリリストのサンプルです。
以下のような仕様です。
- 最新画像を代表画像にしたければ、MTEntries のsort_orderモデファイアをascendに変える
- エントリに複数画像がある場合は、そのなかの先頭画像を採用する
- そのカテゴリのエントリ群に画像が一枚もついていない場合は、単にカテゴリのみ表示する
- 画像の幅は幅80pixel、高さ60pixel固定
- 画像をクリックするとオリジナル画像を開く
CSSのカスタマイズで見た目を調整するといいです。
コード
<MTTopLevelCategories>
<MTSubCatIsFirst>
<ul>
</MTSubCatIsFirst>
<MTIfNonZero tag="MTCategoryCount">
<li><a href="<MTCategoryArchiveLink>"<MTIfNonEmpty tag="MTCategoryDescription"> title="<MTCategoryDescription>"</MTIfNonEmpty>><MTCategoryLabel> (<MTCategoryCount>)</a></li>
<MTSetVarBlock name="CurCat"><MTCategoryLabel></MTSetVarBlock>
<li><ul>
<MTEntries category="$CurCat">
<MTEntryAssets>
<MTAssetsFooter>
<li><a href="<MTAssetURL>"><img src="<MTAssetURL>" width="80" height="60" alt="<MTAssetProperty property="description">" title="<MTAssetProperty property="label">" /></a></li>
</MTAssetsFooter>
</MTEntryAssets>
<li><a href="<MTEntryLink>"><MTEntryTitle></a></li>
</MTEntries>
</ul></li>
<MTElse>
<li><MTCategoryLabel></li>
</MTIfNonZero>
<MTSubCatsRecurse>
<MTSubCatIsLast>
</ul>
</MTSubCatIsLast>
</MTTopLevelCategories>
- エントリ
-
- アイテムを取得するリスト
- ブログのアイテム数を取得する
- イメージのみを取得する
- イメージの幅と高さを取得する
- アイテムへのファイルリンクを取得する(1)
- アイテムへのファイルリンクを取得する(2)
- アイテムの種類を調べる
- アイテムのファイル拡張子を調べる
- アイテムのファイルサイズを調べる
- アイテムのタグと説明を取得する
- アイテムの追加日時を調べる
- アイテムのIDを調べる
- アイテムの投稿者を調べる
- エントリのアイテムを調べる
- ウェブページのアイテムを調べる
- 1つのアイテムのIDを指定して情報を取得する
- 最新の画像を一枚取り出す
- 指定アイテムと同じタグを持つ他の画像を抜き出す
- 縦横比を保持して全ての画像の幅をそろえる
- サムネイル画像でエントリリスト
- エントリリストへ代表画像を付与する
- カテゴリリストへ代表画像を付与する
- タグ
-
- .htaccess
- Advantage
- Apache
- Archive
- Asset
- Author
- Authority
- AutoSave
- BackUp
- body
- Bug
- Calc
- Category
- Check
- CMS
- Comment
- Company Site
- Config
- Contact
- CORESERVER
- count
- Create
- Creative Commons
- CSS
- Custom Field
- Date
- Default
- delete
- Designer
- DNS
- Domain
- Entry
- Environment
- Eval
- Example
- Export
- Feature
- Feed
- FFFTP
- File
- Folder
- For
- GetVar
- head
- html
- If
- Image
- Import
- Include
- index
- info
- Install
- key
- keyword
- License
- Local
- Loop
- Management
- Manager
- Meta
- Modifier
- Module
- MTElse
- MTElseIf
- MTFor
- MTGetVar
- MTIf
- MTIgnore
- MTLoop
- MTSeHashVar
- MTSetVar
- MTSetVarBlock
- MTSetVars
- MTSetVarTemplate
- MTUnless
- MySQL
- Navigation
- Next
- op
- Page
- Perl
- php
- PhpMyAdmin
- Ping
- Plugin
- pop
- Previous
- Principle
- push
- ReBuild
- Role
- Sample
- SetUp
- SetVar
- shift
- Spam
- Tag
- Template
- TrackBack
- Trouble
- undef
- unshift
- UpGrade
- UpLoad
- Usability
- Variable
- Version
- WebPage
- Wizard
- Writer
- XAMPP
- XHTML
- XML
- 導入編
- ローカル環境
- サンプル
- トラブル集