內容目錄
歡迎回到鵠學苑 — WordPress 網頁設計超詳細攻略 – 使用 Google 自訂搜尋 引擎 取代 WordPress 站內搜尋，站內搜尋功能是架設網站時相當重要的環節，不僅是對 SEO 搜尋引擎優化網站排名有直接的影響，也與網站載入速度息息相關，會這樣描述的原因在於建立站內搜尋功能可以提高搜尋引擎對網站的識別度，更有機會在 SERP (搜尋結果頁)中直接顯示包含站內搜尋框的 Rich Snippets (複合式摘要)，而網站速度的部分是因為如果是使用WordPress內建站內搜尋功能，當網站內容變多的時候，容易造成站內搜尋無法正常執行的狀況。
因此在這篇教學中，要教導大家的就是如何申請Google 自訂搜尋來取代站內搜尋，改用Google 自訂搜尋的理由有以下幾點：
1.透過關鍵字查找網站內容更為容易，不需要完全相符的關鍵字才能夠找到。
2.使用外部搜尋引擎能減輕網站負擔。
3.站內搜尋的完整度以及實用性有利於使用者網站體驗。
4.可以在Google繁體中文的自訂搜尋後台編輯搜尋結果頁面
5.提升網站 SEO 友善度。
另外特別提醒的是如果要使用Google自訂搜尋，必須確定網站內容在Google 資料庫中已經建立足夠數量的網頁索引，否則會無法顯示搜尋結果，因此建議在安裝前可以在 Chromex瀏覽器網址列中輸入指令 Site:網站網址 來查詢網站已被索引的頁面數量，再來決定是否要使用Google 自訂搜尋。
下面是 Google 官方網站對於Google 自訂搜尋的影片介紹，可以點擊直接觀看。
(小提醒：鵠學苑的所有教學均是以 Apple Mac OS X 系統 做步驟示範！)
Google 自訂搜尋申請網址
https://cse.google.com/cse/all
第一步：進入到Google 自訂搜尋申請網址，在右上角點選建立自訂搜尋引擎，就會進入到圖二畫面，有幾個欄位必須填寫：
1.要搜尋的網站：輸入想要置入Google 自訂搜尋引擎完整的網站網址。
2.語言：選擇Google 自訂搜尋顯示的語言，通常與網站主要語言一致。
3.搜尋引擎名稱：這個欄位可以自定義，可以是網站名稱或者企業名稱，對後續設定不影響。
在進階選項的部分是指如果網站有使用結構化資料，是否要在搜尋結果中只顯示自定義的複合式資訊搜尋結果，比如具有星級評等，推薦商品圖片等，可以自行決定。如圖三筆者示範的設定方式，完成後點擊建立按鈕。
第二步：建立完成後 Google 會自動產生自訂搜尋引擎的 JavaScript 程式碼，在下圖中點擊取得程式碼，如圖二所示就會看到可以複製的 JavaScript 程式碼，在複製的時候請注意是否有完整選取，
第三步：筆者想要在文章頁面的側邊欄加入Google自訂搜尋，取代 WordPress 站內搜尋功能，因此進入到外觀 → 小工具中找到自訂 HTML 的欄位，加入到想要顯示的位置，自定義標題內容以及貼上剛剛複製的 JS 程式碼。當然應用方法有很多種，如果說想要單獨建立一個頁面位站內搜尋，就可以利用網站使用主題所提供的建構器中 HTML 的區塊工具來加入，也可以在網站主選單或頁尾資訊的位置置入自訂搜尋，操作方式可以參考 WordPressr 教學 中相關的文章。
第四步：如下圖所示已成功加入Google自訂搜尋到文章分類側邊欄中。
設定–基本資訊：Google自訂搜尋在置入網站後，有許多可以客製化的設定選項，在第二及第三小節會一一介紹。登入 Google 帳號後可以看到剛剛建立自訂搜尋引擎的專案名稱，點擊後如圖二所示，在基本資訊的頁籤中可以設定搜尋引擎說明、關鍵字、語言、也可以新增想要搜尋的網站，比較簡單的設定就不做太多介紹，特別說明的是如果想要在自訂搜尋中提供圖片搜尋結果，可以將圖片搜尋選項開啟( 圖二紅色方框標示處)，如圖三所示會在自訂搜尋結果中顯示圖片的搜尋結果。
設定–管理員：如果網站具有多位共同管理者，可以在這裡新增帳號，方式是透過增加電子信箱的方式來為編輯Google自訂搜尋引擎增加管理人員，特別注意的是新增的管理員電子信箱必須是其登入Google帳號所使用的電子信箱，必須要相同的電子信箱才能夠為新管理員通過驗證及開啟權限。特別一提的是，新增的管理員不具有以下權限：
輸入新管理員的Google帳號申請的電子信箱。
新增後管理員的初始狀態為未驗證。
在新管理員的Google Gmail 信箱中會收到邀請共同編輯自訂搜尋引擎的通知。
新管理員登入google帳號後，進入到自訂搜尋引擎的網頁，將會跳出如上圖的通知，選擇讓我成為管理員並點選儲存後，即完成驗證。
設定－進階：這一部分是透過編輯 XML 或 TSV 文件內容來為自訂搜尋添加註解，必須對於程式語言有一定的了解，並且熟悉於 XML 或 TSV 語法編輯方式。在此頁上都有詳細的規則說明，可以參照 Google Defining Sites to Search 這一篇解說指南。
設定–進階–自訂搜尋引擎註解：在這一部分可以下載 TSV 的文件檔做編輯，其用途在於加入大量網站進入Google自訂搜尋引擎中，讓搜尋結果可以呈現除本站外的內容，而操作方法就是點選下載(TSV)的按鈕，會得到名為 annotations.tsv 的檔案，使用文字編輯器打開後就會看到如下圖中最大紅色方框標示的內容，寫入的方式是使用 _cse_5wrqewcnbdm 標記要加入的網站， _cse_exclude_5wrqewcnbdm 標記排除的網站，完成點選 新增 按鈕將檔案上傳，接著點選 在瀏覽器中檢視 來驗證 TSV 檔案是否編輯正確且上傳成功，如此就可以達成批量加入外部網站資料在搜尋結果中的目的。
要特別提醒的是，標記排除網站是要符合有選擇 基本資訊 → 搜尋的網站 → 搜尋整個網路，但特別強調收錄的網站 這一條選項，才會使用到，為的是排除特定網站內容在站內搜尋中出現，如下圖所示。
設定–進階–自訂搜尋引擎內容：使用 XML 來定義搜尋引擎的主要語言、外觀樣式、分類標籤、篩選條件等，也就是説在Google自訂搜尋設定面板中所有的選項，可以透過寫入 XML 語法來上傳，對於熟悉程式語言的人來說，是比較快速的方法可以去定義站內搜尋，不需要逐條逐項的去尋找設定，如果說對於寫入 XML 不熟悉也沒關係，只要透過Google自訂搜尋設定面板一樣可以達到同樣的效果。
外觀與風格–版面配置：可以選擇自訂搜尋結果的呈現方式，操作方法是選擇完版面配置後，要點選儲存並取得程式碼，重新複製貼上到網站想要顯示搜尋引擎的位置，其變動才會生效，可自行試用看那一種呈現方式最適合網站使用。
外觀與風格–主題：搜尋結果列表的整體配色，這裡提供預設好樣板可以快速選擇。
外觀與風格–自訂：在這個頁面中可以針對搜尋框、按鈕、搜尋結果標題、描述片段、分類項目、篩選標籤、置頂查詢等文字顏色的部分做自定義，可以使用進位制色碼表，也可以點選小方框定義顏色。
外觀與風格–縮圖：如果點選開啟，就會在搜尋結果列表中顯示縮圖，如果說是以銷售商品為主的網站建議要打開，可以讓使用者更好識別商品樣式。
搜尋功能–置頂查詢：這裏可以設定在搜尋結果中排序第一顯示的網頁，如圖二中設定的方式，可以應用在特定商品促銷活動時，也可以讓最新文章置頂在搜尋結果中，等於是自訂站內廣告，就筆者的觀點來看，善加利用此功能可以達到不錯的行銷宣傳目的。
搜尋功能–限制條件：在搜尋結果的頁面中加入條件限制，讓使用者可以根據需求直接點選條件頁籤，就可以透過條件縮小搜尋範圍，讓使用者得到更精準的搜尋結果。好比說假設使用者想找尋女裝上衣，當我們有在搜尋結果上加入羊毛上衣、無袖上衣等條件時，使用者可以根據這些條件來查看在女裝上衣所具有的款式，對於使用者來說省去查看大量搜尋結果的時間，這也是自定義搜尋引擎的優勢之一。
搜尋功能–同義字：同義字可擴大搜尋結果範圍，為搜尋關鍵字詞設定多組同義字，在搜尋結果中會呈現包含同義字的所有相關內容，可以提供更多的選項給使用者。
搜尋功能–進階–搜尋結果排序：除了使用日期、價格來排序或篩選搜尋結果，也可以加入特定字詞作為排序塞選的索引項目。
加入 WordPress基礎 作為排序依據的索引
在排序依據的選單中就多了 WordPress 基礎的選項可以作為篩選條件，並且會在搜尋結果中優先顯示。
統計資料與紀錄–稽核紀錄：在這個頁籤中可以看到所有修改的歷程，可以知道自訂搜尋做了哪些修改以及是由誰所發布的變更，能更精確的掌握自訂搜尋的執行模式。另外在統計資料中可以查看自訂站內搜尋依據不同時間長度的使用狀況，也可以設定Google Analytics (分析)參數來連結查詢資料，更好的掌握網站內熱門查詢字詞，以作為網站 SEO 操作參考。
在加入Google自訂搜尋的過程中，會遇到一些問題，比如説預設Google自訂搜尋框樣式與主題衝突，出現很多層框線顯示，或者在站內搜尋結果中會顯示Google相關廣告等，而在Google自訂搜尋網頁的選項中卻無法針對這些問題做細項的設定，此時可以透過寫入CSS程式碼來設計Google自訂搜尋的樣式與網站主題符合，如果說想要進一步的了解，可以與我們聯絡提出需求與問題，也可以持續追蹤鵠學苑，後續會有相關教學文章跟大家分享！今天的教學到這裡告一段落了，想學習超詳細的WordPress攻略嗎？？來 鵠學院 就對了！我們下次的教學見～
網站架設打造高流量的形象網站細節及關鍵因素！
無障礙網站介紹－規範說明、檢測工具與操作影片
Google 演算法更新，使用者搜尋後將出現多樣性的網站內容