Looker 22.16 문서를 보고 있습니다. 최신 문서는 여기에서 확인할 수 있습니다.

삽입된 대시보드 및 탐색용 테마 만들기 및 적용

삽입된 대시보드 및 탐색의 테마 맞춤설정은 Looker에서 사용 설정해야 하는 기능입니다. 이 기능의 라이선스를 업데이트하려면 Looker 계정 관리자에게 문의하세요.

삽입된 테마에서는 맞춤 테마가 지원되지 않습니다. 맞춤 테마는 삽입된 대시보드와 삽입된 탐색에서만 사용할 수 있습니다.

기능이 추가됨에 따라 맞춤 테마 옵션이 계속 늘어납니다. 맞춤 테마 옵션을 추가하면 기존 테마에 새 옵션의 기본값이 할당됩니다. 그러면 기본값은 테마 편집기를 사용하여 수정할 수 있습니다. 새로운 기능을 확인하려면 아래의 맞춤 테마 설정 섹션을 확인하거나 테마 만들기 API 문서 페이지에서 테마에 지원되는 설정 목록을 확인하세요.

개요

다음과 같이 관리 패널의 플랫폼 내 테마 페이지에서 삽입된 대시보드, 삽입된 탐색 분석, 삽입된 대시보드에 대한 수정 창의 테마를 정의할 수 있습니다.

맞춤 테마를 사용하여 삽입된 Looker 대시보드 및 탐색의 모양을 맞춤설정할 수 있습니다. 테마를 사용하여 글꼴 모음, 텍스트 색상, 배경 색상, 버튼 색상, 타일 색상 및 기타 시각적 요소를 맞춤설정할 수 있습니다.

예를 들어 '어두운' 테마를 만들어 삽입된 대시보드의 모양을 변경할 수 있습니다.

이 페이지에서는 다음 주제에 대해 설명합니다.

Looker 기본 테마
삽입된 대시보드와 탐색 분석에 테마가 적용되는 방법
맞춤 테마 만들기, 복사, 수정, 삭제하는 방법
대시보드 및 탐색의 기본 테마를 설정하는 방법
선택한 대시보드 및 탐색 분석에 기본 이외의 테마를 적용하는 방법
_theme URL 인수를 적용하여 대시보드 테마 요소를 선택하는 방법

기본 테마

Looker 기본 테마는 인스턴스에 자동으로 생성되며 삭제하거나 수정할 수 없습니다. Looker 테마는 Looker 관리자가 다른 테마를 기본 테마로 지정하지 않는 한 기본 테마로 사용됩니다.

다음은 대시보드, 대시보드 타일의 수정 창, Looker 테마의 탐색 분석 예시입니다.

대시보드:

대시보드 수정 모드에서 대시보드 타일 수정하기:

탐색:

Looker 테마 설정은 테마 옆에 있는 보기 버튼을 클릭하거나 테마의 사본을 만들어 확인할 수 있습니다.

테마:

설정 이름	값	참고
이름	Looker

일반:

이 섹션의 설정은 삽입된 대시보드와 삽입된 탐색 분석에 모두 적용됩니다.

설정 이름	값	참고
키 색상	`#1A73E8`	기존 대시보드는 기본 버튼에 이 색상을 사용합니다. 대시보드는 기본 버튼 및 필터 컨트롤에 이 색상을 사용합니다. 탐색은 기본 버튼, 배너, 강조 기능에 이 색상을 사용합니다.
글꼴 모음	Roboto, Noto Sans CJK KR, Noto Sans CJK, Noto Sans 아랍어 UI, Noto Sans Devanagari UI, Noto Sans Hesrew	이러한 글꼴은 Looker 애플리케이션에서 제공하며 브라우저와 이미지 렌더링 시 모두 사용할 수 있으므로 권장됩니다. Looker는 문자를 지원하는 글꼴 모음 목록의 첫 번째 글꼴을 사용하므로 더 높은 우선순위 또는 특수 글꼴을 먼저 나열해야 합니다. 가능한 경우 Looker에서 글꼴의 다양한 변형을 사용하여 시각적 구성요소의 경계에 맞게 문자가 약간 수정되도록 합니다.
글꼴 소스	없음

