由於不想用原本MT附的搜尋,因為會浪費我的資源,所以最近一直在找尋方案。最後終於被我找到了Google Search。並且可以整個融入MT裡面。不需再跳出視窗。
就讓我來告訴大家,如何把Google Ajax Search加入你的MT中。
如果想試用,可以直接在我的首頁右邊,直接試試效果。
1.首先你必須先到Sign up for the Google AJAX Search API去申請一個針對你網站的APi Key。將I have read and agree with the terms and conditions 打勾,並將你要搜尋的網站位置填寫在My web site URL的欄位裡。
PS.*按下Generate API Key的按鈕時,會請你先登入Google的帳號。如果你還沒有帳號,可以直接在他的提示下做申請。
*申請的Key只能在你申請的網站下使用,否則會出現Key不正確的訊息。
2.申請完後會出現一個Key值,將這Key先複製下來,等會會用到。他也會附範例給你參考,但我們似乎用不到^^。
3.接下來登入你的MT後台,到"範本"區選"模組",新增兩個新的模組
ajaxsearch-keys:這是存放Key的(記的把key值換成你自己的)。
<script src="https://www.google.com/uds/api?file=uds.js&v=1.0&key=ABQIAAAAN4UsFIrghsFg5sq7gXOn_RTFdIlBPHcbe0XARQF4p6wDvY17rxR2pDOmhC4BjXuKgU4gDMboJbgvhA" type="text/javascript">
ajaxsearch-sidebar:是Google Ajax Search 的一些功能模組。
<!-- raw solution files and styles -->
<!-- Keyed Apis are in ajaxsearch-keys -->
<link href="https://www.google.com/uds/css/gsearch.css" rel="stylesheet" type="text/css"/>
<link href="https://www.google.com/uds/css/gsearch_darkgrey.css" rel="stylesheet" type="text/css"/><style type="text/css">
/* center column search stuff */
#searchform { width : 100%; margin-bottom : 8px;}
#alpha .gs-result .gs-title,
#alpha .gs-result .gs-title * {
color : rgb(255, 153, 51);
}#alpha .gsc-resultsHeader {
border-bottom-color : rgb(99,99,99);
}#alpha .gsc-control {
width : 100%;
}#alpha .gsc-tabHeader.gsc-tabhActive {
border-left: 1px solid #636363;
border-right: 1px solid #636363;
border-top: 2px solid rgb(255, 153, 51);
background: #e9e9e9;
}#alpha .gsc-tabHeader.gsc-tabhInactive {
border-left: 1px solid black;
border-right: 1px solid black;
border-top: 2px solid #636363;
background: black;
}</style>
<script type="text/javascript">
var coreSearch;function SolutionLoad() {
var alphaRoot = document.getElementById("alpha");
var controlRoot = document.createElement("div");
alphaRoot.insertBefore(controlRoot, alphaRoot.firstChild);// create the search control
coreSearch = new GSearchControl();
coreSearch.setLinkTarget(GSearch.LINK_TARGET_SELF);
coreSearch.setResultSetSize(GSearch.LARGE_RESULTSET);// prep for decoupled search form
var searchFormElement = document.getElementById("searchform");
var drawOptions = new GdrawOptions();
drawOptions.setSearchFormRoot(searchFormElement);
drawOptions.setDrawMode(GSearchControl.DRAW_MODE_TABBED);// populate - web, this blog, all blogs
searcher = new GblogSearch();
searcher.setSiteRestriction("/fun/");
searcher.setUserDefinedLabel("土不拉多");
coreSearch.addSearcher(searcher);coreSearch.draw(controlRoot, drawOptions);
}function doCoreSearch(q) {
coreSearch.execute(q);
}registerLoadHandler(SolutionLoad);
function registerLoadHandler(handler) {
var node = window;
if (node.addEventListener) {
node.addEventListener("load", handler, false);
} else if (node.attachEvent) {
node.attachEvent("onload", handler);
} else {
node['onload'] = handler;
}
return true;
}</script>
<!-- google search -->
<h2 class="module-header">搜尋</h2>
<div id="searchform">讀取中...</div>
新增完後就會看到如下圖:
4.接下來就是要把它加入我們的首頁(你也可以加到你想要放置的地方),到"範本"區選擇"索引",編輯"主索引"。在適當的位置上加上
<div class="module-archives module">
<$MTInclude module="ajaxsearch-keys"$>
<$MTInclude module="ajaxsearch-sidebar"$>
</div>
PS.編輯完後記的儲存並重建索引。這樣就大功告成了。
PS:
*此範例只適用於兩欄式的MT 樣式,其他可能會不適用。
*在用Google Search 之前,請先確定你的網站有被Google收錄,免的加上去後,你可能找不到任何東西。
*使用Google Ajax Search的壞處是,你的一些新文章可能會搜尋不到,這就要看Google的更新速度了。還有就是當Google壞了,你的搜尋也會失效。
*相關的資訊也可以參考
Google AJAX Search API Playground
Google AJAX Search API Class Reference
Leave a comment