MovableTypeでブログ記事を出力する時に「NEW」の文字をつけたい。そういうとき使用するコードをまとめました。
PHP、Javascriptなどを使用して出力します。MovableTypeを使用している人にとっては常識なのかもしれませんが…
PHPを用いて行う場合
MTテンプレートに以下のPHPを埋め込みます。
[php]
<?php
$dispday = 60 * 60 * 24 * 7; //何日間表示させるか
$entrydate = strtotime( ‘<mt:entryDate format="%Y/%m/%d %H:%M:%S" /><mt:blogTimeZone />’ );
$nowdate = time();
if( ($nowdate – $entrydate) < $dispday ){
echo ‘<font color="#ff0000">New</font>’;
}
?>
[/php]
こちらの場合は7日間Newの文字を出力することができます。
要素にclassをつけて分ける場合は以下のようにします。
[php]
<?php
$class="";
$dispday = 60 * 60 * 24 * 7; //何日間表示させるか
$entrydate = strtotime( ‘<mt:entryDate format="%Y/%m/%d" /><mt:blogTimeZone />’ );
$nowdate = time();
if( ($nowdate – $entrydate) < $dispday ){
$class=’ class="new"’;
}
?>
[/php]
動的に変更されるため、再構築が不要です。
参考:Movable Typeで最新の記事にNewマークをつける
http://www.iyahooi.com/entry/2009/04/movable_typenew.html
javascriptを用いて行う場合
MTテンプレート
[html]
<p><span class="new"><$MTEntryDate format="%Y:%m:%d:%H:%M:%S"$></span></p>
<h1><$mt:EntryTitle$></h1>
[/html]
CSS
[css]
p span.new {
display: none;
}
[/css]
javascript
[js]
<script>
// 経過時間(何時間以内の記事に付与するか)
var pass = 168;
// 付与する文字
var content = "NEW";
var currentDate = new Date();
var spans = document.getElementsByTagName("span");
for (i = 0; i < spans.length; i++) {
if (spans[i].getAttribute("class") == "new" ||
spans[i].getAttribute("className") == "new") {
if (spans[i].childNodes[0]) {
time = spans[i].childNodes[0].nodeValue.split(":");
var entryDate = new Date(time[0], time[1]-1, time[2], time[3], time[4], time[5]);
var now = (entryDate.getTime() – currentDate.getTime())/(60*60*1000);
now = Math.ceil(now);
if(-now <= pass){
spans[i].innerHTML = content;
spans[i].style.display = "inline";
}
}
}
}
</script>
[/js]
上記のphpと同じく、再構築が不要です。
参考:MovableTypeで3日以内に投稿された記事に新着マークを付ける方法
http://www.hp-stylelink.com/news/2013/10/20131003-2.php
MTの機能のみで行う場合
以下のようにMTテンプレートを作成します。
[html]
<mt:ignore>/* 再構築をした日付を起点に7日分のエントリーidを取得 */</mt:ignore>
<MTEntries days="7">
<mt:entryid setvar="current_id">
<MTSetvarBlock name="entryids" function="push" key="$current_id">dummy</MTSetvarBlock>
</MTEntries>
<mt:ignore>/* エントリーの一覧を出力 */</mt:ignore>
<MTEntries>
<mt:entryid setvar="current_id">
<MTIf name="entryids" key="$current_id">
<span>New!</span>
</MTIf>
</MTEntries>
[/html]
MTのテンプレートがスタティック出力の場合は再構築が必要になります。
ダイナミックまたはDynamicMTMLの場合は動的に更新がされます。
参考:MovableTypeで新着記事に「New!」表示
http://riatw.me/blog/mt_tipcs_newicon.html