Anda dapat menentukan tema di halaman Themes di bagian Platform pada panel Admin. Anda dapat menggunakan tema kustom untuk menyesuaikan jenis font, warna teks, warna latar belakang, warna tombol, warna ubin, dan elemen visual lainnya untuk dasbor, Look, dan Eksplorasi yang disematkan, serta jendela edit untuk ubin di dasbor yang disematkan dan antarmuka Analisis Percakapan.
Halaman ini menjelaskan hal berikut:
- Persyaratan instance untuk menggunakan tema tersemat
- Tentang halaman Tema
- Tema default Looker
- Cara tema diterapkan ke dasbor dan Explore sematan
- Cara membuat, menyalin, mengedit, dan menghapus tema kustom
- Cara menetapkan tema default untuk dasbor dan Explore
- Cara menerapkan tema selain default ke dasbor dan Eksplorasi yang dipilih
- Cara menerapkan argumen URL
_themeuntuk memilih elemen tema dasbor
Untuk mengetahui informasi tentang cara menetapkan tema default untuk dasbor dan Explore, atau untuk menerapkan tema ke dasbor atau Explore tertentu, lihat halaman dokumentasi Memulai penyematan — menerapkan tema kustom.
Persyaratan instance untuk menggunakan tema tersemat
Perhatikan persyaratan berikut untuk mengelola tema sematan di instance Looker:
- Jika instance Anda adalah instance Looker (asli), fitur yang memungkinkan Anda menyesuaikan tema untuk dasbor, Look, dan Eksplorasi yang disematkan harus diaktifkan oleh Looker. Hubungi spesialis penjualan Google Cloud untuk memperbarui lisensi Anda untuk fitur ini.
- Jika instance Anda adalah instance Looker (Google Cloud core), tema tersemat tersedia untuk edisi Enterprise dan Embed, tetapi tidak untuk edisi Standard.
- Pengguna Looker harus memiliki peran Admin atau peran yang berisi izin
manage_themes.
Tentang halaman Tema
Anda dapat mengelola tema untuk instance di halaman Themes di bagian Platform pada panel Admin.
Jika instance Anda mengaktifkan fitur pratinjau Internal Dashboard Theming, halaman Themes akan menampilkan tab Internal dan Embedded untuk mengelola tema dasbor Looker dan konten tersemat.
Tema default
Tema default Looker dibuat secara otomatis di instance Anda, dan tidak dapat dihapus atau diedit. Tema Looker digunakan sebagai tema default, kecuali jika admin Looker menentukan tema lain sebagai default.
Setelan tema Looker, yang dapat Anda lihat dengan memilih tombol Lihat di samping tema atau dengan membuat salinan tema, dikelompokkan ke dalam bagian berikut:
Tema
| Nama Setelan | Nilai |
|---|---|
| Nama | Looker |
Umum
Setelan di bagian ini berlaku untuk dasbor tersemat, Eksplorasi tersemat, dan antarmuka Conversational Analytics.
| Nama Setelan | Nilai | Catatan |
|---|---|---|
| Warna Utama | #1A73E8 |
Dasbor menggunakan warna ini untuk tombol utama dan kontrol filter.Eksplorasi menggunakan warna ini untuk tombol utama, banner, dan aksen. |
| Warna Teks | #3e3f40 |
|
| Warna Latar Belakang | #f6f8fa |
|
| Jenis Font | Roboto, Noto Sans JP, Noto Sans CJK KR, Noto Sans Arabic UI, Noto Sans Devanagari UI, Noto Sans Hebrew, Noto Sans Thai UI, Helvetica, Arial, sans-serif | Font ini disajikan oleh aplikasi Looker dan direkomendasikan karena akan tersedia di browser dan saat gambar dirender. Looker menggunakan font pertama dalam daftar kelompok font yang mendukung karakter, sehingga font dengan prioritas lebih tinggi atau khusus harus dicantumkan terlebih dahulu. Looker menggunakan variasi font "UI" jika tersedia, sehingga karakter sedikit diubah agar lebih sesuai dengan batas komponen visual. |
| Sumber Font | Tidak ada |
Halaman dasbor
| Nama Setelan | Nilai |
|---|---|
| Koleksi Warna | Tidak ada |
| Ukuran Font Judul | None |
| Margin Atas | None |
| Margin Bawah | None |
| Sisi Margin | None |
Kartu Dasbor
| Nama Setelan | Nilai |
|---|---|
| Warna Judul | #3a4245 |
| Warna Teks | #3a4245 |
| Warna Isi Teks | Tidak ada |
| Warna Latar Belakang | #ffffff |
| Warna Latar Belakang Teks | None |
| Perataan Judul | Tengah |
| Ukuran Font Judul | Tidak ada |
| Bayangan Kotak | Tidak ada |
| Ukuran Jarak Kolom | Tidak ada |
| Ukuran Jarak Baris | Tidak ada |
| Radius Batas | Tidak ada |
Kontrol Dasbor
| Nama Setelan | Nilai |
|---|---|
| Menampilkan Header Dasbor | Ya |
| Menampilkan Judul Dasbor | Ya |
| Judul Dasbor Pusat | Tidak |
| Menampilkan Kolom Filter | Ya |
| Tombol Filter Tampilan | Ya |
Halaman Jelajahi
| Nama Setelan | Nilai |
|---|---|
| Header Tampilan | Ya |
| Judul Tampilan | Ya |
| Menampilkan Eksekusi Terakhir | Ya |
| Zona Waktu Tampilan | Ya |
| Menampilkan Tombol Run | Ya |
| Tombol Setelan Tampilan | Ya |
| Menampilkan Indikator Terakhir Diperbarui di Dasbor | Ya |
| Ikon Muat Ulang Data Display | Ya |
| Tombol Tampilkan Opsi Lainnya | Ya |
Halaman tampilan
| Nama Setelan | Nilai |
|---|---|
| Header Tampilan | Ya |
| Judul Tampilan | Ya |
| Menampilkan Eksekusi Terakhir | Ya |
| Zona Waktu Tampilan | Ya |
| Menampilkan Tombol Run | Ya |
| Tombol Setelan Tampilan | Ya |
Berikut adalah contoh dasbor, jendela edit ubin dasbor, dan Eksplorasi dengan tema Looker.
Contoh dasbor dengan tema Looker

