Fügen Sie den tragbaren Webclient Virtual Agent einer Drittanbieter-Website hinzu

  • Freigeben Version: Xanadu
  • Aktualisiert 1. August 2024
  • 1 Minute Lesedauer
  • Um das Chat-Widget des tragbaren Webclients für Virtual Agent auf Webseiten von Drittanbietern zu verwenden, fügen Sie Ihrer Webseite den erforderlichen Code hinzu.

    Vorbereitungen

    Konfigurieren Sie den tragbaren Webclient Virtual Agent . bevor Sie die Schritte dieses Themas abschließen.

    Weitere Informationen finden Sie im Artikel So betten Sie Virtual Agent in eine externe Website ein auf der Website ServiceNow Community.

    Erforderliche Rolle: virtual_agent_admin oder admin

    Prozedur

    Importieren und instanziieren Sie diese Skriptreferenz für den Seitenheader, um eine ServiceNow -Chatinstanz für den externen Seitenheader zu erstellen:
    Hinweis:
    Im Skriptreferenzbeispiel bezieht sich „site1.example.com“ auf die URL für Ihre Instanz ServiceNow.
    <script type="module" >
          import ServiceNowChat from "https://site1.example.com/uxasset/externals/now-requestor-chat-popover-app/index.jsdbx?sysparm_substitute=false";
          var chat = new ServiceNowChat({ instance: "https://site1.example.com/", });
        </script>
    Tipp:
    Wenn Ihre Organisation einen anwenderdefinierten Domänennamen verwendet, geben Sie den anwenderdefinierten Domänennamen und nicht den Domänennamen ServiceNow als Instanzeigenschaft ein, um sicherzustellen, dass die Browser-Ergebnisse für mehrere Browser konsistent sind.
    Beispiel mit -Konfiguration
    const chat = new ServiceNowChat({
    	instance: 'https://site1.example.com',
    	context: {
    		skip_load_history: 1
    	},
    	branding: {
    		bgColor: '#333',
    		primaryColor: '#000',
    		hoverColor: '#EFEFEF',
    		activeColor: '#AAA',
    		openIcon: 'custom-open.svg',
    		closeIcon: 'custom-close.svg',
    		sizeMultiplier: 1.6
    	},
    	offsetX: 50,
    	offsetY: 50,
    	position: 'left',
    	translations: {
    		'Open dialog': 'Open chat',
    		'Open Chat. {0} unread message(s)': 'Click to open',
    		'Close chat.': 'Click to close',
    	},
    });
    JSON-Konfigurationsschema
    {
        instance: <string> - url to your instance, must be of the same domain (sub-domain)
        context: <object> - sys_parm variables to pass into the iframe
        branding: <object> - branding settings
              bgColor: <rgb|hex> - can take an rgb tuple, ie: '56,56,56' or a 3 or 6 hex color code, ie: #333 or #efefef.  background color of button
       	primaryColor: <rgb|hex> - font color
       	hoverColor: <rgb|hex> - hover background color of button
       	activeColor: <rgb|hex> - click / active background color of button
       	openIcon: <string> - name of the uploaded custom icon in settings
       	closeIcon: <string> - name of the uploaded custom icon in settings
       offsetX: <integer> - distance in pixels the button moves along the x-axis
       offsetY: <integer> - distance in pixels the button moves along the y-axis
       position: <enum: left|right> - position left or right side of screen
       translations: <object> - contains label mappings for translations or label changes
       	'Open dialog': <string> - replacement text for accessibility
       	'Open Chat. {0} unread messages(s)': <string> - replacement text for tooltip
       	'Close chat.': <string> - replacement text for tooltip
    }