Custom Search Element 使用Ajax效果，節省版面的Google自訂搜尋！

發表時間： 2009-08-10

Google搜尋一直在進化，除了提供廣大的網際網路搜尋外，也推出個人網站的站內搜尋，當然還提供API讓使用者可以開發酷炫的Ajax效果搜尋功能，讓大家有多項選擇。這回，Google推出了更棒的Ajax效果搜尋引擎，讓你免API、免外掛，透過「Custom Search Element」點個幾下就可以擁有個人網站搜尋引擎囉！

在WordPress中，若是想要使用Google搜尋引擎當成站內搜尋基本上有兩種模式，一種是採用外掛，另一種是採用Google CSE自訂搜尋，當然這兩種各有優缺點。採用外掛的缺點是載入時會有點卡；若是使用自訂搜尋，則須要找個頁面來給搜尋引擎用，這樣才能看起來好看些，但是搜尋結果顯示速度不如外掛版的Google搜尋。

不久之前看到Google的自訂搜尋似乎與Api版的結合變成「Custom Search Element」，不僅讀取速度快，完全使用Google 資源，設計採延遲載入，不影響網站整體載入速度，還可以讓使用者加入多個網站，當然還可以結合Google AdSense來賺取收益喔！不過前提是你網站要開放給Google搜尋引擎進入，否則裝了該搜尋引擎，Google也抓不到你網站資料唷！

網站名稱：Google Web Elements-Custom Search Element
網站網址：https://cse.google.com/cse/

由於Custom Search Element提供多種模式的搜尋，為了讓大家好了解，我們就來一一簡單介紹一下各個的不同與簡易的使用方法，大家可以挑選最適合自己網站的搜尋引擎。主要分成三種，分別是「搜尋自己單一網站」、「搜尋單一網站並搭配自己的Google AdSense廣告」、「結合Google自訂搜尋」。

文章目錄

一、搜尋單一網站
二、搜單一網站並搭配Google AdSense
三、結合Google自訂搜尋
張貼搜尋程式碼到部落格

一、搜尋單一網站

在Custom Search Element中的「Configure」部分選擇【Automatically search my site】，接著請將程式碼擺到自己部落格想顯示的地方，一般來說都會擺在側邊欄模組中，放上後到網站首頁看一下，搜尋效果就出來囉！

這組的搜尋引擎語法完全不需調整，因為他會根據你所放置的網站去搜尋該網站的東西，因此您完全不須設定網址或是任何其它設定，系統就會幫你對應好。唯一需要調整的應該是整個搜尋的大小，您可以修改程式碼中的以下這串語法：

<div id="cse" style="width:100%;">

語法中的「width:100%」就是指整個搜尋的寬度是100%顯示，也就是你那區塊有多寬他就會顯示多大，您可以自行修正百分比，調整到最適合自己網站的搜尋效果。

二、搜單一網站並搭配Google AdSense

若您在Custom Search Element中的「Configure」部分選擇【Search my site and use AdSense for Search 】，那您就可以在「AdSense Publisher ID」部分填上您的Google AdsSense發佈商ID，他將會把廣告設定成您帳戶的廣告，若訪客有點擊廣告，其收益將屬於您的。

這個代碼一樣很簡單處理，把他放到您的網站上就可以了，如果有訪客使用該搜尋引擎，他就會將搜尋結果自動鎖定在您的網站上，但如同前面所說，你的網站一定開放給Google搜尋引擎抓，否則這個搜尋就沒用處了。

一樣，您如果覺得整個搜尋太寬了，可以自行修改語法中以下這串，100%的數值您可以自由變更符合您網站顯示的需求。

<div id="cse" style="width:100%;">

如果你不知道怎麼找發佈商ID，這時請先登入到您的Google AdSense帳戶中，仔細注意一下右上角，是不是有一串發佈商ID？該ID的樣式長的像這樣：「pub-16個數字」。這串就是您的發佈商ID，趕快填入剛剛的「AdSense Publisher ID」欄位吧！

三、結合Google自訂搜尋

我想這種方式應該最符合大家的需求，因為我自己也是使用這種模式。它可以幫您整合原本的自訂搜尋，換句話說，您使用Custom Search Element這種模式的搜尋一樣可以看到Google自訂搜尋幫您統記的資料，是不是很方便呢？

來到Custom Search Element中，在「Configure」部分請選擇【Use an existing custom search engine】，接著在「Custom Search ID」部分輸入您的自訂搜尋那串代碼，最後將程式碼複製到網站上貼在想顯示的地方就可以囉！

如果你不知道Google自訂搜尋的那串代碼，那請登入您的Google自訂搜尋，進入後請找到您的搜尋引擎並點擊「控制台」，進入設定畫面後，點擊左方的「取得程式碼」，在程式碼中有一串類別名稱為「cx」，其後方應該有串「數字:英文數字」的代碼，沒錯就是那串，請將該串代碼填到剛剛的「Custom Search ID」吧！