【奇寶小教室】如何透過結構化資料標記實現站內搜尋框

歡迎再度來到奇寶小教室，讓我們繼續來跟奇寶工程師一起瞭解結構化資料吧！
今天要跟大家分享，要如何透過結構化資料標記，讓我們網站的站內搜尋框，出現於搜尋結果中，呈現Sitelinks Searchbox(暫譯：站內搜尋框)。

藉此讓使用者在搜尋結果頁，就能直接進一步搜尋我們網站內，他所在尋找的特定內容。簡化使用者搜尋的流程，最終提高使用者搜尋體驗！

像是搜尋 "pinterest" 所呈現的站內搜尋框：

站內搜尋框何時會出現？

根據Google官方的說法，當使用者搜尋一些知名網站的品牌名(如Pinterest)或網址(如Pinterest.com)時，可能當他到達目標網站時，下一步就會立刻進行細部搜尋(例如想到pinterest上找貓的圖片)，站內搜尋框就是會在這樣的搜尋情境下出現在搜尋結果當中。

該怎麼做才能讓網站的搜尋結果中出現站內搜尋框？

想要獲得站內搜尋框，其實並不需要特別做些什麼。

你不一定要有站內搜尋引擎，或進行結構化資料標記，就能讓網站在搜尋結果中出現站內搜尋框。

但如果你希望讓站內搜尋框，是用網站自身的站內搜尋引擎運行，直接呈現站內相對應的搜尋結果，而非Google所提供的搜尋結果時，就必須標記相對應的結構化資料。

如下方的例子：

於Pinkoi站內搜尋框，搜尋"耳環"所出現的站內搜尋的結果。

該如何針對網站自身的站內搜尋引擎，進行結構化資料標記？

這是Google開發者中心所提供的結構化資料範本：

我們可以參考Google所提供的JSON-LD的標記範例，並針對紅框的欄位，依照網站的不同，做一些修改即可。如紅框所示，需要修改的地方是：

"url"：網站的網址
"target"：站內搜尋結果頁的網址形式

以pinkoi的網址為例，耳環的站內搜尋結果頁的網址為"https://www.pinkoi.com/search?q=耳環"，
則pinkoi要填入欄位的網址形式就是：https://www.pinkoi.com/search?q={search_term_string}，

此外，相信聰明的你，肯定有發現，search_term_string其實就是代表使用者搜尋字詞的一個參數名稱。

"query-input"：required name要等於"target"網址形式中，代表使用者搜尋字詞的參數名稱，

舉例來說如果參數叫search_term_string，則此處的參數也必須為search_term_string。

到這邊我們已經完成修改，最後只要將程式碼添加到首頁當中即可完成標記囉！

結論

相信經過這次的分享，大家對於站內搜尋框已經有更多的瞭解。最後簡單來說：
若希望使用者用站內搜尋框搜尋時，直接呈現站內搜尋引擎的結果，就會需要進行結構化資料的標記；
不然一般情況下，網站不需要特別進行結構化資料標記，就可以出現站內搜尋框，與Google的站內搜尋結果。
而以奇寶工程團隊的經驗來說，會建議客戶若有站內搜尋引擎，則可以考慮進行相關的標記，讓使用者能直接透過站內搜尋框到達網站中的相對應的搜尋結果頁，更加簡化使用者尋找內容的流程。

想更瞭解站內搜尋框？

Google 官方文章：Sitelinks Searchbox

-- 奇寶小教室的其他課程：

【奇寶小教室】跟著工程師學結構化資料！-什麼是結構化資料？

【奇寶小教室】跟著工程師學結構化資料！-文章結構化資料

【奇寶小教室】跟著工程師學結構化資料！-麵包屑結構化資料

【奇寶小教室】跟著工程師學結構化資料！-產品結構化資料

【奇寶小教室】跟著工程師學結構化資料！-在地商家結構化資料

-- 推薦閱讀

結構化資料標記，讓google更懂網站的心！

參考資料：工程師操作經驗分享、Google Developers、Schema.org

圖片來源：Background vector created by freepik - www.freepik.com