Bloggerのタイトルを自在に切り替える

タイトルを好きな形式にして、ページの種類に応じて自在に切り替えます。


タブやウィンドウ、検索結果に表示されるタイトルをBloggerのデフォルトではなく、カスタマイズして、ページごとに分ける方法です。

手順

headタグ内に書きます。

まず、titleタグで囲み、

<title>
</title>

続いて、ページの種類に応じてswitchで切り替えます。view.typeにはfeeditemerrorの3種類しかありません。

<b:switch var='data:view.type'>
<b:case value='feed'/>

<b:case value='item'/>

<b:case value='error'/>

</b:switch>

feedはトップページを含めた、投稿が一覧表示されるページです。

itemは各投稿ページ、静的ページです。

errorはページが存在しない場合です。


feedタイプのページにはさらに種類があるのでifで分けます。

トップページはブログのタイトルを表示したいです。

<b:if cond='data:view.isHomepage'><data:blog.title/></b:if>

年毎、月毎の投稿を表示するアーカイブページの場合です。

<b:if cond='data:view.isArchive'>
  <b:eval expr='data:view.archive.year ? data:view.archive.year + &quot;年&quot; : &quot;&quot;'/>
  <b:eval expr='data:view.archive.month ? data:view.archive.month + &quot;月&quot; : &quot;&quot;'/>
- <data:blog.title/>
</b:if>

ラベルや検索結果の場合。

<b:if cond='data:view.isSearch'>
 <b:eval expr='data:view.search.label ? data:view.search.label + &quot;の記事 - &quot; + data:blog.title : &quot;&quot;'/>
 <b:eval expr='data:view.search.query ? data:view.search.query + &quot;の検索結果 - &quot; + data:blog.title : &quot;&quot;'/>
 <b:eval expr='!data:view.search.label and !data:view.search.query ? data:blog.title : &quot;&quot;'/>
</b:if>

itemタイプとerrorタイプは以下のように

<b:case value='item'/>
<data:blog.pageName/> - <data:blog.title/>
<b:case value='error'/>
Page Not Found - <data:blog.title/>

これが現時点で最適だと思っているコードです。コード全体は以下のようになります。これをheadタグ内に追加すれば、好きな形式でページごとに異なるタイトルを表示することができます。

<title>
<b:switch var='data:view.type'>
<b:case value='feed'/>
<b:if cond='data:view.isHomepage'><data:blog.title/></b:if>
<b:if cond='data:view.isArchive'>
 <b:eval expr='data:view.archive.year ? data:view.archive.year + &quot;年&quot; : &quot;&quot;'/>
 <b:eval expr='data:view.archive.month ? data:view.archive.month + &quot;月&quot; : &quot;&quot;'/>
- <data:blog.title/>
</b:if>
<b:if cond='data:view.isSearch'>
 <b:eval expr='data:view.search.label ? data:view.search.label + &quot;の記事 - &quot; + data:blog.title : &quot;&quot;'/>
 <b:eval expr='data:view.search.query ? data:view.search.query + &quot;の検索結果 - &quot; + data:blog.title : &quot;&quot;'/>
 <b:eval expr='!data:view.search.label and !data:view.search.query ? data:blog.title : &quot;&quot;'/>
</b:if>
<b:case value='item'/>
<data:blog.pageName/> - <data:blog.title/>
<b:case value='error'/>
Page Not Found - <data:blog.title/>
</b:switch>
</title>

コメント

まだコメントはありません。