Blogger SEO 優化:自訂網頁標題提升辨識度

Blogger 是 Google 旗下的免費部落格平台,讓用戶輕鬆建立個人網站,直接套用官方版型/主題範本,網站的基礎架構都符合 SEO 規範,唯獨在頁面標題(Title)方面略顯不足。官方版型預設只會將「網站名稱」與「文章標題」當成頁面標題,在瀏覽分類標籤時,無法從分頁標籤列快速判別當前所在頁面,而且文章頁面少了網站名稱,也少了宣傳效果。

查看 Blogger 官方版型(.xml 文件)並搜尋 <title>,將會找到指定頁面標題的程式碼:

<title><data:view.title.escaped/></title>

預設情況下,瀏覽單一文章(或網頁)時,瀏覽器分頁會顯示文章標題;在其他頁面(如首頁、標籤、封存)則一律以網站名稱作為頁面標題。
Blogger 預設的網頁標題呈現方式

若希望增加辨識度與層級感,可使用下面程式碼來重新定義頁面標題的呈現方式。

<b:if cond='data:view.isLabelSearch'>
  <!-- 標籤頁面的網頁標題顯示「標籤名稱 - 網站名稱」 -->
<title><data:view.search.label.escaped/> - <data:blog.title.escaped/></title>
<b:else/> <b:if cond='data:view.isMultipleItems'> <!-- 其他多篇文章頁面(例如首頁、封存頁面)的網頁標題維持預設 --> <title><data:view.title.escaped/></title> <b:else/> <!-- 單一文章或獨立頁面,網頁標題顯示「文章標題 - 網站名稱」 --> <title><data:view.title.escaped/> - <data:blog.title.escaped/></title> </b:if> </b:if>

操作說明

1. 打開 Blogger 管理後台,在左側點選「主題」選擇「編輯 HTML」。(提醒:在修改之前可先備份保存 .xml 文件,以利後續恢復原來版本。)
打開 Blogger 後台,點擊「主題>編輯 HTML」
2. 搜尋 <title> 找到原來的網頁標題程式碼。
搜尋 Blogger 預設的網頁標題 title 程式碼
3. 使用上面的程式碼替換原來的 <title><data:view.title.escaped/></title>,然後儲存編輯。(註:程式碼中的註解文字可選擇刪除。)
使用帶有判斷式的程式碼取代預設指令
4. 修改網頁標題(title)程式碼後,瀏覽文章頁面會在後面加上網站名稱,瀏覽分類頁面則會顯示「網站名稱」:「標籤名稱」。
修改後網頁標題將會顯示名稱,有利於增加辨識度

延伸閱讀:

文章更新:本文最初在 2013 發布,筆者於 2026/06 重新整理內容。