Konfigurieren Sie Ihr gehostetes Benutzeroberflächen-Erlebnis

Warnung

Am 30. Oktober 2020 wurden die Bing Search-APIs von Azure AI-Diensten zu Bing Search Services verschoben. Diese Dokumentation wird nur zur Referenz bereitgestellt. Eine aktualisierte Dokumentation finden Sie in der Dokumentation zu den Bing-Suche-APIs. Anweisungen zum Erstellen neuer Azure-Ressourcen für die Bing-Suche finden Sie unter Erstellen einer Ressource für die Bing-Suche über Azure Marketplace.

Die benutzerdefinierte Bing-Suche bietet eine gehostete Benutzeroberfläche, die Sie einfach als JavaScript-Codeausschnitt in Ihre Webseiten und Webanwendungen integrieren können. Mithilfe des Bing Custom Search-Portals können Sie das Layout, die Farbe und die Suchoptionen der Benutzeroberfläche konfigurieren.

Konfigurieren der benutzerdefinierten gehosteten Benutzeroberfläche

Führen Sie die folgenden Schritte aus, um eine gehostete Benutzeroberfläche für Ihre Webanwendungen zu konfigurieren. Während Sie Änderungen vornehmen, erhalten Sie im rechten Bereich eine Vorschau der Benutzeroberfläche. Die angezeigten Suchergebnisse sind keine tatsächlichen Ergebnisse für Ihre Instanz.

  1. Melden Sie sich beim Benutzerdefinierten Bing-Suchportal an.

  2. Wählen Sie Ihre benutzerdefinierte Bing-Suchinstanz aus.

  3. Klicken Sie auf die Registerkarte "Gehostete Benutzeroberfläche ".

  4. Wählen Sie ein Layout aus.

    • Suchleiste und Ergebnisse (Standard): Zeigt ein Suchfeld mit darunter liegenden Suchergebnissen an.
    • Nur Ergebnisse: Zeigt nur Suchergebnisse ohne Suchfeld an. Wenn Sie dieses Layout verwenden, müssen Sie die Suchabfrage (&q=<query string>) angeben. Fügen Sie den Abfrageparameter der Anforderungs-URL im JavaScript-Codeausschnitt oder des HTML-Endpunktlinks hinzu.
    • Popup: Stellt ein Suchfeld bereit und zeigt die Suchergebnisse in einer gleitenden Überlagerung an.
  5. Wählen Sie ein Farbdesign aus. Sie können die Farben an Ihre Anwendung anpassen, indem Sie auf "Design anpassen" klicken. Um eine Farbe zu ändern, geben Sie entweder den RGB-HEX-Wert der Farbe ein (z. B #366eb8. ), oder klicken Sie auf die Farbvorschau.

    Sie können eine Vorschau Ihrer Änderungen auf der rechten Seite des Portals anzeigen. Wenn Sie auf "Auf Standard zurücksetzen" klicken, werden die Änderungen an den Standardfarben für das ausgewählte Design wiederhergestellt.

    Hinweis

    Berücksichtigen Sie die Barrierefreiheit beim Auswählen von Farben.

  6. Geben Sie unter "Zusätzliche Konfigurationen" werte entsprechend ihrer App an. Diese Einstellungen sind optional. Informationen zum Anwenden oder Entfernen dieser Elemente finden Sie im Vorschaubereich auf der rechten Seite. Verfügbare Konfigurationsoptionen sind:

  7. Geben Sie den Suchabonnementschlüssel ein, oder wählen Sie einen aus der Dropdownliste aus. Die Dropdownliste wird mit Schlüsseln aus den Abonnements Ihres Azure-Kontos aufgefüllt. Siehe Azure AI-Dienst-API-Konto.

  8. Wenn Sie die Autosuggest-Funktion aktiviert haben, geben Sie den Autosuggest-Abonnementschlüssel ein oder wählen Sie einen aus der Dropdown-Liste aus. Die Dropdownliste wird mit Schlüsseln aus den Abonnements Ihres Azure-Kontos aufgefüllt. Benutzerdefiniertes Autosuggest erfordert eine spezielle Abonnementstufe, siehe Preise.

Veröffentlichen oder Zurücksetzen

Änderungen, die Sie an einer benutzerdefinierten Suchinstanz vornehmen, werden auf der Registerkarte Konfiguration vorgenommen, sodass Sie Ihre Änderungen überprüfen können. Wenn Sie mit dem Vornehmen von Änderungen fertig sind und bereit zum Veröffentlichen sind, klicken Sie auf veröffentlichen. Änderungen wirken sich erst dann auf Ihre Produktionsendpunkte aus, wenn Sie sie veröffentlichen.

Wenn Sie vor der Veröffentlichung entscheiden, dass Sie die vorgenommenen Änderungen nicht beibehalten möchten, klicken Sie auf zurücksetzen. Wenn Sie die Änderungen wiederherstellen, bleibt die Konfiguration des Livezustands unverändert, und die Registerkarte Konfiguration wird wiederhergestellt, um dem Livezustand zu entsprechen.

Benutzerdefinierte Benutzeroberfläche nutzen

Um die gehostete Benutzeroberfläche zu nutzen, führen Sie eine der folgenden Aktionen aus:

  • Einschließen des Skripts in Ihre Webseite

    <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>
    
  • Oder verwenden Sie die folgende URL in einem Webbrowser.

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

    Hinweis

    Fügen Sie der URL nach Bedarf die folgenden Abfrageparameter hinzu. Informationen zu diesen Parametern finden Sie in der Referenz zur benutzerdefinierten Such-API .

    • q
    • Mkt
    • SafeSearch
    • setlang

    Wichtig

    Die Seite kann Ihre Datenschutzerklärung oder andere Hinweise und Bedingungen nicht anzeigen. Die Eignung für Ihre Verwendung kann variieren.

Weitere Informationen, einschließlich Ihrer benutzerdefinierten Konfigurations-ID, finden Sie unter der Registerkarte "Produktion" zu Endpunkten.

Konfigurationsoptionen

Sie können das Verhalten Ihrer gehosteten Benutzeroberfläche konfigurieren, indem Sie auf "Zusätzliche Konfigurationen" klicken und Werte angeben. Diese Einstellungen sind optional. Informationen zum Anwenden oder Entfernen dieser Elemente finden Sie im Vorschaubereich auf der rechten Seite.

Websuchkonfigurationen

  • Websuche aktiviert: Bestimmt, ob die Websuche aktiviert ist (oben auf der Seite wird ein Web-Reiter angezeigt)
  • Autosuggest aktivieren: Bestimmt, ob benutzerdefiniertes Autosuggest aktiviert ist (siehe Preise für zusätzliche Kosten).
  • Webergebnisse pro Seite: Anzahl der Websuchergebnisse, die gleichzeitig angezeigt werden sollen (maximal 50 Ergebnisse pro Seite).
  • Bildbeschriftung: Bestimmt, ob Bilder mit Suchergebnissen angezeigt werden.

Die folgenden Konfigurationen werden angezeigt, wenn Sie auf " Erweiterte Konfigurationen anzeigen" klicken:

  • Hervorheben von Wörtern: Bestimmt, ob Ergebnisse fett formatiert mit Suchbegriffen angezeigt werden.
  • Linkziel: Bestimmt, ob die Webseite in einem neuen Browser-Tab (Blank) oder im selben Browser-Tab (self) geöffnet wird, wenn der Benutzer auf ein Suchergebnis klickt.

Konfigurationen für die Bildsuche

  • Aktivierte Bildergebnisse: Bestimmt, ob die Bildsuche aktiviert ist (oben auf der Seite wird eine Registerkarte "Bilder" angezeigt).
  • Bildergebnisse pro Seite: Anzahl der anzuzeigenden Bildsuchergebnisse (maximal 150 Ergebnisse pro Seite).

Die folgende Konfiguration wird angezeigt, wenn Sie auf " Erweiterte Konfigurationen anzeigen" klicken.

  • Filter aktivieren: Fügt Filter hinzu, mit denen der Benutzer die von Bing zurückgegebenen Bilder filtern kann. Beispielsweise kann der Benutzer die Ergebnisse nur nach animierten GIFs filtern.

Konfigurationen für die Videosuche

  • Videoergebnisse aktiviert: Bestimmt, ob die Videosuche aktiviert ist (oben auf der Seite wird eine Registerkarte "Videos" angezeigt).
  • Videoergebnisse pro Seite: Anzahl der anzuzeigenden Videosuchergebnisse (maximal 150 Ergebnisse pro Seite).

Die folgende Konfiguration wird angezeigt, wenn Sie auf " Erweiterte Konfigurationen anzeigen" klicken.

  • Filter aktivieren: Fügt Filter hinzu, mit denen der Benutzer die von Bing zurückgegebenen Videos filtern kann. Beispielsweise kann der Benutzer die Ergebnisse nach Videos mit einer bestimmten Auflösung oder Videos filtern, die in den letzten 24 Stunden ermittelt wurden.

Verschiedene Konfigurationen

  • Seitentitel: Text, der im Titelbereich der Suchergebnisseite angezeigt wird (nicht für Pop-Over-Layout).
  • Toolbar-Design: Legt die Hintergrundfarbe des Titelbereichs der Suchergebnisseite fest.

Die folgenden Konfigurationen werden angezeigt, wenn Sie auf " Erweiterte Konfigurationen anzeigen" klicken.

Column1 Spalte2
Platzhalter für Suchfeldtext Text, der vor der Eingabe im Suchfeld angezeigt wird.
Url des Titellinks Ziel für den Titellink.
Logo-URL Bild neben dem Titel angezeigt.
Favicon (kleines Webseiten-Icon) Symbol, das in der Titelleiste des Browsers angezeigt wird.

Die folgenden Konfigurationen gelten nur, wenn Sie die gehostete Benutzeroberfläche über den HTML-Endpunkt nutzen (sie gelten nicht, wenn Sie den JavaScript-Codeausschnitt verwenden).

  • Seitentitel
  • Symbolleisten-Thema
  • Url des Titellinks
  • Logo-URL
  • Favicon-URL

Nächste Schritte