Unterstütztes HTML zum Konfigurieren der Website

Wenn in Elementen des ArcGIS Enterprise-Portals, z. B. in den Elementseiten, Gruppenbeschreibungen, Karten-Pop-ups und konfigurierbaren Apps, ein Rich-Text-Editor enthalten ist, können Sie HTML-Code verwenden.

HTML-Tags und -Attribute

Die nachfolgende Tabelle führt die unterstützten HTML-Tags und -Attribute auf, die Sie verwenden können.

TagAttribut

a

href, style

img

src, width, height, border, alt, style

video

autoplay, controls, height, loop, muted, poster, preload, width

audio

autoplay, controls, loop, muted, preload

source

media, src, type

span

style

table

width, height, cellpadding, cellspacing, border, style

div

style, align

font

size, color, style

figure

style

figcaption

style

dd, dl, dt

style

h1, h2, h3, h4, h5, h6

style

tr

height, valign, align, style

td, th

height, width, valign, align, colspan, rowspan, nowrap, style

p

style

b, strong, i, em, u, ul, ol, li, tbody, br, hr

abbr

title

sub

style

sup

style

Überlegungen zu HTML

Bedenken Sie Folgendes:

  • HTML-Tags, die oben nicht aufgeführt sind, werden nicht unterstützt, sondern herausgefiltert.
  • Zulässige Protokolle für href und src sind https, http, tel und mailto.
  • Nicht geschlossene Tags werden automatisch geschlossen.
  • <>&s-Zeichen werden außerhalb zulässiger Tags mit Escape-Zeichen versehen, wenn sie nicht mithilfe von &lt;&gt;&amp;&quot mit Escape-Zeichen versehen wurden.
  • UNC-Links werden nicht unterstützt.
  • Wenn ein a-Tag verwendet wird, wird die href-Ziel-URL grundsätzlich in einer neuen Browser-Registerkarte geöffnet.

Legacy-Banner

ArcGIS Enterprise-Organisationen, für die ein Upgrade von einer früheren Version auf Version 10.9 durchgeführt wurde, weisen standardmäßig eine Legacy-Startseitenkonfiguration auf.

Hinweis:

Die Unterstützung für die Legacy-Startseiteneinstellungen wird in zukünftigen Upgrades eingestellt. Daher wird empfohlen, vorhandene Organisationen baldmöglichst auf die neue Startseitenumgebung umzustellen.

Die Legacy-Startseite enthält oben auf der Seite ein Banner mit 960 Pixel Breite und 180 Pixel Höhe. Sie können ein Bild für den Bannerbereich auswählen, indem Sie ein vordefiniertes Bild verwenden oder eine Datei vom Desktop hochladen. Alternativ können Sie mit Rich Text oder HTML ein benutzerdefiniertes Design erstellen. Konfigurieren Sie das Banner als Teil der Einstellungen für die Legacy-Startseite.

Wenn Sie die Option Benutzerdefiniertes Design auswählen, wird ein Rich-Text-Editor angezeigt, in dem Sie Grafiken und Text im Format "What You See Is What You Get" (WYSIWYG) positionieren können. Löschen Sie den vorhandenen Bannerinhalt, und ersetzen Sie ihn durch einen eigenen. Für zusätzliche Flexibilität klicken Sie im Editor auf die Schaltfläche HTML-Quelle, wodurch Sie eigenen HTML-Code eingeben bzw. hineinkopieren können.

Wenn Sie nur ein Bild für das Banner auswählen, wird das Logo im Bannerbild angezeigt. Wenn Sie das benutzerdefinierte Design des Startseiten-Banners verwenden, wird das Logo nicht angezeigt (es sei denn, Sie schließen es in das Design ein).

Tipp:

Wenn für Ihre Organisation "Nur HTTPS" festgelegt ist, müssen Sie auf alle Bildreferenzen in Ihrem Design über HTTPS zugreifen, damit das Bild oder die Bilder in Ihrem Banner angezeigt werden.

Beispiele

Beispiele für Banner, die mit HTML erstellt wurden, finden Sie unten. Für jedes Beispiel ist der Code angegeben, der zur Erstellung des Banners verwendet wurde. Sie können Bild-URLs durch eigene ersetzen.

Mit HTML erstelltes Banner
Das Beispiel dieser Startseite, die ein mit HTML erstelltes Banner enthält

Der unten stehende Code enthält die zur Erstellung des Banners für die "Generic Environment Organization" verwendeten HTML- und CSS-Elemente.

<div style="width: 960px; font-family: futura, helvetica, arial; 
background: url(https://imagesite/generic_env.png); height: 180px">
<div style="width:680px; margin-left: 220px; margin-top: 60px; float: left;">
<span style="font-size:24px; color:#fdf77d;
 font-weight:bold; text-transform:uppercase; text-shadow: 2px 2px 2px #085a00;">
Generic Environment Organization</span><br/>
<p style="color:#ffffff; font-size:14px;">Lorem ipsum dolor sit amet,
 consectetur adipiscing elit. Donec ullamcorper lorem pulvinar libero ultricies.</p></div> </div>

Eine Startseite, die ein mit HTML erstelltes Banner enthält
Dies ist ein Beispiel für eine Startseite, die ein mit HTML erstelltes Banner enthält.

Der unten stehende Code enthält die zur Erstellung des Banners für "Government Home" verwendeten HTML- und CSS-Elemente.

<div style="width: 960px; font-family: futura;
 background: url(https://imagesite/generic_gov.png); height: 180px">
<div style="margin-top: 120px; float: right; margin-right: 80px">
<a href="https://www.esri.com/industries/federal/index.html/" style="background: #65a9d7;
 background: -webkit-gradient(linear, left top, left bottom, from(#3e779d), to(#65a9d7));
 background: -webkit-linear-gradient(top, #3e779d, #65a9d7); 
background: -moz-linear-gradient(top, #3e779d, #65a9d7); 
background: -ms-linear-gradient(top, #3e779d, #65a9d7); 
background: -o-linear-gradient(top, #3e779d, #65a9d7);
border-bottom:#fff 1px solid; border-left: #fff 1px solid; padding-bottom: 7px;
 padding-left: 15px; padding-right: 15px; font-family: helvetica, arial, sans-serif;
 color: white; font-size: 14px; vertical-align: middle; 
border-top: #fff 1px solid; border-right: #fff 1px solid; text-decoration: none;
 padding-top: 7px; -moz-border-radius: 3px; -webkit-border-radius: 3px;
 border-radius: 3px; -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
 -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0; box-shadow: rgba(0,0,0,1) 0 1px 0;
 text-shadow: rgba(0,0,0,.4) 0 1px 0" target="_blank">Government Home</a></div></div>

Eine Startseite, die ein mit HTML erstelltes Banner enthält
Dies ist ein Beispiel für eine Startseite, die ein mit HTML erstelltes Banner enthält.

Sie können ein Banner verwenden, das größer ist als der empfohlene Bannerbereich von 960 Pixel Breite auf 180 Pixel Höhe. Beachten Sie dabei jedoch, dass das Bild bestimmte Bereiche der Startseite, z. B. den Namen der dargestellten Inhalte, verdecken kann. Um den Text besser sichtbar zu machen, wählen Sie für den unteren Bereich des Banners eine Komplementärfarbe aus, die Standardblau entspricht. Sie können die Farben am unteren Rand auch ineinander übergehen lassen.

<div id="banner-html" style="left: 0px; top: 0px; position: absolute;"><div>
<img src="https://downloads.esri.com/Blogs/learn-arcgis/ago-banner/cartography-banner.png?" 
style="-webkit-border-radius:0 0 10px 10px; -moz-border-radius:0 0 10px 10px; -o-border-radius:0 0 10px 10px; 
border-radius:0 0 10px 10px; margin-top:0; width:960px; height:470px;"></div></div>