Designs für interne Dashboards

Mit benutzerdefinierten Designs können Sie das Erscheinungsbild Ihrer internen (nicht eingebetteten) Looker-Dashboards anpassen. Mit Designs können Sie Schriftfamilie, Textfarbe, Hintergrundfarbe, Schaltflächenfarbe, Kachelfarbe und andere visuelle Elemente anpassen. Designs können sowohl auf benutzerdefinierte Dashboards als auch auf LookML-Dashboards angewendet werden.

Sie können beispielsweise ein „dunkles“ Design erstellen, um die Darstellung Ihres Dashboards zu ändern.

Sie können Designs für Dashboards und das Bearbeitungsfenster für Tiles in einem Dashboard auf der Seite Designs im Bereich Plattform des Bereichs Verwaltung definieren.

Auf dieser Seite wird Folgendes beschrieben:

Anforderungen an Nutzer und Instanzen

Damit Sie Designs für Ihre internen Looker-Dashboards verwalten können, müssen Sie die folgenden Anforderungen erfüllen:

Design auf ein Dashboard anwenden

Wenn Sie ein Design auf ein Dashboard anwenden möchten, muss sich das Dashboard im Bearbeitungsmodus befinden. Klicken Sie dann auf Stil, um das Feld Stil zu öffnen. Wählen Sie im Feld Design ein Design aus. Es wird dann auf Ihr Dashboard angewendet. Wenn Sie Keine auswählen und für Ihre Instanz ein Standarddesign festgelegt ist, wird das Standarddesign angewendet.

Dashboards herunterladen

Bei Downloads von Dashboards als PDF wird das angewendete benutzerdefinierte Design angezeigt.

Benutzerdefiniertes Design erstellen

Wenn Sie ein benutzerdefiniertes Design erstellen möchten, wählen Sie auf der Admin-Seite Designs den Tab Intern aus und klicken Sie auf Design hinzufügen.

Fügen Sie als Nächstes auf der Seite Neues Design Stil- und Farbspezifikationen für jede Einstellung hinzu, die Sie anpassen möchten. Sie können alle Einstellungen ändern, die in den folgenden Abschnitten beschrieben werden. Wählen Sie Design speichern aus, um die Änderungen zu übernehmen und das neue Design zu speichern.

Design

Name: Der Name für das Design muss eindeutig sein und darf nur alphanumerische Zeichen und Unterstriche enthalten. Wenn Sie Leerzeichen im Namen des Designs eingeben, werden diese beim Speichern des Designs durch Unterstriche ersetzt.

Allgemein

Hauptfarbe: In Dashboards wird diese Farbe für primäre Schaltflächen und Filtersteuerungen verwendet. In Explores wird diese Farbe für Links und Symbole in der Feldauswahl, primäre Schaltflächen, Banner und Akzente verwendet.

Textfarbe: Der Hexadezimalcode für den Text in Explores und Dashboards.

Hintergrundfarbe: Der hexadezimale Farbcode für den Hintergrund von Explores und Dashboards.

Schriftfamilie: Der Name der Schriftfamilie. Diese Schriftart wird für den gesamten Text im Dashboard verwendet, einschließlich der Titel von Kacheln, Text-Tiles und Legenden in Visualisierungen. Diese Schriftart wird auch für den gesamten Text in einem Explore verwendet. Wenn der Name der Schriftart ein Leerzeichen enthält, setzen Sie Anführungszeichen um den Namen, z. B. „Open Sans“.

Wenn Sie eine gängige webfähige Schriftart verwenden, können Sie den Namen der Schriftart einfach in das Feld Schriftfamilie eingeben und das Feld Schriftartquelle leer lassen. Wenn Sie eine weniger gängige Schriftart verwenden möchten, geben Sie den Schriftartnamen in das Feld Schriftfamilie ein und geben Sie dann im Feld Schriftartquelle, das als Nächstes beschrieben wird, eine URL zur Definition der Schriftart an, die Sie verwenden möchten.

