MovableTypeで記事ページに関連記事一覧5件を表示する方法

関連記事矢印MovableTypeで記事ページに関連記事一覧5件を表示できるようにカスタマイズした。参考にしたのはMovableTypeのカスタマイズでは定評ある藤本さんのブログ。
https://www.h-fj.com/blog/archives/2013/01/16-120356.php
カスタマイズ内容は
・同じカテゴリ5件を関連記事として表示
・サムネール画像を左右200ピクセルで表示
である。

▼実際にカスタマイズしたテンプレートの例

<mt:If name="entry_archive">
<$mt:EntryID setvar="entryid"$>
<$mt:SetVar name="count" value="0"$>
<mt:EntryIfTagged>
<mt:SetVarBlock name="Sametags"><mt:EntryTags glue=' OR '><$mt:TagName$></mt:EntryTags></mt:SetVarBlock>
<mt:Entries lastn="6" tags="$Sametags" setvar="related_entries">
<mt:If tag="EntryID" ne="$entryid">
<mt:If name="count" lt="5">

<p style="clear: left"><a href="<$mt:EntryPermalink$>?related_entries">
<MTEntryAssets type="image" lastn="1">
<img class="eyes" src="<$MTAssetThumbnailURL width="200"$>" alt="<$MTEntryTitle$>" style="float: left; margin: 0 20px 20px 0;" />
<mt:Else>
<img class="eyes" src="/img/migiyajirui.jpg" alt="<$MTEntryTitle$>" style="float: left; margin: 0 20px 20px 0;" />
</MTEntryAssets>
<$mt:EntryTitle$></a><!--タグによる関連記事--></p>

<$mt:SetVar name="count" op="++"$>
</mt:If>
</mt:If>
</mt:Entries>
<mt:Else>
<$mt:EntryCategory setvar="Samecat"$>
<mt:Entries lastn="6" category="$Samecat" setvar="related_entries">
<mt:If tag="EntryID" ne="$entryid">
<mt:If name="count" lt="5">

<p style="clear: left"><a href="<$mt:EntryPermalink$>?related_entries">
<MTEntryAssets type="image" lastn="1">
<img class="eyes" src="<$MTAssetThumbnailURL width="200"$>" alt="<$MTEntryTitle$>" style="float: left; margin: 0 20px 20px 0;" />
<mt:Else>
<img class="eyes" src="/img/migiyajirui.jpg" alt="<$MTEntryTitle$>" style="float: left; margin: 0 20px 20px 0;" />
</MTEntryAssets>
<$mt:EntryTitle$></a><!--カテゴリによる関連記事--></p>

<$mt:SetVar name="count" op="++"$>
</mt:If>
</mt:If>
</mt:Entries>
</mt:EntryIfTagged>
<mt:If name="count">
<div class="widget-related-entries widget-archives widget">
【この記事のカテゴリ】<br />
<mt:ParentCategories glue=" &raquo; ">
<a href="<$mt:CategoryArchiveLink$>"><$mt:CategoryLabel$></a>
</mt:ParentCategories>
<h3 class="widget-header">関連記事(同じカテゴリまたはタグの記事)</h3>
<div class="widget-content">
<ul>
<$mt:GetVar name="related_entries"$>
</ul>
</div>
</div>
</mt:If>
</mt:If>
<p style="clear: left"></p>
<hr />

さて、このような関連記事を表示するそもそもの理由はなにか?

目的は、サイト内の回遊性を高めることである。
目標は、直帰率を改善すること。

当サイト内には4000件以上の記事があるが、ほとんどのサイト訪問者はその記事だけを読んで直帰していしまう。関連する記事もぜひとも読んでみてほしい。

このエントリーをはてなブックマークに追加 遠田幹雄のLINE@アカウントを友だち追加  

この記事を書いた人

中小企業診断士:遠田幹雄の顔写真遠田 幹雄(とおだ みきお)
 
経営コンサルティング企業の株式会社ドモドモコーポレーション代表取締役。石川県かほく市に本社があり金沢市を中心とした北陸三県を主な活動エリアとする経営コンサルタントです。
小規模事業者や中小企業を対象として、経営戦略立案とその後の実行支援、商品開発、販路拡大、マーケティング、ブランド構築等に係るコンサルティング活動を展開しています。民民での直接契約を中心としていますが、商工三団体などの支援機関が主催するセミナー講師を年間数十回担当したり、支援機関の専門家派遣中小企業基盤整備機構の経営窓口相談に対応したりもしています。
保有資格:中小企業診断士、情報処理技術者
 
会社概要およびプロフィールは株式会社ドモドモコーポレーションの会社案内にて紹介していますので興味ある方はご覧ください。


この記事のURL「https://dm2.co.jp/2018/04/relatedentries.html」をQRコードで表示
この記事のURL「https://dm2.co.jp/2018/04/relatedentries.html」をQRコードで表示「https://dm2.co.jp/2018/04/relatedentries.html」
パソコンで表示されたページをスマホでも見たい場合は、このQRコードをスマホのカメラ(QRコードが読めるリーダー)で読むとページが表示されます。