正在載入中...Google AJAX Search API 搜尋你的 Blog
還在煩惱要如何在你 的Blog上，建立一個站內搜尋器嗎？Google AJAX Search API應該可以滿足 你的需求，而且提供更多。
許多的Blog都有提供站內搜尋功能，但是使用Blogger的朋友們，可就非常傷腦筋了，雖然在網上爬文，是有看到Blogger有自己的站內搜索功能，但是經過OVER30-MAN的測試，它果然如網上所說，對於中文的支援能力非常的差，或者說爛到可以。
又或者，你也可以透過Google SiteSearch或是Technorati等類似的網站建立搜尋器，但對於一個新建立的Blog而言，需要先到這些網站登錄，且要等到這些搜尋器爬過你的網站，不知道又是多久以後的事了。
現在有個更好的解決方案 -- Google AJAX Search API，它能在最短的時間內就能夠讓你的Blog站內搜尋器找尋到剛剛才發佈的文章。
雖然Google AJAX Search API的功能強大，本文將只著重在建立個人Blog的站內搜尋，目前，OVER30-Man只在Blogger上測試過，至於其他的Blog，希望其他的朋友幫忙測試一下。
STEP1:
首先，請先到Google AJAX Search API網站上註冊你的網站，在註冊頁最下面，勾取"同意"，輸入你的網站首頁位址，然後按下取得API KEY的按鈕，就可以取得一組Google AJAX Search API Key。
STEP2:
接著，你得放一些程式碼到你的Blog樣板原始碼裡。首先要先登入你的Blogger管理網頁，在範本頁籤裡，有一個修改HTML頁籤，按下去，就可以看到樣板的原始碼了。然後捲動轉軸，找到原始碼裡的]]></b:skin>;，然後在其後面，加入下列的程式碼。
請自行將上面程式碼中紅字的部份作修改，YOUR_GOOGLE_AJAX_SEARCH_KEY換成剛剛你申請到的Key，BLOG搜尋則改成你想要的文字標籤如站內搜尋等等，http://yourblogger.blogspot.com，當然就是您剛剛註冊時所輸入的網站囉！至於""，你可以輸入預設要搜尋的字串，一般應該都不需要設吧！如果你有需要的話，記得兩個引號要加上，如"AJAX"。
STEP3:
接下來，必須在你的Blog中，加入此搜尋列。同樣在剛剛的範本頁籤裡面，選擇網頁元素，然後在你想要加入的搜尋列的地方，一般都在Side Bar的地方，按下加入網頁元素連結，接著會跳出一個視窗，如下圖，選擇HTML/JavaScript，加入BLOG。
然後，又是輸入程式碼了，這一次的比較簡單。
這一段程式碼中，只有最後一行是必要的，就是在你的Blog中加入搜尋列，其餘的部份則是設定搜尋列長短、字型大小的CSS碼，必要時請自行調整。
STEP4:
最後別忘記重新更新你的Blog，然後進行測試。具OVER30-MAN的測試，一篇剛發佈的文章，應該可以在1分鐘內搜尋到，不過如果你的Blog上已經有很多的文章，需要多久，就沒試過了。如果確定程式輸入的沒有錯，就耐心的等一下吧！
參考網站：
這一個網頁裡面，可以自行為你產生程式碼，但是在Blog站內搜尋的應用上，好像有點問題。OVER30-MAN一開始也是用它的程式碼，後來發現有問題後，才又去爬說明文件和一些範例。最後在這個網站上，得到了啟發。Google AJAX Search API的功能可不只這樣，它還可以搜尋地圖、Video、還有整個World Wild Web，功能可謂非常的強大，有興趣的，就自己玩玩吧！
雖然Google AJAX Search API的功能強大，本文將只著重在建立個人Blog的站內搜尋，目前，OVER30-Man只在Blogger上測試過，至於其他的Blog，希望其他的朋友幫忙測試一下。
STEP1:
首先，請先到Google AJAX Search API網站上註冊你的網站，在註冊頁最下面，勾取"同意"，輸入你的網站首頁位址，然後按下取得API KEY的按鈕，就可以取得一組Google AJAX Search API Key。
STEP2:
接著，你得放一些程式碼到你的Blog樣板原始碼裡。首先要先登入你的Blogger管理網頁，在範本頁籤裡，有一個修改HTML頁籤，按下去，就可以看到樣板的原始碼了。然後捲動轉軸，找到原始碼裡的]]></b:skin>;，然後在其後面，加入下列的程式碼。
<link href='http://www.google.com/uds/css/gsearch.css' rel='stylesheet' type='text/css'/>
<script src='http://www.google.com/uds/api?file=uds.js&v=1.0&key=YOUR_GOOGLE_AJAX_SEARCH_API_KEY' type='text/javascript'/>
<script language='Javascript' type='text/javascript'>
function OnLoad() {
var searchControl = new GSearchControl();
// 必須使用GblogSearch()，並限定你的Blog。
// 才能正確的搜尋你的Blog。
var searcher = new GblogSearch();
searcher.setUserDefinedLabel("BLOG搜尋");
searcher.setSiteRestriction("http://yourblogger.blogspot.com");
searchControl.addSearcher(searcher);
var drawOptions = new GdrawOptions();
drawOptions.setDrawMode(GSearchControl.DRAW_MODE_LINEAR);
searchControl.draw(document.getElementById("searchcontrol"), drawOptions);
searchControl.execute("");
}
GSearch.setOnLoadCallback(OnLoad);
</script>
請自行將上面程式碼中紅字的部份作修改，YOUR_GOOGLE_AJAX_SEARCH_KEY換成剛剛你申請到的Key，BLOG搜尋則改成你想要的文字標籤如站內搜尋等等，http://yourblogger.blogspot.com，當然就是您剛剛註冊時所輸入的網站囉！至於""，你可以輸入預設要搜尋的字串，一般應該都不需要設吧！如果你有需要的話，記得兩個引號要加上，如"AJAX"。
STEP3:
接下來，必須在你的Blog中，加入此搜尋列。同樣在剛剛的範本頁籤裡面，選擇網頁元素，然後在你想要加入的搜尋列的地方，一般都在Side Bar的地方，按下加入網頁元素連結，接著會跳出一個視窗，如下圖，選擇HTML/JavaScript，加入BLOG。
然後，又是輸入程式碼了，這一次的比較簡單。
<style type="text/css">
.gsc-control { width: 200px; }
.gsc-control { font-size: 12px; }
.gsc-search-box { font-size: 12px; }
.gsc-narrow .gsc-input { width: 120px; }
</style>
<div id="searchcontrol"/></div>
這一段程式碼中，只有最後一行是必要的，就是在你的Blog中加入搜尋列，其餘的部份則是設定搜尋列長短、字型大小的CSS碼，必要時請自行調整。
STEP4:
最後別忘記重新更新你的Blog，然後進行測試。具OVER30-MAN的測試，一篇剛發佈的文章，應該可以在1分鐘內搜尋到，不過如果你的Blog上已經有很多的文章，需要多久，就沒試過了。如果確定程式輸入的沒有錯，就耐心的等一下吧！
參考網站：
這一個網頁裡面，可以自行為你產生程式碼，但是在Blog站內搜尋的應用上，好像有點問題。OVER30-MAN一開始也是用它的程式碼，後來發現有問題後，才又去爬說明文件和一些範例。最後在這個網站上，得到了啟發。Google AJAX Search API的功能可不只這樣，它還可以搜尋地圖、Video、還有整個World Wild Web，功能可謂非常的強大，有興趣的，就自己玩玩吧！
沒有留言:
張貼留言