Schriftartquelle: Lassen Sie dieses Feld leer, sofern Sie keine benutzerdefinierte Schriftart verwenden möchten, die keine gängige webfähige Schriftart ist. Die Schriftartquelle muss eine vollständige URL sein, die mit https beginnt und auf den url-Wert verweist, der im src-Argument von @font-face angegeben ist. Wir empfehlen die Verwendung einer Datei im Web Open Font Format (.woff), da .woff2-Dateien von Internet Explorer 11 nicht unterstützt werden.

  • Für PT Sans Narrow können Sie beispielsweise „PT Sans Narrow“ in das Feld Schriftfamilie und https://fonts.gstatic.com/s/ptsansnarrow/v7/UyYrYy3ltEffJV9QueSi4RdbPw3QSf9R-kE0EsQUn2A.woff in das Feld Schriftquelle eingeben.

Beispiel für ein Bearbeitungsfenster für Dashboardkacheln mit einem benutzerdefinierten Design

Zusätzlich zu den im vorherigen Abschnitt beschriebenen Explore-Elementen wird das Banner beim Bearbeiten einer Dashboardkachel in der Farbe angezeigt, die in der Einstellung Schlüsselfarbe (#e82042) angegeben ist, und in der Schriftart, die in der Einstellung Schriftfamilie (Verdana) angegeben ist:

Das Dialogfeld „Tile bearbeiten“ in einem Looker-Dashboard mit der Farbe „#e82042“ für das Banner und der Schriftfamilie „Verdana“ für den gesamten Text auf der Seite.

Dashboard-Seite

Farbsammlung: Optional können Sie eine Farbsammlung auswählen. Das ist eine Reihe von aufeinander abgestimmten Paletten, die gut zusammenpassen. Wenn Sie einem Dashboard eine Farbsammlung zuweisen, werden alle Datenreihen in allen Kacheln des Dashboards entsprechend den Paletten in der Sammlung eingefärbt. So sind die Farben der Datenreihen im gesamten Dashboard aufeinander abgestimmt.

Wenn Sie einem Design eine Farbsammlung zuweisen, wird jede Farbsammlung, die zuvor einer Kachel zugewiesen wurde, durch die Farbsammlung des Designs überschrieben. Die Farbsammlung eines Designs überschreibt jedoch weder benutzerdefinierte Farben, die einer Datenreihe zugewiesen sind, noch die bedingte Formatierung, die auf eine Tabellenvisualisierung angewendet wird.

Schriftgröße für Titel: Optional können Sie die Schriftgröße des Dashboardtitels aus einer Reihe vordefinierter Größen in Pixeln anpassen.

Rand oben: Optional können Sie einen bestimmten Wert für den oberen Rand eines Dashboards festlegen. Wählen Sie aus vordefinierten Optionen in einem Drop-down-Menü aus. Ränder werden in Pixeln (px) gemessen.

Rand unten: Optional können Sie einen bestimmten Wert für den Rand unten in einem Dashboard festlegen. Wählen Sie aus vordefinierten Optionen in einem Drop-down-Menü aus. Ränder werden in Pixeln (px) gemessen.

Seitenränder: Optional können Sie einen bestimmten Wert für den Seitenrand eines Dashboards festlegen. Wählen Sie aus vordefinierten Optionen in einem Drop-down-Menü aus. Ränder werden in Pixeln (px) gemessen.

Dashboard-Tiles

Titelfarbe: Der hexadezimale Farbcode für die folgenden Elemente:

Textfarbe: Der hexadezimale Farbcode für die folgenden Elemente:

  • Text im Dashboard, einschließlich Legenden in Visualisierungen
  • Untertitel und Textkörper von Markdown-Kacheln, mit Ausnahme von Text der Überschriftsebene 1
  • Überschrift 1, Überschrift 2 und normaler Text auf Textkacheln
  • Kachelsymbole in Einzelwertvisualisierungen

Textkörperfarbe: Der hexadezimale Farbcode für die folgenden Elemente:

  • Fließtext, mit Ausnahme von Text der Überschriftsebene 2 und Überschriftsebene 3, in Markdown-Kacheln.
  • Anzeigentext in Text-Tiles

Hintergrundfarbe: Der hexadezimale Farbcode für den Hintergrund aller Kacheln mit Ausnahme von Textkacheln.

Hintergrundfarbe für Text: Der hexadezimale Farbcode für den Hintergrund von Textkacheln.

Titelausrichtung: Legen Sie die Ausrichtung von Kacheltiteln auf „Links“, „Rechts“ oder „Zentriert“ fest.

Schriftgröße für Titel: Optional können Sie die Schriftgröße von Dashboardkacheln aus einer Reihe vordefinierter Größen in Pixeln anpassen.

Schatten: Mit der CSS-Syntax können Sie einen Schatten um Dashboard-Kacheln erstellen. Sie können einen vordefinierten Schlagschatten auswählen oder einen benutzerdefinierten Schlagschatten erstellen. Wenn Sie einen benutzerdefinierten Schlagschatten erstellen möchten, geben Sie die gewünschten horizontal-offset vertical-offset blur-radius spread-radius color ein und wählen Sie Benutzerdefiniertes Styling eingeben aus, um die Einstellungen zu übernehmen. Rechts wird eine Vorschau der Einstellungen für den Schlagschatten angezeigt.

Spaltenabstandsgröße: Optional können Sie die Größe des Abstands zwischen den Spalten von Dashboard-Kacheln aus einer Reihe vordefinierter Größen in Pixeln anpassen.

Zeilenabstandsgröße: Optional können Sie die Größe des Abstands zwischen den Zeilen von Dashboardkacheln aus einer Reihe vordefinierter Größen in Pixeln anpassen.

Rahmenradius: Sie können den Rahmenradius von Dashboardkacheln optional anpassen, um quadratische oder abgerundete Ecken zu erstellen.

Design bearbeiten

Bei allen Designs können Sie auf die zugehörige Schaltfläche Bearbeiten klicken, um die Designeinstellungen zu aktualisieren.

Sie können die Einstellungen genauso bearbeiten wie beim Erstellen eines neuen Designs. Eine Beschreibung der Einstellungen finden Sie oben. Wählen Sie Speichern aus, um Ihre Änderungen zu speichern.

Design kopieren

Sie können ein vorhandenes Design kopieren, indem Sie das Menü des Designs und dann Design kopieren auswählen.

Wenn Sie ein Design kopieren, wird für das neue Design standardmäßig der Name des kopierten Designs mit der Endung „(Kopie)“ verwendet. Ändern Sie diesen Namen manuell in einen neuen, eindeutigen Namen, der nur alphanumerische Zeichen und Unterstriche enthält, und entfernen Sie die Klammern.

Die restlichen Einstellungen können Sie genauso bearbeiten wie beim Erstellen eines neuen Designs. Eine Beschreibung der Einstellungen finden Sie oben. Klicken Sie auf Speichern, damit alle Theme-Einstellungen beibehalten werden.

Design löschen

Wenn Sie ein Design löschen möchten, wählen Sie das Menü des Designs und dann Design löschen aus.

Standarddesign festlegen

Wenn Sie ein Design als Standarddesign festlegen, wird es auf alle Dashboards angewendet, in denen der Nutzer im Bearbeitungsmodus die Option Keine im Feld Designs auswählt.

Wenn Sie ein Design als Standarddesign festlegen möchten, wählen Sie das Menü des Designs und dann Als Standard festlegen aus.

Wenn Sie die Standardeinstellung aus dem Standarddesign entfernen möchten, wählen Sie das Menü des Designs und dann Standard entfernen aus.