La personalizzazione dei temi delle dashboard e delle esplorazioni incorporate è una funzionalità che deve essere attivata da Looker. Contatta il tuo account manager Looker per aggiornare la tua licenza per questa funzionalità.
I temi personalizzati non sono supportati nei Look incorporati. I temi personalizzati sono disponibili solo per le dashboard incorporate e le esplorazioni incorporate.
Le opzioni per i temi personalizzati continuano a crescere man mano che aggiungiamo altre funzionalità. Quando aggiungiamo un'opzione per i temi personalizzati, a tutti i temi esistenti viene assegnato il valore predefinito per la nuova opzione. Il valore predefinito può quindi essere modificato utilizzando l'editor dei temi. Per scoprire le novità, consulta la sezione Impostazioni dei temi personalizzati di seguito oppure consulta la pagina della documentazione dell'API Create Theme per l'elenco delle impostazioni supportate per i temi.
Panoramica
Puoi definire i temi di dashboard incorporate, esplorazioni incorporate e la finestra di modifica per i riquadri di una dashboard incorporata dalla pagina Temi nella sezione Piattaforma del riquadro Amministratore:
Puoi utilizzare i temi personalizzati per personalizzare l'aspetto delle dashboard ed esplorazioni di Looker incorporate. Puoi utilizzare i temi per personalizzare la famiglia di caratteri, il colore del testo, il colore di sfondo, il colore dei pulsanti, il colore dei riquadri e altri elementi visivi.
Ad esempio, puoi creare un tema "scuro" per modificare l'aspetto della dashboard incorporata:
In questa pagina vengono descritti:
- Il tema predefinito di Looker
- Come vengono applicati i temi alle dashboard e alle esplorazioni incorporate
- Come creare, copiare, modificare ed eliminare un tema personalizzato
- Come impostare un tema predefinito per dashboard ed esplorazioni
- Come applicare un tema diverso da quello predefinito a dashboard ed esplorazioni selezionate
- Come applicare l'argomento URL
_themeper selezionare gli elementi del tema della dashboard
Tema predefinito
Il tema predefinito di Looker viene creato automaticamente sulla tua istanza e non può essere eliminato o modificato. Il tema Looker viene utilizzato come tema predefinito, a meno che un amministratore di Looker non specifichi un altro tema come predefinito.
Di seguito sono riportati alcuni esempi di dashboard, la finestra di modifica di un riquadro di una dashboard e un riquadro Esplora con il tema Looker.
Dashboard:
Modificare un riquadro della dashboard in modalità di modifica della dashboard:
Esplora:
Le impostazioni del tema Looker, che puoi vedere facendo clic sul pulsante Visualizza accanto al tema o creando una copia del tema, sono:
Tema:
| Nome impostazione | Valore | Note |
|---|---|---|
| Nome | Looker |
Generali:
Le impostazioni in questa sezione si applicano sia alle dashboard incorporate che alle esplorazioni incorporate.
| Nome impostazione | Valore | Note |
|---|---|---|
| Colore chiave | #1A73E8 |
Le dashboard precedenti utilizzano questo colore per i pulsanti principali. Le dashboard utilizzano questo colore per i pulsanti principali e i controlli filtro. Le esplorazioni utilizzano questo colore per i pulsanti principali, i banner e gli accenti. |
| Famiglia di caratteri | Roboto, 'Noto Sans JP', 'Noto Sans CJK KR', 'UI di Noto Sans arabo', 'Noto Sans Devanagari UI', 'Noto Sans Ebraico;&3; | Questi caratteri sono pubblicati dall'applicazione Looker e sono consigliati perché saranno disponibili sia nei browser sia durante il rendering delle immagini. Poiché Looker utilizza il primo carattere dell'elenco delle famiglie di caratteri che supporta un carattere, devi indicarne prima la priorità o i caratteri specializzati. Looker utilizza l'"UI": varianti di caratteri, se disponibili, per modificare leggermente i caratteri al fine di adattarli meglio ai componenti visivi. |
| Origine carattere | Nessuno |
Pagina Dashboard:
| Nome impostazione | Valore | Note |
|---|---|---|
| Raccolta colori | Nessuno | |
| Colore sfondo | #f6f8fa |
Riquadri di dashboard:
| Nome impostazione | Valore | Note |
|---|---|---|
| Colore titolo | #3a4245 |
|
| Colore testo | #3a4245 |
|
| Colore del testo del testo | Nessuno | |
| Colore sfondo | #ffffff |
|
| Allineamento del titolo | Al centro | Non disponibile per le dashboard precedenti |
Colori dei pulsanti delle dashboard precedenti:
Solo per le dashboard legacy:
| Nome impostazione | Valore | Note |
|---|---|---|
| Colore pulsante informazioni | #0087e1 |
|
| Colore pulsante di avviso | #980c11 |
Controlli della dashboard:
| Nome impostazione | Valore | Note |
|---|---|---|
| Titolo visualizzazione dashboard | Sì | |
| Barra dei filtri di visualizzazione | Sì |
Come vengono applicati i temi e le impostazioni di incorporamento
Puoi modificare l'aspetto di una dashboard incorporata o di un'esplorazione dal tema predefinito utilizzando le impostazioni di incorporamento e i temi personalizzati. Quando visualizzi una dashboard incorporata o un Explore, Looker applica le impostazioni nel seguente modo:
- Inizia con le impostazioni del tema predefinito
- Applica le personalizzazioni dell'opzione Modifica impostazioni di incorporamento di un menu a forma di ingranaggio della dashboard precedente (se presente)
- Consente di applicare le impostazioni dal tema personalizzato specificato nell'argomento
themedell'URL, se presente. - Applica le proprietà specificate nell'argomento URL
_theme, se presente (solo per le dashboard)
Ogni elemento sostituisce gli elementi precedenti, il che significa che le impostazioni di incorporamento sostituiscono le impostazioni predefinite, mentre i temi personalizzati sostituiscono le impostazioni di incorporamento e i temi predefiniti.
Tuttavia, nel caso dell'argomento URL _theme, solo gli elementi specificati nell'argomento _theme sostituiscono quelli degli altri temi o delle impostazioni di incorporamento. Le altre impostazioni dei temi personalizzati e quelle di incorporamento continueranno a essere utilizzate. Ad esempio, se aggiungi l'argomento _theme={"show_filters_bar":false} in un URL nella dashboard incorporata, la barra dei filtri non verrà visualizzata, anche se hai attivato Mostra filtri nelle impostazioni di incorporamento o in un tema personalizzato. Tuttavia, verranno utilizzate le altre impostazioni del tema personalizzato o delle impostazioni di incorporamento.
Creare un tema personalizzato
Per creare un tema personalizzato, fai clic su Aggiungi tema:
Successivamente, aggiungi le specifiche di stile e colore per ogni impostazione desiderata nella pagina Nuovo tema:
Ad eccezione del titolo, che deve essere univoco, tutti i campi vengono compilati automaticamente con i valori del tema predefinito. Puoi modificare tutte le impostazioni descritte nelle sezioni di seguito. Fai clic su Salva tema per mantenere le modifiche e salvare il nuovo tema.
Tema
Nome: il nome del tema deve essere univoco e può contenere solo caratteri alfanumerici e trattini bassi. Se inserisci spazi nel nome del tema, quando lo salvi saranno sostituiti da trattini bassi.
Generale
Le impostazioni in questa sezione si applicano sia alle dashboard incorporate che alle esplorazioni incorporate.
Colore chiave: le dashboard utilizzano questo colore per i pulsanti principali e i controlli filtro. Le esplorazioni utilizzano questo colore per i link e le icone dei selettori di campo, per i pulsanti principali, per i banner e per gli accenti. Le dashboard legacy utilizzano questo colore per i pulsanti principali.
Famiglia di caratteri: il nome della famiglia di caratteri. Questo carattere verrà utilizzato per tutto il testo della dashboard, inclusi titoli, riquadri di testo e legende nelle visualizzazioni. Questo carattere verrà utilizzato anche per tutto il testo di un'esplorazione. Se nel nome è presente uno spazio nel nome del carattere, racchiudilo tra virgolette, ad esempio "Apri Sans".
- Se utilizzi un caratteri sicuri per il Web, puoi semplicemente digitare il nome nel campo Famiglia di caratteri e lasciare vuoto il campo Origine carattere. Se vuoi utilizzare un carattere meno comune, inserisci il nome del carattere nel campo Famiglia di caratteri, quindi utilizza il campo Origine carattere di seguito per fornire un URL alla definizione del carattere che vuoi utilizzare.
Origine carattere: lascia vuoto questo campo se non vuoi utilizzare un carattere personalizzato, ovvero un carattere non sicuro per il Web. L'origine del carattere deve essere un URL completo che inizia con https e rimanda al valore url specificato nell'argomento src di @font-face. Consigliamo di utilizzare un file in formato Web Open Font (.woff), poiché i file .woff2 non sono supportati da Internet Explorer 11.
- Ad esempio, per PT Sansstretta, puoi inserire "PT Sans Stretto" nel campo Famiglia di caratteri e quindi inserire
https://fonts.gstatic.com/s/ptsansnarrow/v7/UyYrYy3ltEffJV9QueSi4RdbPw3QSf9R-kE0EsQUn2A.woffnel campo Origine carattere.
Esplora esempi
I seguenti esempi mostrano esplorazioni incorporate che hanno un tema personalizzato. Il Colore chiave è impostato su #e82042 e la Famiglia di caratteri è impostata su Verdana.
Esplorazione incorporata
Quando esegui un'esplorazione in un'impostazione incorporata, il testo dell'esplorazione appare nel carattere Famiglia di caratteri specificato, Verdana. I colori complementari, i pulsanti e i link vengono visualizzati nel colore della chiave specificato, #e82042:
Dopo l'esecuzione di un'esplorazione, il contorno del pulsante Esegui e il testo vengono visualizzati nel colore della chiave specificato #e82042:
Finestra di modifica di un riquadro in una dashboard incorporata in modalità di modifica
Oltre agli elementi Esplora sopra, quando modifichi un riquadro della dashboard, il banner viene visualizzato nell'area specificata nell'impostazione Colore chiave (#e82042) e nel carattere specificato nell'impostazione Famiglia di caratteri (Verdana):
Pagina dashboard
Raccolta dei colori: se vuoi, puoi scegliere una raccolta di colori, ossia un insieme di tavolozze di coordinamento che funzionano bene insieme. Quando assegni una raccolta di colori a una dashboard, tutte le serie di dati in tutti i riquadri della dashboard vengono colorati in base alle tavolozze della raccolta, assicurando che i colori della serie di dati siano coordinati su tutta la dashboard.
- Quando assegni una raccolta di colori a un tema incorporato, la raccolta di colori del tema sostituirà quella precedente assegnata a un riquadro. Tuttavia, la raccolta dei colori di un tema non sostituirà i colori personalizzati assegnati a una serie di dati, né la formattazione condizionale applicata a una visualizzazione tabella.
Colore sfondo: il codice colore esadecimale per lo sfondo di tutti i riquadri, ad eccezione dei riquadri di testo. I riquadri di testo utilizzano lo stesso colore di sfondo della dashboard, che viene impostato utilizzando il colore di sfondo nella sezione Pagina della dashboard.
Riquadri della dashboard
Colore titolo: il codice esadecimale del colore del titolo della dashboard e dei titoli dei relativi riquadri. Questo colore non si applica ai titoli dei riquadri di testo. utilizza il campo Colore testo.
Colore testo: il codice colore esadecimale del testo nella dashboard, tra cui le legende nelle visualizzazioni, il testo nelle visualizzazioni a valore singolo e il titolo dei riquadri di testo.
Colore corpo del testo: il codice colore esadecimale per il corpo del testo e il testo dei sottotitoli nei riquadri di testo.
Colore sfondo: il codice colore esadecimale per lo sfondo di tutti i riquadri, ad eccezione dei riquadri di testo. I riquadri di testo utilizzano lo stesso colore di sfondo della dashboard, che viene impostato utilizzando il colore di sfondo nella sezione Pagina della dashboard.
Allineamento del titolo: imposta l'allineamento dei titoli del riquadro a sinistra, a destra o al centro. Questa opzione non è disponibile per le dashboard precedenti.
Colori dei pulsanti della dashboard precedente
Queste impostazioni sono disponibili solo per le dashboard precedenti.
Colore pulsante informazioni: l'impostazione Colore pulsante informazioni è riservata ai miglioramenti futuri.
Colore pulsante di avviso: il codice colore esadecimale per il colore del pulsante quando è in uno stato di avviso. Ad esempio, quando una dashboard viene aggiornata, il pulsante utilizza questo codice di colore con l'etichetta Stop. Il colore del testo nel pulsante è determinato dall'impostazione Colore testo sopra.
Controlli della dashboard
Mostra titolo dashboard: seleziona la casella di controllo per visualizzare il titolo della dashboard.
Barra dei filtri di visualizzazione: seleziona la casella di controllo per visualizzare la barra dei filtri nella parte superiore della dashboard.
Assicurati di fare clic su Salva tema per conservare le impostazioni del tema.
Copia di un tema
Per copiare un tema esistente, fai clic sul menu del tema e seleziona Copia tema:
Quando crei una copia di un tema, il nome del nuovo tema viene impostato automaticamente sul nome del tema copiato, seguito da "(copia)". Ricorda di modificare manualmente questo nome in un nuovo nome univoco con solo caratteri alfanumerici e trattini bassi e assicurati di rimuovere le parentesi.
Puoi modificare le altre impostazioni come quando crei un nuovo tema. Per una descrizione delle impostazioni, vedi le impostazioni del tema qui sopra. Assicurati di fare clic su Salva per mantenere tutte le impostazioni del tema.
Modificare un tema
Il tema Looker viene creato automaticamente sulla tua istanza e non può essere modificato. Se invece vuoi modificare il tema Looker, puoi crearne una copia e poi modificarlo.
Per tutti gli altri temi, puoi fare clic sul pulsante Modifica associato per aggiornare le impostazioni dei temi:
Puoi modificare le impostazioni come faresti quando crei un nuovo tema. Per una descrizione delle impostazioni, vedi le impostazioni del tema qui sopra. Assicurati di fare clic su Salva per mantenere gli aggiornamenti.
Eliminare un tema
Puoi eliminare qualsiasi tema tranne il Looker o quello attualmente impostato come predefinito. Per eliminare un tema, fai clic sul menu del tema e seleziona Elimina tema:
Dopo aver eliminato un tema, qualsiasi dashboard incorporata con quel tema specificato nel suo URL utilizzerà il tema predefinito.
Impostazione di un tema predefinito per le dashboard incorporate e le esplorazioni
I temi personalizzati non sono supportati nei Look incorporati. I temi personalizzati sono disponibili solo per le dashboard incorporate e le esplorazioni incorporate.
Per specificare il tema predefinito per le dashboard incorporate e le esplorazioni della tua istanza, fai clic sul menu di un tema e seleziona Imposta come predefinito:
Il tema predefinito viene utilizzato per le dashboard incorporate e le esplorazioni nell'istanza di Looker, a meno che non specifichi impostazioni diverse per una singola dashboard o un'esplorazione. Consulta la sezione Come vengono applicati i temi e le impostazioni di incorporamento in questa pagina per saperne di più su come i temi e le impostazioni di incorporamento vengono applicati a una dashboard incorporata o in Esplora.
Applicare un tema a dashboard incorporate specifiche ed esplorazioni.
I temi personalizzati non sono supportati nei Look incorporati. I temi personalizzati sono disponibili solo per le dashboard incorporate e le esplorazioni incorporate.
Se vuoi che una dashboard o un'esplorazione utilizzi un tema diverso da quello predefinito, puoi specificare un tema diverso nell'URL della dashboard incorporata o esplorare. A tale scopo, aggiungi il parametro theme= con il nome del tema alla fine dell'URL di incorporamento. Ad esempio, se hai un tema chiamato"Rosso", aggiungi theme=Red alla fine dell'URL della dashboard di incorporamento:
https://example.looker.com/embed/dashboards/246?theme=red
Per le esplorazioni, devi aggiungere theme=Red alla fine dell'URL di esplorazione dell'incorporamento:
none
https://example.looker.com/embed/explore/model_name/explore_name?theme=red
L'elemento del tema nell'URL non è sensibile alle maiuscole, quindi puoi utilizzare theme=Red o theme=red.
Le impostazioni del tema personalizzato sostituiscono qualsiasi impostazione di incorporamento specificata per una dashboard precedente. Consulta la sezione Come vengono applicati i temi e le impostazioni di incorporamento in questa pagina per ulteriori informazioni su come vengono applicati i temi e le impostazioni di incorporamento a una dashboard incorporata.
Utilizzare l'argomento URL _theme per applicare singoli elementi del tema della dashboard
Puoi utilizzare l'argomento URL _theme per personalizzare singoli elementi del tema per la dashboard incorporata, ad esempio tile_background_color e show_title.
Per visualizzare tutte le proprietà supportate dell'oggetto
_theme, fai riferimento all'elenco nella sezione "ThemeSettings" della pagina della documentazione relativa all'API Create Theme.
Ecco il formato per l'argomento URL _theme:
_theme={"<property>":value}
Ad esempio, puoi utilizzare _theme={"show_filters_bar":false} per nascondere la barra dei filtri della dashboard incorporata. L'URL completo potrebbe avere il seguente aspetto:
https://example.looker.com/embed/dashboards/236?_theme={"show_filters_bar":false}
Utilizza una virgola per specificare più proprietà di un tema:
_theme={"show_title":false,"show_filters_bar":false,"text_tile_text_color":"blue"}
I valori di colore devono essere tra virgolette e possono essere espressi con il nome del colore o con il codice colore esadecimale. Se utilizzi un codice esadecimale, assicurati di utilizzare la versione con codifica URL del simbolo #, che è %23. Ad esempio, entrambi gli argomenti di URL specificano il colore rosso:
_theme={"title_color":"red","text_tile_text_color":"%23FF0000"}
Di seguito sono riportati alcuni aspetti da considerare quando utilizzi l'oggetto _theme per una dashboard incorporata:
- Qualsiasi elemento specificato nell'argomento URL
_themesostituirà le impostazioni di quell'elemento in qualsiasi altro tema o nelle impostazioni di incorporamento per una dashboard precedente. In questo modo l'argomento_themeè un modo utile per perfezionare i temi o le impostazioni di incorporamento. Ad esempio, supponiamo che tu abbia un tema personalizzato che nasconda la barra dei filtri, ma che tu abbia una dashboard in cui è utile mostrare la barra dei filtri. Puoi utilizzare il tema personalizzato per la tua dashboard e poi aggiungere l'argomento_theme={"show_filters_bar":true}nell'URL della dashboard incorporata per visualizzare la barra dei filtri su quella dashboard, ma mantenere tutte le altre impostazioni del tema personalizzato. Consulta la sezione Come vengono applicati i temi e le impostazioni di incorporamento in questa pagina per ulteriori informazioni su come vengono applicati i temi e le impostazioni di incorporamento a una dashboard incorporata. - Per gli script di programmazione, devi codificare per URL l'argomento
_theme. - L'argomento
_themenon viene applicato quando si pubblicano dashboard legacy incorporate o dashboard incorporate in formato PDF. - L'argomento
_themeviene applicato se scarichi la dashboard come PDF.