ホームBlog2014年Movable typeでタグから関連記事をリスト表示してみる  
2014年03月09日 14:33 ~ Movable Type ~
Movable typeでタグから関連記事をリスト表示してみる

今回はレンタルブログなどでは当たり前のように採用されている、投稿記事に含まれたキーワードをもとに類似・関連した記事を動的にリストアップするシステムを、今回当サイトにも入れてみました。


その備忘録を紹介します。
Movable typeでタグから関連記事をリスト表示してみる
 
 
今回は、Movable typeの記事投稿画面の「タグ」の入力内容から関連記事を拾い出すやり方にしてみました。

テンプレートの構造はこんな感じです。
Movable typeでタグから関連記事をリスト表示してみる
大まかなブロックは3段階です。

それでは、一つ一つ解説していきます。
 
 
<第1ブロック>
Movable typeでタグから関連記事をリスト表示してみる
1.<MTSetVarBlock>タグで、記事に使用されたタグ情報を取得させます。

今回、変数名は「Tag_list」とします。
2.<MTSetVarBlock>タグ内に、タグをリストアップさせるため<MTEntryTags>でくくります。

タグは複数登録されているでしょうから、glueは「 OR 」とします。

※「 AND 」にしまうと関連記事をリストアップしづらくなるのでおススメできません。

※「OR」と入力する際、両側に半角スペースを入れてください。 例→glue=" OR "

→入れないと再構築時にエラーが出ます。
3.<$MTTagLabel$>で登録されているタグが吐き出されます。

そして変数「Tag_list」に代入されます。

これで第1ブロックは完了です。 
 
 
 
<第2ブロック>
Movable typeでタグから関連記事をリスト表示してみる
1.表示したい個所に、ブロックタグ<MTEntries>でくくります。
2.<MTEntries>内に第1ブロックで、代入されたタグを呼び出すようにします。

<MTEntries tags="XXX">は、特定のタグが含まれた記事のみを抽出して呼び出す働きをします。

XXXの部分に、先ほど作った変数名「Tag_list」が入ります。

※変数名の前に$をつけること  例:tags="$tag_list"
3.あとは、いつものアーカイブ一覧と同じように<$MTEntryTitle$>や<$MTEntryDate$>、<$MTPermalink$>など必要なファンクションタグを入れます。

第2ブロック完了です。 

それではプレビューで見てみましょう。
 
 
Movable typeでタグから関連記事をリスト表示してみる
うんうんタグ内容にふさわしい関連記事が出てきた・・・。

これで完成と思ったら・・・。

表示中の記事まで関連記事としてリストアップされてしまっているorz

さらに改良する必要があります。
 
 
 
<第3ブロック> 
Movable typeでタグから関連記事をリスト表示してみる
第2ブロック、つまり<MTEntries tags="$変数名">の前に第3ブロックとして上記のMTタグで構成します。

今回は、記事一つ一つに動的に与えられる<$MTEntryID$>を基に表示中の記事なのか?、そうでないのか?を識別させます。

まずは、表示中の記事IDを取得させます。

1.<MTSetVarBlock>で今度は、「ThisID」という変数名を用意します。
2.<$MTEntryID$>を呼び出して値を変数「ThisID」に代入させます。

これで第3ブロックは完成です。 
 
 
 
<第2ブロック改良>
Movable typeでタグから関連記事をリスト表示してみる
第3ブロック同様で、今度はタグの内容に合わせて抽出させようとしている記事の<$MTEntryID$>を取得させるようにします。
1.<MTEntries>内<MTSetVarBlock>をくくります。

今度の変数名は「ListID」とします。
2.<$MTEntryID$>を呼び出して値を変数「ListID」に代入させます。
3.ここで<MTIf>が登場します。

第3ブロックで用意した表示中の記事IDが入った変数「ThisID」、第2ブロックで用意した抽出記事IDが入った変数「ListID」の判別を行います。

<MTIf name="変数A" ne="$変数B">とは、「変数Aが変数Bと一致しなかったら・・・」という意味を持っています。

よってIDが一致しなかったら記事情報(<$MTEntryTitle$>、<$MTEntryDate$>など)をリスト表示するという指令を送る仕組みになるわけです。

そしてIDが一致したらその記事はリスト表示から除外されることになるのです。
 
っで再度、プレビューをしたいと思います。
 
Movable typeでタグから関連記事をリスト表示してみる
これで関連記事リストに表示中の記事が掲載されなくなりました。

これで完成となります。
 

関連ワード: Movable typeWebタグブログ備忘録

  
 
2015年08月14日 01:23 ~ Movable Type ~
【テスト】Movable type6シリーズにバージョンアップ
2015年06月27日 14:43 ~ Photoshop ~
超絶簡単 Photoshopでステンレス板を作ってみた
2015年03月20日 01:11 ~ Photoshop ~
簡単! すぐに出来る Photoshopで地球を作ってみよう
カテゴリー

撮影記
鉄道2011(4)
鉄道2012(17)
鉄道2013(5)
鉄道2014(60)
鉄道2015(46)
鉄道2016(25)
鉄道2017(26)
鉄道2018(26)
夜景(37)
その他写真(2)
鉄道トピックス
東京メトロ(4)
東武(3)
Web備忘録
Photoshop(3)
Fireworks(1)
Movable Type(4)
WordPress(1)
Flash(1)
雑記
カメラ(2)
イベント情報(1)
鉄道模型(2)
Web(4)
プライベート(21)
パソコン(1)
年間記事

2023年(1)
2022年(1)
2021年(5)
2020年(1)
2019年(24)
2018年(35)
2017年(2)
2016年(41)
2015年(46)
2014年(71)
2013年(14)
2012年(41)
2011年(14)
話題のワード

東武
東急
チームF
イベント
東上線
東横線
車両基地
ヘッドマーク
副都心線
西武
夜景
撮影会
ラッピング
半蔵門線
田園都市線


Powered by Movable Type Pro 6.2

Today:
Yesterday: