Seesaaブログのタグページをリッチにカスタマイズ

2015/04/18 2015/07/23

Seesaaブログのタグページはデフォルトでは以下のような素っ気ないページですが、
タグ自体はサブカテゴリのように使ったり、違うカテゴリの記事を結びつけたりと色々と使いようはありそうです。

今日はカテゴリページのようなリッチな見た目にタグページをカスタマイズする方法をご紹介しようと思います。
このカスタマイズで下記のような表示になります。(パンくずリストは「SeesaaブログにGoogleに認識されるパンくずリストを追加」のカスタマイズでつきます。)

タグページにAdSense広告を貼るには必須の変更

Seesaaブログのタグページはデフォルトではタイトルと日付のみしか載っていないので、コンテンツ無しとしてAdSenseのポリシー違反となることがあるようです。
この対処としては以下の３つが考えられます。

タグページに広告を貼らない

タグページに広告を貼らなければ、ポリシー違反にはなりません。

コンテンツHTMLの編集で挿入した広告であれば、タグページには表示されません。
注意しないといけないのはサイドバーの広告など自由形式のパーツを使って表示しているページです。

自由形式のパーツはトップページに表示しているとタグページにも表示されるので、トップページでの表示を消す必要があります。

タグページへのリンクを削除

タグを使わないならタグページへのリンクを削除してしまうのもありです。
デザインタグクラウドというパーツをコンテンツから削除すれば、タグページへのリンクがなくなります。

タグページに記事の内容を表示

カテゴリページのように、記事の内容を表示するようカスタマイズすればタグページに広告を貼っても問題ありません。

以下カスタマイズの方法です。

カテゴリページのような見た目にタグページをカスタマイズ

タグページのカスタマイズは全体HTMLの編集となります。

元のHTMLのハイライトしている部分を削除して変更後のHTMLになるようコードを追加します。

元のHTML

<% loop:list_service -%>
<div class="tag-body">
<div class="tag-service"><% tag_service.title %></div>
<div class="tag-search"><a href="<% tag_service.page_url(tag) %>" target="_blank">'<% tag.word %>'&nbsp;でSeesaa全体を検索する</a></div>
<% if:tag_service.service_key eq 'articles' -%>
<% loop:list_data -%>
<div class="tag-article">
<div class="tag-article-title"><a href="<% article.page_url %>"><h2><% article.subject %></h2></a>&nbsp;<span class="tag-article-posted">[<% article.createstamp | date_format("%Y/%m/%d %H:%M") %>]</span></div>
<!--<div class="tag-article-summary"><% article.entire_body | text_summary(240) | tag_strip %></div>-->
</div>
<% /loop -%>

4行目はタグ検索用のリンクですが、Seesaa全体の検索は特に必要なさそうなのでこれも削除しています。

変更後のHTML

<% loop:list_service -%>
<div class="tag-body">
<div class="tag-service"><% tag_service.title %></div>
<% if:tag_service.service_key eq 'articles' -%>
<% loop:list_data -%>
<div class="blog">
<div class="date"><% article.createstamp | date_format("%Y年%m月%d日") %></div>
<div class="blogbody">
<h2 class="title"><a class="title" href="<% article.page_url %>"><% article.subject %></a></h2>
<div class="text"><% article.entire_body | text_summary(240) %><a href="<% article.page_url %>" >続きを読む</a></div>
<div class="posted">posted by <% article.nickname %> at <% article.createstamp | date_format("%H:%M") -%>
<% if:article.accept_comment_show -%>
| <a href="<% article.page_url %>#comment">Comment(<% article.children_count | __or__ | echo('0') %>)</a>
<% /if -%>
<% if:article.accept_tb_show %>
| <a href="<% article.page_url %>#trackback">TrackBack(<% article.tb_count | __or__ | echo('0') %>)</a>
<% /if -%>
<% if:blog.fan_setting.accept_fan %>| <a href="<% blog.fan_regist_url %>" title="このブログの読者になる"><img src="<% site_info.blog_url %>/img/fan_read.gif" alt="このブログの読者になる" border="0" /></a><% /if %>
| <a href="<% blog.fan_blog_reader_url %>" title="更新情報をチェックする"><img src="<% site_info.blog_url %>/img/fan_received.gif" alt="更新情報をチェックする" border="0" /></a>
</div>
</div>
</div>
<% /loop -%>

ソーシャル系のリンクはタグページでは許可されていないようなので設置できませんでしたが、なかなかそれっぽくなったのではないかと思います。