更新履歴 [2019年08月11日]「Photoshop で塗りの色を変更する」を追加。

トップページ > サイト作成 > CMS > Movable Type 7 でタグの確認と @ 付きタグの使い方

MovableType 7 でタグの確認と @ 付きタグの使い方

「MovableType 7」でブログ記事やウェブページに設定したタグは一覧画面で確認することが可能です。
MovableType のタグには文字列だけのものと、@ が付いたタグの 2 種類あります。

「MovableType 7」で設定したタグを見るには「ダッシュボード -> サイト -> タグ -> 一覧」で確認することが可能で、下図のようにタグの名称とそのタグが使われている記事とウェブページ数もわかります。
サイトを作成した直後の初期状態では「@ABOUT_PAGE」のタグがサンプルとして入っており、別途ウェブページ作成時に任意で入力したものが「テストタグ」です。
参考記事:Movable Type 7 ウェブページにタグを付けて一覧表示する

設定したタグの一覧

@ が付いていないタグと @ が付いているタグとの違いは、@ が無いタグは MovableType 専用タグ(MT タグ)でタグをサイト上に表示する際に出てくるのに対し、@ が付いたタグは表示されません。
反対に @ 付きタグはそのタグ名を個別指定して MT タグで制御することが可能です。
例えば下図のサイトのように初期状態のサイトには(1)で示す「アバウト」のリンクがあり、これはタグ「@ABOUT_PAGE」が設定されかつ公開日が新しいものがリンク設定されるようなテンプレートが予め用意されています。
また、@ 付きタグはサイト上に一覧表示されないので下図(2)で MT タグによるタグ一覧を表示しようとしても表にでてきません。

@付きと@無しタグのサイト事例

リンク「アバウト」をクリックするとサンプルページに遷移し、タグ「@ABOUT_PAGE」を利用した場合の挙動について記載されています。

@付きタグのリンクをクリック

サンプルで用意されているタグ「@ABOUT_PAGE」を設定したウェブページを新たにもう一つ作成します。
「ダッシュボード -> サイト -> ウェブページ -> 新規」から下図の内容で各種内容を入力し、タグには「@ABOUT_PAGE」で登録します。

@ABOUT_PAGEをタグに設定

ウェブページを登録した後、タグを有効化するために再構築を行います。
再構築後に先ほどと同じくリンク「アバウト」をクリックすると今度は新しく作成したウェブページに遷移します。
遷移するページ先が変わったのは、テンプレートに仕掛けがあります。

@ABOUT_PAGEをタグに設定

テンプレート見るには「ダッシュボード -> サイト -> デザイン -> テンプレート」でテンプレート一覧を表示させた後、その中の「ナビゲーション」を選択します。
テンプレート「ナビゲーション」を開くと次のようになっています。

ナビゲーションの中身

<nav role="navigation">
<ul>

<mt:Pages tag="@ABOUT_PAGE" limit="1">
<li><a href="<$mt:PagePermalink encode_html="1"$>">アバウト</a></li>
</mt:Pages>

<li><a href="<$mt:Link template="main_index" encode_html="1"$>">ブログ</a></li>
<mt:Pages tag="@ADD_TO_SITE_NAV">
<li><a href="<$mt:PagePermalink encode_html="1"$>"><$mt:PageTitle$></a></li>
</mt:Pages>

</ul>
</nav>

4 行目の <mt:Pages tag="@ABOUT_PAGE" limit="1"> は MovableType 内に登録されているウェブページの中からタグ「@ABOUT_PAGE」が設定された最新の 1 件を抽出する処理となります。
この limit="1" を 2 に変えるとタグ「@ABOUT_PAGE」が設定された最新の 2 件が抽出されるため、再構築して確認してみます。

指定タグのリンクが2つになる

再構築後のサイトを見ると、先ほどはリンクが 1 つだった「アバウト」が 2 つになり、左のリンクは先ほど作成したコンテンツ、右のリンクは初期作成時に自動生成されるサンプルページに遷移します。