前後アイテムページをリンク
このブログでは、アイテムページの下部に前後のページのリンクが「Prev Page、Next Page」と表示されている。
前後ページのタイトル名を表示し、ページ上部に該当ページへのリンクを張る。
リンクに前後ページタイトル名を表示するように変更する。
先頭ページでは、前のページ名はなし。
最終ページでは、次のページ名はなし。
先頭ページでは、前のページ名はなし。
最終ページでは、次のページ名はなし。
当初は、「個別アイテムページ」にコードの挿入を予定していたが、スキン「blueleaves」の「個別アイテムページ」には、単純な追加ではきれいに収まらないので「 skintypes / itempages.php」に挿入する。
「blueleaves / skintypes / itempages.php」に追加
<div class="pageswitch"
<%if(previtem)%><div class="alignleft">« <a title="Prev item" href="<%prevlink%>"><%previtemtitle%></a></div><%endif%>
<%if(nextitem)%><div class="alignright"><a title="Next Item" href="<%nextlink%>"><%nextitemtitle%></a> »</div><%endif%>
</div>
<%if(previtem)%><div class="alignleft">« <a title="Prev item" href="<%prevlink%>"><%previtemtitle%></a></div><%endif%>
<%if(nextitem)%><div class="alignright"><a title="Next Item" href="<%nextlink%>"><%nextitemtitle%></a> »</div><%endif%>
</div>
スタイルシートの記述
<div class=&.pageswitch {
display: block;
text-align: center;
margin: 0 0 15px;
padding: 4px;
font-size: 0.8em;
}
.alignright {
float: right;
}
.alignleft {
float: left;
}
display: block;
text-align: center;
margin: 0 0 15px;
padding: 4px;
font-size: 0.8em;
}
.alignright {
float: right;
}
.alignleft {
float: left;
}
05 May, 2009 | mokimoc
Comments
Leave comments
このアイテムは閲覧専用です。コメントの投稿、投票はできません。