맞춤 테마를 사용하여 내부 (삽입되지 않은) Looker 대시보드의 모양을 맞춤설정할 수 있습니다. 테마를 사용하여 글꼴 모음, 텍스트 색상, 배경 색상, 버튼 색상, 타일 색상, 기타 시각적 요소를 맞춤설정할 수 있습니다. 테마는 사용자 정의 대시보드와 LookML 대시보드 모두에 적용할 수 있습니다.
예를 들어 '어두운' 테마를 만들어 대시보드의 모양을 변경할 수 있습니다.
관리 패널의 플랫폼 섹션에 있는 테마 페이지에서 대시보드의 테마와 대시보드에 있는 타일의 수정 창을 정의할 수 있습니다.
이 페이지에서는 다음 사항을 설명합니다.
- 사용자 및 인스턴스 요구사항
- 대시보드에 테마가 적용되는 방식
- PDF로 다운로드한 대시보드에 테마가 적용되는 방식
- 커스텀 테마 만들기, 복사, 수정, 삭제, 기본값으로 설정 방법
사용자 및 인스턴스 요구사항
내부 Looker 대시보드의 테마를 관리하려면 다음 요구사항을 충족해야 합니다.
- Looker 관리자가 내부 대시보드 테마 실험실 기능을 사용 설정해야 합니다.
- Looker 사용자에게 관리자 역할 또는
manage_internal_themes권한이 있어야 합니다.
대시보드에 테마 적용하기
대시보드에 테마를 적용하려면 대시보드가 수정 모드인지 확인하고 스타일을 클릭하여 스타일 패널을 엽니다. 테마 필드에서 테마를 선택하면 대시보드에 테마가 적용됩니다. 없음을 선택하고 인스턴스에 기본 테마가 있는 경우 기본 테마가 적용됩니다.
대시보드 다운로드
대시보드를 PDF로 다운로드하면 적용된 맞춤 테마가 표시됩니다.
커스텀 테마 만들기
커스텀 테마를 만들려면 테마 관리 페이지에서 내부 탭을 선택하고 테마 추가를 클릭합니다.
다음으로 새 테마 페이지에서 맞춤설정할 각 설정에 대한 스타일 및 색상 사양을 추가합니다. 다음 섹션에서 설명된 설정을 변경할 수 있습니다. 테마 저장을 선택하여 변경사항을 유지하고 새 테마를 저장합니다.
테마
이름: 테마의 이름은 고유해야 하며 영숫자 문자와 밑줄만 포함할 수 있습니다. 테마 이름에 공백을 입력하면 테마를 저장할 때 공백이 밑줄로 바뀝니다.
일반
키 색상: 대시보드는 기본 버튼 및 필터 컨트롤에 이 색상을 사용합니다. Explore는 필드 선택 도구 링크 및 아이콘, 기본 버튼, 배너, 강조에 이 색상을 사용합니다.
텍스트 색상: Explore 및 대시보드의 텍스트에 대한 16진수 색상 코드입니다.
배경 색상: Explore 및 대시보드의 배경에 대한 16진수 색상 코드입니다.
글꼴 모음: 글꼴 모음 이름입니다. 이 글꼴은 시각화의 타일 제목, 텍스트 타일, 범례를 포함하여 대시보드의 모든 텍스트에 사용됩니다. 이 글꼴은 Explore의 모든 텍스트에도 사용됩니다. 글꼴 이름에 공백이 있으면 '"Open Sans"와 같이 이름에 따옴표를 사용합니다.
웹에 적합한 일반적인 글꼴을 사용하는 경우 글꼴 모음 필드에 글꼴 이름을 입력하고 글꼴 소스 필드를 비워두면 됩니다. 일반적이지 않은 글꼴을 사용하려면 글꼴 모음 필드에 글꼴 이름을 입력한 후 다음에 설명된 글꼴 소스 필드를 사용하여 사용하려는 글꼴의 정의에 대한 URL을 제공합니다.
글꼴 소스: 커스텀 글꼴(웹에 적합한 일반적인 글꼴이 아닌 글꼴)을 사용하지 않는 한 이 필드를 비워 둡니다. 글꼴 소스는 https로 시작하고 @font-face의 src 인수에 지정된 url 값을 가리키는 전체 URL이어야 합니다. .woff2 파일은 Internet Explorer 11에서 지원되지 않으므로 웹 오픈 글꼴 형식(.woff)을 사용하는 것이 좋습니다.
- 예를 들어 PT Sans Narrow의 경우 폰트 모음 필드에 'PT Sans Narrow'를 입력한 다음 폰트 소스 필드에
https://fonts.gstatic.com/s/ptsansnarrow/v7/UyYrYy3ltEffJV9QueSi4RdbPw3QSf9R-kE0EsQUn2A.woff를 입력합니다.
커스텀 테마가 포함된 대시보드 타일 수정 창의 예시
이전 섹션에서 설명된 Explore 요소 외에도 대시보드 타일을 수정할 때 키 색상 설정(#e82042)에서 지정된 음영 및 글꼴 모음 설정(Verdana)에서 지정된 글꼴로 배너가 표시됩니다.
대시보드 페이지
색상 컬렉션: 필요한 경우, 함께 작동하는 팔레트의 집합인 색상 컬렉션을 선택할 수 있습니다. 대시보드에 색상 컬렉션을 할당할 때 모든 대시보드의 타일에 있는 모든 데이터 계열은 컬렉션에 있는 팔레트에 따라 색상이 지정되므로 데이터 계열의 색상이 전체 대시보드에서 조정됩니다.
테마에 색상 컬렉션을 지정하면 테마의 색상 컬렉션이 기존에 타일에 할당된 모든 색상 컬렉션을 재정의합니다. 그러나 테마의 색상 컬렉션은 데이터 계열에 할당된 맞춤설정된 색상을 재정의하지 않으며 테이블 시각화에 적용된 조건부 형식도 재정의하지 않습니다.
제목 글꼴 크기: 원하는 경우 사전 정의된 크기(픽셀)에서 대시보드 제목의 글꼴 크기를 조정합니다.
여백 상단: 선택적으로 대시보드 상단에서 여백의 특정 값을 설정합니다. 드롭다운 메뉴의 사전 정의된 옵션 중에서 선택합니다. 여백은 픽셀(px) 단위로 측정됩니다.
여백 하단: 선택적으로 대시보드 하단에서 여백의 특정 값을 설정합니다. 드롭다운 메뉴의 사전 정의된 옵션 중에서 선택합니다. 여백은 픽셀(px) 단위로 측정됩니다.
여백 측면: 선택적으로 대시보드 측면에서 여백의 특정 값을 설정합니다. 드롭다운 메뉴의 사전 정의된 옵션 중에서 선택합니다. 여백은 픽셀(px) 단위로 측정됩니다.
대시보드 타일
제목 색상: 다음 요소의 16진수 색상 코드입니다.
텍스트 색상: 다음 요소의 16진수 색상 코드입니다.
- 시각화의 범례를 포함한 대시보드의 텍스트
- 마크다운 타일의 헤더 및 본문 텍스트(헤더 수준 1 텍스트 제외)
- 텍스트 타일의 헤더 수준 1, 헤더 수준 2, 일반 텍스트
- 단일 값 시각화의 타일 아이콘
텍스트 본문 색상: 다음 요소의 16진수 색상 코드입니다.
배경 색상: 텍스트 타일을 제외한 모든 타일 배경의 16진수 색상 코드입니다.
텍스트 배경 색상: 텍스트 타일 배경의 16진수 색상 코드입니다.
제목 정렬: 타일 제목의 정렬을 왼쪽, 오른쪽 또는 중앙으로 설정합니다.
제목 글꼴 크기: 원하는 경우 사전 정의된 크기(픽셀)에서 대시보드 타일의 글꼴 크기를 조정합니다.
상자 그림자: CSS 구문을 사용하여 대시보드 타일 주위에 그림자를 만듭니다. 사전 정의된 상자 그림자에서 선택하거나 커스텀 상자를 만들 수 있습니다. 맞춤 상자 그림자를 만들려면 원하는 horizontal-offset vertical-offset blur-radius spread-radius color 를 입력하고 맞춤 스타일 지정을 선택하여 설정을 적용합니다. 상자 그림자 설정의 미리보기가 오른쪽에 표시됩니다.
열 간격 크기: 선택적으로 사전 정의된 크기(픽셀)에서 대시보드 타일 열 사이의 공간 크기를 조정합니다.
행 간격 크기: 선택적으로 사전 정의된 크기(픽셀) 집합에서 대시보드 타일 행 사이의 공간 크기를 조정합니다.
테두리 반경: 대시보드 타일의 경계 반경을 조정하여 정사각형 또는 둥근 모서리를 만듭니다.
테마 수정
모든 테마에서 연결된 수정 버튼을 클릭하여 테마 설정을 업데이트할 수 있습니다.
새 테마를 만들 때와 마찬가지로 설정을 수정할 수 있습니다. 설정에 대한 설명은 앞서 설명한 테마 설정을 참조하세요. 저장을 선택하여 업데이트 사항을 저장합니다.
테마 복사
테마의 메뉴를 선택하고 테마 복사를 선택하여 기존 테마를 복사할 수 있습니다.
테마의 사본을 만들면 새 테마의 이름은 복사된 테마의 이름 뒤에 '(copy)'가 따라옵니다. 이 이름을 영숫자 문자와 밑줄만 사용하는 고유한 새 이름으로 직접 변경하고 괄호를 삭제해야 합니다.
새 테마를 만들 때와 마찬가지로 나머지 설정을 수정할 수 있습니다. 설정에 대한 설명은 앞서 설명한 테마 설정을 참조하세요. 저장을 선택하여 모든 테마 설정을 저장합니다.
테마 삭제
테마를 삭제하려면 테마 메뉴를 선택하고 테마 삭제를 선택합니다.
기본 테마 설정
테마를 기본 테마로 설정하면 사용자가 수정 모드에서 테마 필드에서 없음 옵션을 선택하는 모든 대시보드에 해당 테마가 적용됩니다.
테마를 기본 테마로 설정하려면 테마의 메뉴를 선택하고 기본값으로 설정을 선택합니다.
기본 테마에서 기본 설정을 삭제하려면 테마 메뉴를 선택하고 기본값 삭제를 선택합니다.