Contoh jendela edit ubin dasbor dengan tema Looker

Contoh halaman Explore dengan tema Looker

Cara penerapan tema dan setelan penyematan
Anda dapat mengubah tampilan dasbor atau Eksplorasi yang disematkan dari tema default menggunakan tema kustom dan argumen URL. Saat menampilkan dasbor atau Explore yang disematkan, Looker menerapkan setelan dalam urutan berikut:
- Dimulai dengan setelan dari tema default
- Menerapkan setelan dari tema kustom yang ditentukan dalam argumen
themeURL, jika ada - Menerapkan properti yang ditentukan dalam argumen URL
_theme, jika ada (khusus untuk dasbor)
Setiap item menggantikan item sebelumnya, yang berarti setelan sematan menggantikan setelan tema default, dan tema kustom menggantikan setelan sematan dan tema default.
Namun, dalam kasus argumen URL _theme, hanya elemen yang ditentukan dalam argumen _theme yang menggantikan elemen dari tema lain atau dari setelan sematan. Setelan tema kustom dan setelan penyematan lainnya akan tetap digunakan. Misalnya, jika Anda menambahkan argumen _theme={"show_filters_bar":false} di URL dasbor tersemat, panel filter tidak akan ditampilkan, meskipun Anda telah mengaktifkan Tampilkan Filter di setelan sematan atau di tema kustom. Namun, setelan lain dari tema kustom atau setelan sematan akan tetap digunakan.
Hasil download dasbor akan menampilkan tema kustom yang diterapkan.
Membuat tema kustom
Untuk membuat tema kustom untuk dasbor, Look, dan Eksplorasi sematan, di halaman admin Themes, pilih tab Embed, lalu klik Add Theme.
Selanjutnya, di halaman Tema Baru, tambahkan spesifikasi gaya dan warna untuk setiap setelan yang ingin Anda sesuaikan.
Kecuali untuk judul tema, yang harus unik, semua kolom akan otomatis diisi dengan nilai dari tema default. Anda dapat mengubah setelan apa pun, yang dijelaskan di bagian berikut. Pilih Simpan Tema untuk menyimpan perubahan dan menyimpan tema baru Anda.
Tema
Nama: Nama tema harus unik dan hanya boleh berisi karakter alfanumerik dan garis bawah. Jika Anda memasukkan spasi dalam nama tema, spasi akan diganti dengan garis bawah saat Anda menyimpan tema.
Umum
Setelan di bagian ini berlaku untuk dasbor tersemat dan Eksplorasi tersemat.
Warna Utama: Dasbor menggunakan warna ini untuk tombol utama dan kontrol filter. Eksplorasi menggunakan warna ini untuk link dan ikon pemilih kolom, tombol utama, banner, dan aksen.
Warna Teks: Kode warna heksadesimal untuk teks di Eksplorasi dan dasbor.
Warna Latar Belakang: Kode warna heksadesimal untuk latar belakang halaman Jelajahi dan dasbor.
Jenis Font: Nama jenis font. Font ini akan digunakan untuk semua teks di dasbor, termasuk judul ubin, ubin teks, dan legenda dalam visualisasi. Font ini juga akan digunakan untuk semua teks di Eksplorasi. Jika ada spasi pada nama font, gunakan tanda kutip di sekitar nama, seperti "Open Sans".
- Jika menggunakan font umum yang aman untuk web, Anda cukup mengetik nama font di kolom Jenis Font dan mengosongkan kolom Sumber Font. Jika Anda ingin menggunakan font yang kurang umum, masukkan nama font di kolom Jenis Font, lalu gunakan kolom Sumber Font, yang dijelaskan berikutnya, untuk memberikan URL ke definisi font yang ingin Anda gunakan.
Font Source: Biarkan kolom ini kosong kecuali jika Anda ingin menggunakan font kustom — font yang bukan font umum yang aman untuk web. Font Source harus berupa URL lengkap yang diawali dengan https dan mengarah ke nilai url yang ditentukan dalam argumen src dari @font-face. Sebaiknya gunakan file web open font format (.woff), karena file .woff2 tidak didukung oleh Internet Explorer 11.
- Misalnya, untuk PT Sans Narrow, Anda dapat memasukkan "PT Sans Narrow" di kolom jenis font, lalu memasukkan
https://fonts.gstatic.com/s/ptsansnarrow/v7/UyYrYy3ltEffJV9QueSi4RdbPw3QSf9R-kE0EsQUn2A.woffdi kolom Font Source.
Contoh Eksplorasi tersemat dengan tema kustom
Contoh berikut menunjukkan Explore tersemat yang memiliki tema kustom. Warna Utama ditetapkan ke #e82042, dan Jenis Font ditetapkan ke Verdana.
Saat Anda menjalankan Eksplorasi dalam setelan tersemat, teks dalam Eksplorasi akan muncul dalam jenis font Font Family yang ditentukan, yaitu Verdana. Warna aksen, tombol, dan link akan muncul dalam Warna Utama yang ditentukan, #e82042:

Setelah Eksplorasi dijalankan, garis batas dan teks tombol Run akan muncul dalam Key Color yang ditentukan, #e82042:

Contoh jendela edit ubin dasbor sematan dengan tema kustom
Selain elemen Eksplorasi yang dijelaskan di bagian sebelumnya, saat Anda mengedit kartu dasbor, banner akan muncul dalam bayangan yang ditentukan di setelan Warna Utama (#e82042), dan jenis font yang ditentukan di setelan Jenis Font (Verdana):

Halaman dasbor
Kumpulan Warna: Secara opsional, Anda dapat memilih kumpulan warna, yang merupakan kumpulan palet terkoordinasi yang cocok satu sama lain. Saat Anda menetapkan koleksi warna ke dasbor, semua deret data di semua ubin dasbor akan diwarnai sesuai dengan palet dalam koleksi, sehingga memastikan warna deret data dikoordinasikan di seluruh dasbor.
- Saat Anda menetapkan koleksi warna ke tema tersemat, koleksi warna tema akan menggantikan koleksi warna apa pun yang sebelumnya ditetapkan ke kartu. Namun, koleksi warna tema tidak akan menggantikan warna kustom yang ditetapkan ke deret data, dan tidak akan menggantikan pemformatan bersyarat yang diterapkan ke visualisasi tabel.
Warna Latar Belakang: Kode warna heksadesimal untuk latar belakang dasbor dan latar belakang ubin teks.
Margin Atas: Secara opsional, tetapkan nilai tertentu untuk margin di bagian atas dasbor. Pilih dari opsi yang telah ditentukan dalam menu drop-down. Margin diukur dalam piksel (px).
Margin Bottom: Tetapkan nilai tertentu secara opsional untuk margin di bagian bawah dasbor. Pilih dari opsi yang telah ditentukan dalam menu drop-down. Margin diukur dalam piksel (px).
Sisi Margin: Secara opsional, tetapkan nilai tertentu untuk margin di sisi dasbor. Pilih dari opsi yang telah ditentukan dalam menu drop-down. Margin diukur dalam piksel (px).
Kartu dasbor
Warna Judul: Kode warna heksadesimal untuk elemen berikut:
- Judul dasbor
- Judul ubin dasbor
- Judul dan teks level 1 header dari ubin Markdown
- Warna teks visualisasi KPI (Nilai Tunggal) dan visualisasi nilai tunggal (lama)
Warna Teks: Kode warna heksadesimal untuk elemen berikut:
- Teks di dasbor, termasuk legenda dalam visualisasi
- Subjudul dan teks isi, kecuali teks header level 1, dari ubin Markdown
- Header level 1, header level 2, dan teks normal di kartu teks
- Ikon ubin dalam visualisasi KPI (Nilai Tunggal) dan visualisasi nilai tunggal (lama)
Warna Isi Teks: Kode warna heksadesimal untuk elemen berikut:
- Teks isi, kecuali teks header level 2 dan header level 3, di ubin Markdown.
- Teks isi dalam kartu teks
Warna Latar Belakang: Kode warna heksadesimal untuk latar belakang semua kartu kecuali kartu teks. (Ubin teks menggunakan warna latar belakang yang sama dengan dasbor, yang ditetapkan menggunakan Background Color di bagian Dashboard Page.)
Perataan Judul: Tetapkan perataan judul kartu ke kiri, kanan, atau tengah.
Ukuran Font Judul: Sesuaikan ukuran font kartu dasbor secara opsional dari kumpulan ukuran yang telah ditentukan dalam piksel.
Box Shadow: Buat bayangan di sekitar kotak dasbor menggunakan sintaksis CSS. Anda dapat memilih dari bayangan kotak yang telah ditentukan atau membuat bayangan kotak kustom. Untuk membuat bayangan kotak kustom, masukkan horizontal-offset vertical-offset blur-radius spread-radius color yang diinginkan, lalu pilih Masukkan Gaya Kustom untuk menerapkan setelan Anda. Pratinjau setelan bayangan kotak ditampilkan di sebelah kanan.
Column Gap Size: Sesuaikan ukuran ruang di antara kolom ubin dasbor dari kumpulan ukuran yang telah ditentukan dalam piksel (opsional).
Row Gap Size: Anda dapat menyesuaikan ukuran ruang di antara baris kartu dasbor dari serangkaian ukuran yang telah ditentukan dalam piksel.
Radius Batas: Jika perlu, sesuaikan radius batas ubin dasbor untuk membuat sudut persegi atau bulat.
Kontrol dasbor
Tampilkan Header Dasbor: Nonaktifkan opsi ini untuk menyembunyikan seluruh header dasbor, termasuk semua filter dan kontrol dasbor. Jika opsi ini dinonaktifkan, semua opsi kontrol dasbor lainnya akan dibatalkan pilihannya dan dinonaktifkan.
Tampilkan Judul Dasbor: Centang kotak untuk menampilkan judul dasbor.
Center Dashboard Title: Centang kotak ini untuk menampilkan judul dasbor dengan perataan tengah di dasbor. Jika opsi ini tidak diaktifkan, judul dasbor akan rata kiri. Opsi ini hanya tersedia jika opsi Tampilkan Judul Dasbor telah diaktifkan.
Tampilkan Kolom Filter: Centang kotak untuk menampilkan kolom filter di bagian atas dasbor. Jika opsi ini tidak dipilih, opsi Tombol Tampilkan Filter tidak akan dipilih dan dinonaktifkan, sehingga menyembunyikan ikon filter dasbor.
Tombol Filter Tampilan: Centang kotak untuk menampilkan ikon filter dasbor.
Tampilkan Indikator Terakhir Diperbarui Dasbor: Centang kotak untuk menampilkan indikator terakhir diperbarui dasbor.
Tampilkan Ikon Muat Ulang Data: Centang kotak untuk menampilkan ikon muat ulang data dasbor.
Tampilkan Tombol opsi lainnya: Centang kotak untuk menampilkan menu dasbor tiga titik. Jika opsi ini tidak dicentang, opsi menu dasbor tidak akan tersedia.
Halaman Jelajahi
Dalam tema kustom, Anda dapat menyesuaikan elemen berikut di halaman Explore yang disematkan:
Display Header: Nonaktifkan opsi ini untuk menyembunyikan seluruh header Eksplorasi yang disematkan, termasuk judul, indikator terakhir dijalankan, zona waktu data, tombol Run, dan menu roda gigi Explore actions.
Display Title: Nonaktifkan opsi ini untuk menyembunyikan judul Explore yang disematkan.
Display Last Run: Nonaktifkan opsi ini untuk menyembunyikan berapa lama waktu yang lalu Eksplorasi dijalankan.
Display Timezone: Nonaktifkan opsi ini untuk menyembunyikan zona waktu data di Explore yang disematkan.
Display Run Button: Nonaktifkan opsi ini untuk menyembunyikan tombol Run di Explore yang disematkan.
Tombol Tindakan Tampilan: Nonaktifkan opsi ini untuk menyembunyikan menu roda gigi Tindakan Eksplorasi di Eksplorasi yang disematkan.
Halaman tampilan
Dalam tema kustom, Anda dapat menyesuaikan elemen berikut pada Look yang disematkan:
Display Header: Nonaktifkan opsi ini untuk menyembunyikan seluruh header Look yang disematkan, termasuk judul, indikator terakhir dijalankan, zona waktu data, tombol Run, dan menu roda gigi Explore actions.
Display Title: Nonaktifkan opsi ini untuk menyembunyikan judul Look yang disematkan.
Display Last Run: Nonaktifkan opsi ini untuk menyembunyikan berapa lama Look dijalankan.
Display Timezone: Nonaktifkan opsi ini untuk menyembunyikan zona waktu data di Look yang disematkan.
Display Run Button: Nonaktifkan opsi ini untuk menyembunyikan tombol Run pada Look yang disematkan. Jika Show Filters on Embedded Looks dinonaktifkan, tombol ini tidak akan menampilkan tombol Run.
Display Actions Button: Nonaktifkan opsi ini untuk menyembunyikan menu roda gigi Explore actions di Look yang disematkan.
Menyalin tema
Anda dapat menyalin tema yang ada dengan memilih menu tema, lalu memilih Salin Tema.
Saat Anda membuat salinan tema, nama tema baru akan ditetapkan secara default ke nama tema yang disalin, diikuti dengan "(salinan)". Pastikan untuk mengubah nama ini secara manual menjadi nama baru yang unik dengan hanya karakter alfanumerik dan garis bawah, serta pastikan untuk menghapus tanda kurung.
Anda dapat mengedit setelan lainnya seperti saat Anda membuat tema baru. Untuk deskripsi setelan, lihat setelan tema yang dijelaskan sebelumnya. Pastikan untuk memilih Simpan untuk menyimpan semua setelan tema Anda.
Mengedit tema
Tema Looker dibuat secara otomatis di instance Anda, dan tidak dapat diedit. (Jika ingin mengubah tema Looker, Anda dapat membuat salinan tema, lalu mengedit salinan tersebut.)
Untuk semua tema lainnya, Anda dapat memilih tombol Edit terkait untuk memperbarui setelan tema.
Anda dapat mengedit setelan seperti saat membuat tema baru. Untuk deskripsi setelan, lihat setelan tema yang dijelaskan sebelumnya. Pastikan untuk memilih Simpan agar pembaruan Anda tetap tersimpan.
Menghapus tema
Anda dapat menghapus tema apa pun kecuali tema Looker atau tema yang ditetapkan sebagai default. Untuk menghapus tema, pilih menu tema, lalu pilih Hapus Tema.
Setelah Anda menghapus tema, dasbor tersemat yang memiliki tema tersebut yang ditentukan dalam URL-nya akan menggunakan tema default.
Menetapkan tema default untuk dasbor dan Eksplorasi sematan
Tema kustom tidak didukung di Look yang disematkan. Tema kustom hanya tersedia untuk dasbor sematan dan Eksplorasi sematan.
Untuk menentukan tema default bagi dasbor dan Eksplorasi yang disematkan di instance Anda, pilih menu tema, lalu pilih Set as Default.
Tema default digunakan untuk dasbor dan Eksplorasi tersemat di instance Looker Anda, kecuali jika Anda menentukan setelan yang berbeda untuk dasbor atau Eksplorasi individual. Lihat bagian Cara tema dan setelan penyematan diterapkan di halaman ini untuk mengetahui informasi selengkapnya tentang cara tema dan setelan penyematan diterapkan ke dasbor atau Explore yang disematkan.
Menerapkan tema ke dasbor dan Explore sematan tertentu
Tema kustom tidak didukung di Look yang disematkan. Tema kustom hanya tersedia untuk dasbor sematan dan Eksplorasi sematan.
Jika Anda ingin dasbor atau Explore menggunakan tema selain tema default, Anda dapat menentukan tema yang berbeda di URL dasbor atau Explore yang disematkan. Untuk melakukannya, tambahkan parameter theme= dengan nama tema ke akhir URL sematan. Misalnya, jika Anda memiliki tema bernama "Red", Anda akan menambahkan theme=Red di akhir URL dasbor sematan:
https://example.cloud.looker.com/embed/dashboards/246?theme=red
Untuk Eksplorasi, Anda akan menambahkan theme=Red di akhir URL Eksplorasi sematan:
none
https://example.cloud.looker.com/embed/explore/model_name/explore_name?theme=red
Elemen tema di URL tidak peka huruf besar/kecil, jadi Anda dapat menggunakan theme=Red atau theme=red.
Menggunakan argumen URL _theme untuk menerapkan elemen tema dasbor satu per satu
Anda dapat menggunakan argumen URL _theme guna menyesuaikan setiap elemen tema untuk dasbor tersemat, seperti tile_background_color dan show_title.
Berikut adalah format untuk argumen URL _theme:
_theme={"<property>":value}
Misalnya, Anda dapat menggunakan _theme={"show_filters_bar":false} untuk menyembunyikan panel filter dasbor tersemat. URL lengkapnya mungkin terlihat seperti ini:
https://example.cloud.looker.com/embed/dashboards/236?_theme={"show_filters_bar":false}
Gunakan koma untuk menentukan beberapa properti tema:
_theme={"show_title":false,"show_filters_bar":false,"text_tile_text_color":"blue"}
Nilai warna harus dalam tanda petik, dan dapat dinyatakan dengan nama warna, atau dengan kode warna heksadesimal. Jika menggunakan kode hex, pastikan untuk menggunakan versi berenkode URL dari tanda #, yaitu %23. Misalnya, kedua argumen URL ini menentukan warna merah:
_theme={"title_color":"red","text_tile_text_color":"%23FF0000"}
Berikut beberapa hal yang perlu dipertimbangkan saat menggunakan objek _theme untuk dasbor tersemat:
- Elemen apa pun yang ditentukan dalam argumen URL
_themeakan menggantikan setelan untuk elemen tersebut di tema lainnya. Hal ini menjadikan argumen_themesebagai cara yang praktis untuk menyaring tema atau menyematkan setelan. Misalnya, Anda memiliki tema kustom yang menyembunyikan panel filter, tetapi Anda memiliki satu dasbor yang menampilkan panel filter. Anda dapat menggunakan tema kustom untuk dasbor, lalu menambahkan argumen_theme={"show_filters_bar":true}di URL dasbor tersemat untuk menampilkan panel filter di dasbor tersebut, tetapi tetap mempertahankan semua setelan tema kustom lainnya. Lihat bagian Cara tema dan setelan penyematan diterapkan di halaman ini untuk mengetahui informasi selengkapnya tentang cara tema dan setelan penyematan diterapkan ke dasbor yang disematkan. - Untuk skrip pemrograman, Anda harus mengenkode argumen
_themeke URL. - Argumen
_themetidak diterapkan saat mengirimkan dasbor tersemat dalam format PDF. - Argumen
_themediterapkan jika Anda mendownload dasbor sebagai PDF.