※ このページは、「FANBLOG」に投稿していた時のメモ。
メモ帳の目次について
このメモ帳、「覚え書きを兼ねた自由帳」としているのに、「BLOG」の形式のせいか自分で当該メモを探し出すのにとても不便なことに気付いた。とりあえず、目次的なTOPページを作って各記事へのリンクを張ることにした。
TOPページは、それぞれの記事タイトルに”～http://fanblogs.jp/oja/archive/～”のアドレスをリンクにして手動で作った。これで、TOPページにさえ飛べれば目次代わりに使用できる。各記事ページからのアクセスについては、まずは、ブログのカテゴリを利用してTOPページに飛ばせるようにする。
カテゴリの設定について
カテゴリの設定で、「TOP」というカテゴリを作ってTOPページを置くことにした。あとは、その他のカテゴリを自分の好きな順番に並べ、サイドの上部に「カテゴリーアーカイブ」を表示させることで、なんとなくツリー構造っぽいものを表示させることにした。
「TOP」カテゴリ以外はカテゴリ名の最初にスペースを入れることで、表示したときにインデント (と言って良いかのかは甚だ疑問である) が入るようにした。
カテゴリの順番は、「設定」→「カテゴリ設定」から、「表示順」の番号を付け替えることで簡単に並び変えることができた。
サイドバーの修正が終わった（？）ので、次に、各記事ページのヘッダも少し修正して、TOPページへの誘導をかけることにした。
htmlの設定について
「FANBLOG」にアクセスすると、最新(または最終更新)の記事ページが表示される。本当は、ここに、自分で作成したTOPページを常に表示させたかったのだが、どうもうまくいかなかった。色々調べると、公開日時を未来の日付にすると、常に最新記事として任意のページが固定できるようなのだが、未来の日付が表示されないように日付を消すことに少し抵抗があった(各記事の公開日時はなんとなく表示させておきたかった)ので、別の手段をとることにした。そこで、最新記事が表示されることは許容する代わりに、ヘッダに表示されているページが最新記事であることを表示させて、TOPページへの誘導リンクを張り付けることにした。
htmlの編集画面は、以下から開くことができた。
ここで、htmlに以下の修正を加えた。
<!– Content –>
<% if:page_name eq ‘index’ -%>
<!–ここから追加–>
<div class=”navi”>
[このメモ帳の最新記事] | <a href=”http://fanblogs.jp/oja/archive/22/0″>TOP</a>へ</div>
<!–ここまで追加–>
<!– ここから削除
<% if:free_space -%>
<div class=”entry”>
<table width=”100%”>
<tr>
<td class=”entry_text”>
<div class=”entry_layer”><% free_space | nl2br -%></div>
</td>
</tr>
</table>
</div>
<% /if:free_space -%>
<% if:pager.need_pager -%>
<div class=”navi”>
<% if:pager.previous_page %>
<a href=”<% blog.page_url(pager.previous_page) | html %>”><<前の<% blog.index_page_cnt %>件</a><% else %>-<% /if %>
<% loop:list_pager %><% if:pager.show_previous_group(pager_number,5) %>..<% /if %><% if:pager.show_page(pager_number,5) %> <% if:current_page ne pager_number %><a href=”<% blog.page_url(pager_number)%>”><% /if %><% pager_number %><% if:current_page ne pager_number %></a><% /if %><% /if %><% if:pager.show_next_group(pager_number,5) %>..<% /if %><% /loop %>
<% if:pager.next_page %><a href=”<% blog.page_url(pager.next_page) %>”>次の<% blog.index_page_cnt %>件>></a><% else %>-<% /if %>
</div>
<% /if -%>
ここまで削除–>
TOPページから各記事ページに飛ぶと、デフォルトでは、ページ上部に、<< 1 2 3 ・・・などのpagerが表示されるが、上記のように全てコメントアウトした。その代わりに、"TOP"ページへのリンクもつけて、当該記事のカテゴリが表示される (たとえば 「TOP / ブログ」の) ように、各ページのヘッダも以下のように修正した。
<% if:page_name eq ‘article’ -%>
<!–以下を追加–>
<div class=”navi”>
<a href=”http://fanblogs.jp/oja/archive/22/0″>TOP</a>
<% if:style.disp_category %> / <a href=”<% article.category.page_url %>”><% article.category.name %></a>
<% /if %>
</div>
<!– ここから削除
<div class=”navi”>
<% if:previous_article -%><a href=”<% previous_article.page_url %>”><<</a> <a href=”<% previous_article.page_url %>”><% previous_article.subject | tag_break %></a> | <% /if -%>
<a href=”<% blog.page_url %>”>TOP</a>
<% if:next_article -%> | <a href=”<% next_article.page_url %>”><% next_article.subject | tag_break %></a> <a href=”<% next_article.page_url %>”>>></a><% /if -%>
</div>
ここまで削除–>
その他
ヘッダの表示をカテゴリ表示だけにしたので、スペースがかなり空いてしまった。ヘッダのスペースなどの調整は、「FANBLOGの配色の変更について」でもメモした css を以下のように編集して行った。
/* ヘッダー */
div#header {
display:block;
width:950px;
/* height:212px; ←ここをコメントアウト*/
height:150px; /*←ここを修正*/
margin:0 auto;
}
何回かプレビューを見ながら、適当にヘッダスペースを修正して、一通りの修正を終えた。
ヘッダの表示の中で、カレンダーの日付などにリンクされているdailyやmonthlyのarchiveページについては、その記事のカテゴリを表示させる方法が分からなかった。仕方がないので、”TOP”ページのリンクのみを表示させることにしたのだが、また調べてみようと思う。
あまりこのブログをスマートフォンで見ることはあまりないのだが、たまたま通勤時にこのブログを見てみたところ・・・ スマートフォン用のページはPC用のページとは異なる上に、サイドも表示されないので、せっかく作ったTOPページへの誘導が何もないことに気付いた。。。 スマートフォン用のhtmlの変更の仕方を調べたのだがよく分からず、結局、記事の最初と最後に「OJAのメモ帳 -TOP-」なるリンクを作ることにした。おかげで、TOPページへのリンクだらけになってしまった。もっと色々と勉強して、ちゃんと整理したいと思う。
スポンサーリンク