MTタグ逆引き辞典

フォルダのトップページをカスタムフィールドで実現する

テーマPublic Organizationにも実装されているのですが、フォルダを作ってウェブページを作成していく場合、フォルダ/でアクセスした場合のindexページが必要な場合があります。

フォルダトップ

今回はその実装、運用方法をご紹介します。

まず、ウェブページにカスタムフィールドを追加します。

設定のポイントは以下になります。

  • システムオブジェクト:ウェブページ
  • タイプ:チェックボックス
  • 必須:チェックを入れない
  • 既定値:チェックを入れない
  • 識別子:folder_top

テンプレート記述例

次に実際にアーカイブテンプレートのウェブページへの実装例です。

        <div class="container">
        <$mt:PageBody$>
        <$mt:PageMore$>
        <mt:If tag="CustomFieldValue" identifier="folder_top">
        <$mt:Include module="folder-pages"$>
        </mt:If>
        </div>

ポイントはmt:PageBodymt:PageMoreの直後に条件分岐で表示させるようにすることによって、フォルダのトップにしたいウェブページの説明文などを記述した上でその下にフォルダ配下のウェブページを自動的に表示する、というところになります。

mt:Ifでカスタムフィールドの識別子folder_topの値が1のときにfolder-pagesというモジュールを読み込んで表示する、という条件を指定しています。

foder-pagesの中身は以下になります。

<div id="page-list" class="focus-group">
<mt:SetVarBlock name="page_folder"><mt:PageFolder><$mt:FolderLabel encode_html="1"$></mt:PageFolder></mt:SetVarBlock>
<$mt:PageID setvar="id"$>
<mt:IfFolder>
  <mt:Pages sort_order="ascend" folder="$page_folder" field:folder_top="0">
  <a href="<$mt:PagePermalink$>"> 
  <div class="page focus-block">
  <mt:If tag="PageID" ne="$id">
    <div class="row">
      <div class="columns small-12 medium-4">
        <img src="<mt:If tag="CustomFieldValue" identifier="main_image_page"><mt:CustomFieldAsset identifier="main_image_page"><$mt:AssetThumbnailURL width="480"$></mt:CustomFieldAsset><mt:Else><mt:EntryAssets type="image" sort_order="ascend" limit="1"><$mt:AssetThumbnailURL width="480"$><mt:Else><$mt:BlogRelativeURL$>images/noimage-s.jpg</mt:EntryAssets></mt:If>" alt="" />
      </div>
      <div class="columns small-12 medium-8">
        <h3><$mt:PageTitle encode_html="1"$></h3>
        <p><$mt:PageExcerpt words="70"$></p>
      </div>
    </div>
  </mt:If>
  </div>
  </a>
  </mt:Pages>
<mt:SubFolders>
  <div class="row">
    <h3><$mt:FolderLabel encode_html="1"$></h3>
    <mt:Pages sort_order="ascend">
      <div class="columns small-12 medium-6">
      <a href="<$mt:PagePermalink$>"> 
        <div class="page focus-block">
        <mt:If tag="PageID" ne="$id">
          <h4><$mt:PageTitle encode_html="1"$></h4>
          <p><$mt:PageExcerpt words="70"$></p>   
        </mt:If>
        </div>
      </a>
      </div>
    </mt:Pages>
  </div>
<$mt:SubFolderRecurse$>
</mt:SubFolders>
</mt:IfFolder>
</div>

そのウェブページが属するフォルダにあるウェブページ一覧を表示し、さらにサブフォルダのウェブページ一覧も表示する、といった処理をしています。

実際の利用・運用方法

フォルダ配下のトップに設定する場合には、ウェブページの編集画面で作成したカスタムフィールドにチェックを入れ、フォルダを選んだ後にファイル名をindexに指定するという方法となります。
※ フォルダの一番上に表示するには、現状は公開日を同じフォルダ内のウェブページの中で一番早い(過去)日時にするなど調整してください。

使用したMTタグはこちら

Movable Type.net は無料トライアルが可能です。
Web制作者の方で、デモや評価利用をご希望の場合は、制作者向け評価ライセンスをご利用ください。

無料トライアル 資料ダウンロード 制作者向け評価ライセンス