バックナンバーページ

ファイルの保存場所

 ルートディレクトリー
└ templates
 -internals
 ---entry
 ----- └ default.html--------:今回の対象ファイル

テンプレートファイルは都度更新されるので、最新のものを利用するようにしてください。このファイルを編集する際は、構成を大幅に変更することなく、デザインの変更はスタイルシート(CSS)で行ってください。

作業手順

事前にトップページのコーディングが完了している前提で解説します。

トップページの複製

/templates/internals/default/default.htmlの内容をコピーして、/templates/internals/entry/default.htmlの内容を全て削除し、貼り付ける。

不要情報の削除

バックナンバーページにのみ表示したい内容(ニュース部分は必須)を残し、トップページにのみ表示させたい情報(メインビジュアル、バナーなど)を削除する。

IDの削除

<article id="top">
↓
<article>

パンくずリンクの追加

以下のタグを、適切な位置に追加してください。掲載位置に迷う場合(例:CSSの担当をしない場合)は、<main>タグの直前に貼り付けてください。

<nav class="breadcrumb fixbox">
    <ol>
        <li><a href="{$freo.core.http_file}">トップページ</a></li>
        <li><a href="{$freo.core.http_file}/entry">バックナンバー</a></li>
    </ol>
</nav>

ページ送りのタグを追加

ページ下部に以下のタグを追加してください。バックナンバーが増えたときにページを送るためのタグです。

<div class="pager">
    <ul class="order">
        <li class="prev"><!--{if $freo.query.page > 1}--><a href="{$freo.core.http_file}/{if $freo.query.category}category/{$freo.query.category}{else}entry{/if}?page={$freo.query.page-1}{if $smarty.get.word}&word={$smarty.get.word|smarty:nodefaults|escape:'url'}{/if}{if $smarty.get.user}&user={$smarty.get.user}{/if}{if $smarty.get.tag}&tag={$smarty.get.tag|smarty:nodefaults|escape:'url'}{/if}{if $smarty.get.date}&date={$smarty.get.date}{/if}">前のページ</a><!--{else}-->前のページ<!--{/if}--></li>
        <li class="next"><!--{if $entry_page > $freo.query.page}--><a href="{$freo.core.http_file}/{if $freo.query.category}category/{$freo.query.category}{else}entry{/if}?page={$freo.query.page+1}{if $smarty.get.word}&word={$smarty.get.word|smarty:nodefaults|escape:'url'}{/if}{if $smarty.get.user}&user={$smarty.get.user}{/if}{if $smarty.get.tag}&tag={$smarty.get.tag|smarty:nodefaults|escape:'url'}{/if}{if $smarty.get.date}&date={$smarty.get.date}{/if}">次のページ</a><!--{else}-->次のページ<!--{/if}--></li>
    </ul>
    <!--{if $smarty.get.word or $smarty.get.user or $smarty.get.tag or $smarty.get.date or $smarty.get.category}-->
    <ul class="direct">
        <!--{section name='loop' loop=$entry_page}-->
        <li><!--{if $smarty.section.loop.iteration != $freo.query.page}--><a href="{$freo.core.http_file}/{if $freo.query.category}category/{$freo.query.category}{else}entry{/if}?page={$smarty.section.loop.iteration}{if $smarty.get.word}&word={$smarty.get.word|smarty:nodefaults|escape:'url'}{/if}{if $smarty.get.user}&user={$smarty.get.user}{/if}{if $smarty.get.tag}&tag={$smarty.get.tag|smarty:nodefaults|escape:'url'}{/if}{if $smarty.get.date}&date={$smarty.get.date}{/if}">{$smarty.section.loop.iteration}</a><!--{else}-->{$smarty.section.loop.iteration}<!--{/if}--></li>
        <!--{/section}-->
    </ul>
    <!--{/if}-->
</div>

h1タグの変更

以下を例に、h1を適切な文言に変更してください。また、掲載位置も必要であれば変更してください。

<h2>お知らせ</h2>
↓
<h1>バックナンバー</h1>

エントリーのテスト登録

表示確認をするために、freoにログインをして、エントリーを8件登録してください。添付ファイルありのものや、添付ファイル無のものなど、今後の運用で出てくるイレギュラーをなるべく出さないために、様々なエントリーで動作を確認するためです。