中途半端を極める

web関連で役に立ちそうなものを紹介いたします

MovableType

【MovableType】ブログ記事にNEWの文字をつける方法まとめ

投稿日:

MovableTypeでブログ記事を出力する時に「NEW」の文字をつけたい。そういうとき使用するコードをまとめました。
PHP、Javascriptなどを使用して出力します。MovableTypeを使用している人にとっては常識なのかもしれませんが…

PHPを用いて行う場合

MTテンプレートに以下の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>';
}
?>

こちらの場合は7日間Newの文字を出力することができます。

要素にclassをつけて分ける場合は以下のようにします。

<?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"';
}
?>

動的に変更されるため、再構築が不要です。

参考:Movable Typeで最新の記事にNewマークをつける
http://www.iyahooi.com/entry/2009/04/movable_typenew.html

javascriptを用いて行う場合

MTテンプレート

<p><span class="new"><$MTEntryDate format="%Y:%m:%d:%H:%M:%S"$></span></p>
<h1><$mt:EntryTitle$></h1>

CSS

p span.new {
    display: none;
}

javascript

<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>

上記のphpと同じく、再構築が不要です。

参考:MovableTypeで3日以内に投稿された記事に新着マークを付ける方法
http://www.hp-stylelink.com/news/2013/10/20131003-2.php

MTの機能のみで行う場合

以下のようにMTテンプレートを作成します。

<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>

MTのテンプレートがスタティック出力の場合は再構築が必要になります。
ダイナミックまたはDynamicMTMLの場合は動的に更新がされます。

参考:MovableTypeで新着記事に「New!」表示
http://riatw.me/blog/mt_tipcs_newicon.html

-MovableType
-

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)

関連記事

【MovableType】CKEditor for Movable Type 1.075をIE11で利用すると画像がうまく挿入されない。

CKEditor for Movable Type を利用しているとうまく動作しない場合があります。大抵IEを利用している時に起こります。どのように対応すればよいのか調べてみましたので紹介いたします。

【MovableType】フォルダ一覧メニューを表示させる方法

企業サイトなどのサブカラムメニューに使用することが多いかと思います。 以下MTのコードとなります。 (今いるディレクトリの時にclass=”active”を追加するようになって …

【MovableType】ユーザマスター用のロールの設定

MovableTypeでは細かくロールの設定ができます。 自由に記事の編集・投稿、カテゴリ追加・削除、アイテムの管理いろんなことがしたいといったような設定をご紹介します。ただエンドユーザにはテンプレー …

【MovableType】スパムコメントを受け付けなくする方法

スパムコメントの対応でいやな思いをしたことがある人必見 少しの作業で効果てきめんのスパムコメントを紹介いたします。 ※コミュニケーション設定でもある程度は防げますが、設定によっては通常のコメントもスパ …

【MovableType】Can’t call method “label” on an undefined valueエラーの対処法について

突然「MovableTypeが再構築できなくなった!」 と問い合わせがあり、再構築をして確認すると「Can’t call method “label” on an undefi …