爲您的WordPress 添加語音搜索功能 備忘

相信大家都用過 Google 的搜索，不知道大家有沒有注意到 Google.com in English 版本的搜索有一個語音搜索，只要吐字清晰，它的識別力還是很高的，而且也只支持中文的語音，這對於老年人、殘障人士、偷懶人羣是一個非常有用的裝B功能。今天心血來潮，把此功能搬到 WordPress。

就本站現在用的這個主題來說，已經用上了這個 Wordpress的語音搜索功能，有圖爲證。

查看演示效果

可以看到右上角的站內搜索框比以往多了一個小話筒的圖標，點擊之後就會彈出一個小的提示框，此時可以清晰地說出你需要搜索的關鍵詞，截圖中是我語音說的 “WordPress” 這個關鍵詞，有興趣的朋友可以拿本站做測試。

但是，這個功能暫時只能在 Chrome 11 版本以上的谷歌瀏覽器上看到這個效果。因爲這是在 input 輸入框裏添加 x-webkit-speech 屬性來實現的，從這個屬性的命名可以看出，webkit，這是一個 webkit 核心瀏覽器的私有屬性，所以你可以切換到 Chrome 瀏覽器來測試本功能。

x-webkit-speech 是 html5 的 speech 功能的 API，Google 的 Chrome 在對 HTML5、CSS3 的新技術標準的支持上特別積極，所以很有幸，我們可以在 Chrome 上體現各種新奇的功能特性。實現的方法也特別簡單，在你的搜索輸入框的 input 標籤裏添加 x-webkit-speech 屬性即可，如下：

<input type="text" x-webkit-speech />

廢話很多，但是代碼卻很簡單，趕緊試試唄！

標籤： WordPress