대시보드 페이지:

설정 이름	값	참고
색상 컬렉션	없음
배경 색상	`#f6f8fa`

대시보드 타일:

설정 이름	값	참고
제목 색상	`#3a4245`
텍스트 색상	`#3a4245`
텍스트 본문 색상	없음
배경 색상	`#ffffff`
제목 정렬	가운데 정렬	기존 대시보드에는 사용할 수 없습니다.

기존 대시보드 버튼 색상:

기존 대시보드 전용 설정:

설정 이름	값	참고
정보 버튼 색상	`#0087e1`
경고 버튼 색상	`#980c11`

대시보드 제어 기능:

설정 이름	값	참고
대시보드 제목 표시	예
디스플레이 필터 막대	예

테마 및 삽입 설정 적용 방법

삽입된 설정과 맞춤 테마를 사용해 삽입된 대시보드 또는 탐색의 모양을 기본 테마에서 변경할 수 있습니다. 삽입된 대시보드 또는 탐색 분석을 표시할 때 Looker는 다음과 같은 방식으로 설정을 적용합니다.

기본 테마의 설정으로 시작합니다.
기존 대시보드 톱니바퀴 메뉴가 있는 경우 삽입 설정 수정 옵션에서 맞춤설정을 적용합니다.
URL의 theme 인수(지정된 경우)에 지정된 맞춤 테마의 설정을 적용합니다.
_theme URL 인수 (있는 경우)에 지정된 속성을 적용합니다.

각 항목은 이전 항목을 재정의합니다. 즉, 삽입 설정이 기본 테마 설정보다 우선 적용되고, 맞춤 테마가 삽입 설정 및 기본 테마보다 우선 적용됩니다.

그러나 _theme URL 인수의 경우 _theme 인수에 지정된 요소만 다른 테마 또는 삽입 설정의 요소보다 우선 적용됩니다. 나머지 맞춤 테마 설정과 삽입 설정은 계속 사용됩니다. 예를 들어 삽입된 대시보드의 URL에 _theme={"show_filters_bar":false} 인수를 추가하면 삽입 설정 또는 맞춤 테마에서 필터 표시를 사용 설정했더라도 필터 표시줄이 표시되지 않습니다. 하지만 맞춤 테마 또는 삽입 설정의 다른 설정은 계속 사용됩니다.

맞춤 테마 만들기

맞춤 테마를 만들려면 테마 추가를 클릭합니다.

그런 다음 New Theme 페이지에서 원하는 각 설정의 스타일과 색상 사양을 추가합니다.

고유해야 하는 테마 제목을 제외하고 모든 필드는 기본 테마의 값으로 자동으로 채워집니다. 이러한 설정은 아래 섹션에 설명된 대로 변경할 수 있습니다. 테마 저장을 클릭하여 변경사항을 유지하고 새 테마를 저장합니다.

테마

이름: 테마 이름은 고유해야 하며 영숫자와 밑줄만 포함할 수 있습니다. 테마 이름에 공백을 입력하면 테마를 저장할 때 공백이 밑줄로 대체됩니다.

일반

이 섹션의 설정은 삽입된 대시보드와 삽입된 탐색 분석에 모두 적용됩니다.

키 색상: 대시보드에서 기본 버튼과 필터 컨트롤에 이 색상을 사용합니다. 탐색은 필드 선택 도구 링크 및 아이콘, 기본 버튼, 배너, 악센트에 이 색상을 사용합니다. 레거시 대시보드는 기본 버튼에 이 색상을 사용합니다.

글꼴 모음: 글꼴 모음의 이름입니다. 이 글꼴은 타일 제목, 텍스트 타일, 시각화의 범례를 포함하여 대시보드의 모든 텍스트에 사용됩니다. 이 글꼴은 탐색 분석의 모든 텍스트에도 사용됩니다. 글꼴 이름에 공백이 있으면 "Open Sans"와 같이 따옴표를 사용합니다.

일반 웹 보안 글꼴을 사용하는 경우 글꼴 모음 필드에 글꼴 이름을 입력하고 글꼴 소스 입력란은 비워도 됩니다. 일반적이지 않은 글꼴을 사용하려면 글꼴 모음 필드에 글꼴 이름을 입력한 다음 아래의 글꼴 소스 필드를 사용하여 사용할 글꼴 정의의 URL을 제공합니다.

글꼴 소스: 맞춤 글꼴(일반 웹 안전 글꼴이 아닌 글꼴)을 사용하지 않는 한 이 입력란을 비워 둡니다. 글꼴 소스는 https로 시작하고 @font-face의 src 인수에 지정된 url 값을 가리키는 전체 URL이어야 합니다. .woff2 파일은 Internet Explorer 11에서 지원되지 않으므로 웹 오프닝 글꼴 형식(.woff)을 사용하는 것이 좋습니다.

예를 들어 PT Sans Narrow의 경우 Font Family 필드에 quopt;PT Sans Narrow"를 입력한 다음 Font Source 입력란에 https://fonts.gstatic.com/s/ptsansnarrow/v7/UyYrYy3ltEffJV9QueSi4RdbPw3QSf9R-kE0EsQUn2A.woff를 입력할 수 있습니다.

예시 살펴보기

다음 예에서는 맞춤 테마가 있는 삽입된 탐색 분석을 보여줍니다. Key Color는 #e82042로, Font Family는 Verdana로 설정됩니다.

삽입 탐색

삽입된 설정에서 '탐색'을 실행하면 탐색의 텍스트가 지정된 글꼴 모음 글꼴인 Verdana에 표시됩니다. 강조 색상, 버튼, 링크가 지정된 키 색상, #e82042에 표시됩니다.

탐색이 실행되면 지정된 키 색상, #e82042에 실행 버튼 윤곽선과 텍스트가 표시됩니다.

수정 모드의 삽입된 대시보드에 있는 타일의 수정 창

위의 탐색 요소 외에도 대시보드 타일을 수정할 때 키 색상 설정 (#e82042)에 지정된 음영과 글꼴 모음 설정 (Verdana)에 지정된 글꼴이 배너에 표시됩니다.

대시보드 페이지

색상 컬렉션: 원하는 경우 서로 잘 어울리는 조정 팔레트 조합인 색상 컬렉션을 선택할 수 있습니다. 대시보드에 색상 컬렉션을 할당하면 모든 대시보드의 타일에 있는 모든 데이터 계열이 컬렉션의 팔레트에 따라 색상이 지정되므로 데이터 계열의 색상이 전체 대시보드에 맞춰 조정됩니다.

삽입된 테마에 색상 모음을 할당하면 테마의 색상 컬렉션이 이전에 타일에 할당된 색상 컬렉션보다 우선 적용됩니다. 그러나 테마의 색상 컬렉션은 데이터 계열에 할당된 맞춤설정된 색상이나 재정의가 표 시각화에 적용된 조건부 서식보다 우선 적용되지 않습니다.

배경 색상: 텍스트 타일을 제외한 모든 타일의 배경에 대한 16진수 색상 코드입니다. (텍스트 타일은 대시보드 페이지 섹션의 배경 색상을 사용하여 설정된 대시보드와 동일한 배경 색상을 사용합니다.)

대시보드 타일

제목 색상: 대시보드 제목 및 대시보드 타일 제목의 16진수 색상 코드입니다. (텍스트 색상의 제목에는 이 색상이 적용되지 않습니다. 텍스트 색상 필드를 사용하세요.

텍스트 색상: 시각화의 범례, 단일 값 시각화의 텍스트, 텍스트 타일의 제목을 비롯하여 대시보드의 텍스트에 대한 16진수 색상 코드입니다.

텍스트 본문 색상: 텍스트 타일의 본문 텍스트 및 자막 텍스트에 대한 16진수 색상 코드입니다.

제목 정렬: 타일 제목의 정렬을 왼쪽, 오른쪽 또는 가운데로 설정합니다. 기존 대시보드에는 이 옵션을 사용할 수 없습니다.

기존 대시보드 버튼 색상

이 설정은 기존 대시보드에서만 사용할 수 있습니다.

정보 버튼 색상: 향후 개선사항을 위해 정보 버튼 색상 설정을 지정합니다.

경고 버튼 색상: 버튼 상태가 경고 상태일 때 버튼 색상의 16진수 색상 코드입니다. 예를 들어 대시보드를 업데이트할 때 버튼은 이 색상 코드를 Stop이라는 라벨과 함께 사용합니다. 버튼의 텍스트 색상은 위의 텍스트 색상 설정에 따라 결정됩니다.

대시보드 컨트롤

대시보드 제목 표시: 체크박스를 선택하여 대시보드의 제목을 표시합니다.

필터 막대 표시: 체크박스를 선택하여 대시보드 상단에 필터 표시줄을 표시합니다.

테마 설정을 유지하려면 테마 저장을 클릭하세요.

테마 복사

테마 메뉴를 클릭하고 테마 복사를 선택하여 기존 테마를 복사할 수 있습니다.

테마 사본을 만들 때 새 테마의 이름은 기본적으로 복사된 테마의 이름 뒤에 이어서 '(복사)'로 지정됩니다. 이 이름을 영숫자 및 밑줄만 사용하는 고유한 새 이름으로 직접 변경해야 하며 괄호를 삭제해야 합니다.

나머지 설정은 새 테마를 생성할 때처럼 수정할 수 있습니다. 설정에 대한 설명은 위의 테마 설정을 참고하세요. 모든 테마 설정을 유지하려면 저장을 클릭합니다.

테마 수정

Looker 테마는 인스턴스에서 자동으로 생성되며 수정할 수 없습니다. Looker 테마를 수정하려면 테마 사본을 만든 후 사본을 수정하면 됩니다.

다른 테마의 경우 연결된 수정 버튼을 클릭하여 테마 설정을 업데이트할 수 있습니다.

새 테마를 만들 때와 마찬가지로 설정을 수정할 수 있습니다. 설정에 대한 설명은 위의 테마 설정을 참고하세요. 업데이트를 유지하려면 저장을 클릭하세요.

테마 삭제

Looker 테마 또는 현재 기본으로 설정된 테마를 제외한 모든 테마를 삭제할 수 있습니다. 테마를 삭제하려면 테마 메뉴를 클릭하고 테마 삭제를 선택합니다.

테마를 삭제하면 테마에 URL이 지정된 삽입된 대시보드가 기본 테마를 사용합니다.

삽입된 대시보드 및 탐색의 기본 테마 설정

삽입된 테마에서는 맞춤 테마가 지원되지 않습니다. 맞춤 테마는 삽입된 대시보드와 삽입된 탐색에서만 사용할 수 있습니다.

삽입된 대시보드 및 인스턴스의 탐색 분석에 사용할 기본 테마를 지정하려면 테마 메뉴를 클릭하고 기본값으로 설정을 선택하세요.

개별 대시보드 또는 탐색에 다른 설정을 지정하지 않는 한 기본 테마가 Looker 인스턴스의 삽입된 대시보드와 탐색에 사용됩니다. 삽입된 대시보드 또는 탐색에 테마 및 삽입 설정이 적용되는 방법에 대한 자세한 내용은 이 페이지의 테마 및 퍼가기 설정 적용 방법 섹션을 참고하세요.

삽입된 특정 대시보드 및 탐색 분석에 테마 적용

삽입된 테마에서는 맞춤 테마가 지원되지 않습니다. 맞춤 테마는 삽입된 대시보드와 삽입된 탐색에서만 사용할 수 있습니다.

대시보드나 탐색에서 기본 테마가 아닌 다른 테마를 사용하려면 삽입된 대시보드 또는 탐색의 URL에 다른 테마를 지정하면 됩니다. 이렇게 하려면 테마 이름이 있는 theme= 매개변수를 삽입 URL 끝에 추가합니다. 예를 들어 "Red'라는 테마가 있는 경우 삽입 대시보드 URL 끝에 theme=Red을 추가합니다.

https://example.looker.com/embed/dashboards/246?theme=red

탐색 분석의 경우 삽입된 탐색 URL 끝에 theme=Red을 추가합니다. none https://example.looker.com/embed/explore/model_name/explore_name?theme=red

URL의 테마 요소는 대소문자를 구분하지 않으므로 theme=Red 또는 theme=red을 사용할 수 있습니다.

맞춤 테마 설정은 기존 대시보드에 지정된 삽입 설정을 재정의합니다. 삽입된 대시보드에 테마 및 삽입 설정이 적용되는 방법에 관한 자세한 내용은 이 페이지의 테마 및 퍼가기 설정 적용 방법 섹션을 참고하세요.

`_theme` URL 인수를 사용하여 개별 대시보드 테마 요소 적용

_theme URL 인수를 사용하여 삽입된 대시보드의 개별 테마 요소(예: tile_background_color 및 show_title)를 맞춤설정할 수 있습니다.

_theme 객체에서 지원되는 모든 속성을 보려면 Theme API API 페이지의 "ThemeSettings" 목록을 참조하세요.

_theme URL 인수의 형식은 다음과 같습니다.

_theme={"<property>":value}

예를 들어 _theme={"show_filters_bar":false}를 사용하여 삽입된 대시보드의 필터 막대를 숨길 수 있습니다. 전체 URL은 다음과 같습니다.

https://example.looker.com/embed/dashboards/236?_theme={"show_filters_bar":false}

여러 개의 테마 속성을 지정하려면 쉼표를 사용합니다.

_theme={"show_title":false,"show_filters_bar":false,"text_tile_text_color":"blue"}

색상 값은 따옴표로 묶어야 하며, 색상 이름 또는 16진수 색상 코드로 표현될 수 있습니다. 16진수 코드를 사용하는 경우 URL이 인코딩된 # 기호 버전(%23)을 사용해야 합니다. 예를 들어 두 URL 인수는 모두 빨간색을 지정합니다.

_theme={"title_color":"red","text_tile_text_color":"%23FF0000"}

삽입된 대시보드에 _theme 객체를 사용할 때 고려해야 할 사항은 다음과 같습니다.

_theme URL 인수에 지정된 모든 요소는 다른 테마 또는 기존 대시보드의 삽입 설정에 있는 해당 요소의 설정을 재정의합니다. 이렇게 하면 _theme 인수를 사용하여 테마를 세분화하거나 설정을 삽입할 수 있습니다. 예를 들어 필터 표시줄을 숨기는 맞춤 테마가 있지만 필터 표시줄이 표시되도록 하는 하나의 대시보드가 있다고 가정해 보겠습니다. 대시보드에 맞춤 테마를 사용하고 삽입된 대시보드 URL에 _theme={"show_filters_bar":true} 인수를 추가하면 대시보드에 필터 표시줄이 표시되지만 다른 모든 맞춤 테마 설정은 유지할 수 있습니다. 삽입된 대시보드에 테마 및 삽입 설정이 적용되는 방법에 관한 자세한 내용은 이 페이지의 테마 및 퍼가기 설정 적용 방법 섹션을 참고하세요.
프로그래밍 스크립트의 경우 _theme 인수에 URL을 인코딩해야 합니다.
삽입된 기존 대시보드 또는 삽입된 대시보드를 PDF 형식으로 전송하는 경우 _theme 인수가 적용되지 않습니다.
_theme 인수는 대시보드를 PDF로 다운로드할 때 적용됩니다.