設定託管的 UI 體驗

  • 發行項

警告

在 2020 年 10 月 30 日，Bing 搜尋 API 已從 Azure AI 服務移至 Bing 搜尋 服務。 本文件僅供參考之用。 如需更新的文件，請參閱 Bing 搜尋 API 文件。 如需針對 Bing 搜尋建立新 Azure 資源的指示，請參閱透過 Azure Marketplace 建立 Bing 搜尋資源。

Bing 自訂搜尋會提供一個託管 UI，您可輕鬆地將它以 JavaScript 程式碼片段的形式整合到您的網頁和 Web 應用程式中。 使用 Bing 自訂搜尋入口網站，您可以設定 UI 的版面配置、色彩和搜尋選項。

設定自訂託管 UI

若要為您的 Web 應用程式設定託管的 UI，請依照下列步驟執行。 當您進行變更時，右側窗格可供您預覽您的 UI。 顯示的搜尋結果並不是您執行個體的實際結果。

  1. 登入 Bing 自訂搜尋入口網站。

  2. 選取 Bing 自訂搜尋執行個體。

  3. 按一下 [託管的 UI] 索引標籤。

  4. 選取配置。

    • 搜尋列和結果 (預設)：顯示搜尋方塊，並在下方顯示搜尋結果。
    • 僅限結果：只會顯示搜尋結果，不顯示搜尋方塊。 使用此版面配置時，您必須提供搜尋查詢 (&q=<query string>)。 在 JavaScript 程式碼片段或 HTML 端點連結中，將查詢參數新增到要求 URL。
    • 彈出視窗：提供搜尋方塊，並且在滑動重疊中顯示搜尋結果。

  5. 選取色彩佈景主題。 按一下 [自訂佈景主題]，即可自訂符合您應用程式的色彩。 若要變更色彩，請輸入色彩的 RGB HEX 值 (例如 #366eb8)，或按一下色彩預覽。

    您可以在入口網站的右側預覽您的變更。 按一下 [重設為預設]，您的變更就會還原為所選佈景主題的預設色彩。

    注意

    選擇色彩時，請考慮可存取性。

  6. 在 [其他組態] 下方，為您的應用程式提供適當的值。 這些設定是選用的。 若要檢視套用或移除這些設定的效果，請查看右側的預覽窗格。 可用的組態選項包括：

  7. 輸入搜尋訂用帳戶金鑰，或從下拉式清單中選擇。 下拉式清單中會填入來自您 Azure 帳戶之訂用帳戶的金鑰。 請參閱 Azure AI 服務 API 帳戶。

  8. 如果您已啟用自動建議，請輸入自動建議訂用帳戶金鑰，或從下拉式清單中選擇。 下拉式清單中會填入來自您 Azure 帳戶之訂用帳戶的金鑰。 自訂自動建議需要特定的訂用帳戶層，請參閱定價。

發佈或還原

您對自訂搜尋執行個體所做的變更位於 [組態] 索引標籤中，因此可以驗證您的變更。 當您完成變更並準備好發佈之後，請按一下 [發佈]。 一直要到您發佈之後，變更才會反映到您的生產環境端點。

在發佈之前，如果您決定不要保留所做的變更，請按一下 [還原]。 當您還原變更時，即時狀態設定不會變更，而且 [設定] 索引標籤會還原以符合即時狀態。

使用自訂 UI

若要使用託管的 UI，請：

  • 在您的網頁中包含指令碼

    <html>
    <body>
        <script type="text/javascript" 
            id="bcs_js_snippet"
            src="https://ui.customsearch.ai /api/ux/rendering-js?customConfig=<YOUR-CUSTOM-CONFIG-ID>&market=en-US&safeSearch=Moderate&version=latest&q=">
        </script>
    </body>    
</html>

  • 或者，您也可以在網頁瀏覽器中使用下列 URL。

    https://ui.customsearch.ai/hosted?customConfig=YOUR-CUSTOM-CONFIG-ID

    注意

    視需要將下列的查詢參數加入 URL。 如需有關這些參數的資訊，請參閱自訂搜尋 API \(英文\) 參考。

    • q
    • mkt
    • safesearch
    • setlang

    重要

    頁面無法顯示您的隱私權聲明或其他通知和條款。 對您的適用性可能有所不同。

如需相關資訊 (包括您的自訂組態識別碼)，請移至 [生產] 索引標籤下的 [端點]。

設定選項

按一下 [其他組態]，然後提供值，即可設定託管 UI 的行為。 這些設定是選用的。 若要檢視套用或移除這些設定的效果，請查看右側的預覽窗格。

Web 搜尋組態

  • 已啟用 Web 結果：決定是否啟用 Web 搜尋 (您會在頁面頂端看到 [Web] 索引標籤)
  • 啟用自動建議：決定是否啟用自訂建議 (如需額外費用的相關資訊，請參閱定價)。
  • 每一頁面的 Web 結果：一次要顯示的 Web 搜尋結果數目 (最大值為每頁 50 個結果)。
  • 影像標題：決定是否要隨著搜尋結果顯示影像。

如果您按一下 [顯示進階設定]，將顯示下列設定：

  • 醒目提示文字：決定是否以粗體顯示結果中包含的搜尋字詞。
  • 連結目標：決定當使用者按一下搜尋結果時，是要在新的瀏覽器索引標籤 (空白) 中開啟網頁，或在相同的瀏覽器索引標籤 (本身) 中開啟網頁。

影像搜尋組態

  • 已啟用影像結果：決定是否要啟用影像搜尋 (您會在頁面頂端看到 [影像] 索引標籤)。
  • 每一頁面的影像結果：一次要顯示的影像搜尋結果數目 (最大值為每頁 150 個結果)。

如果您按一下 [顯示進階設定]，將顯示下列設定。

  • 啟用篩選條件：新增使用者可用來篩選 Bing 傳回之影像的篩選條件。 例如，使用者可以篩選只顯示動畫 GIF 的結果。

影片搜尋組態

  • 已啟用影片結果：決定是否啟用影片搜尋 (您將會在頁面頂端看到 [影片] 索引標籤)。
  • 每一頁面的影片結果：一次要顯示的影片搜尋結果數目 (最大值為每頁 150 個結果)。

如果您按一下 [顯示進階設定]，將顯示下列設定。

  • 啟用篩選條件：新增使用者可用來篩選 Bing 傳回之影片的篩選條件。 例如，使用者可以篩選特定解析度的影片結果，或篩選在過去 24 小時內探索到的影片。

其他組態

  • 頁面標題：顯示在搜尋結果頁面標題區域中的文字 (不適用於彈出視窗版面配置)。
  • 工具列佈景主題：決定搜尋結果頁面標題區域的背景色彩。

如果您按一下 [顯示進階設定]，將顯示下列設定。

資料行1 資料行2
搜尋方塊文字預留位置 在輸入之前顯示於搜尋方塊中的文字。
標題連結 URL 標題連結的目標。
標誌 URL 顯示於標題旁的影像。
Favicon 顯示於瀏覽器標題列中的圖示。

只有當您透過 HTML 端點取用託管的 UI 時，系統才會套用下列設定 (若使用 JavaScript 程式碼片段則不會套用)。

  • 頁面標題
  • 工具列佈景主題
  • 標題連結 URL
  • 標誌 URL
  • Favicon URL

下一步