# 로고와 위치

Grid 기본 로고는 표 하단의 전용 영역에서 오른쪽에 정렬됩니다. 셀·페이지 이동·스크롤 컨트롤을 덮지 않도록 데이터 영역과 분리되어 있습니다.

Canonical: https://grid.syidax.com/ko/docs/guides/branding/

<a id="understand"></a>

## 동작 원리와 선택 기준

기본 표시에는 별도 설정이 필요 없습니다. 로고 제거 또는 사용자 지정은 grid.branding 권한이 포함된 유효한 라이선스가 필요하며 임의 위치로 옮기는 brandPosition 옵션은 제공하지 않습니다.

이 기능을 제품에서 사용하려면 Pro 패키지와 유효한 라이선스가 필요합니다. 설정 이름이 같더라도 Community에서 Pro 기능이 활성화되는 것은 아닙니다.

코드의 grid는 설치와 연결 장에서 준비한 Grid 요소입니다. 예제마다 필요한 데이터·설정을 확인하고, 코드에서 소개하는 앱 함수와 서버 주소는 프로젝트에 맞게 구현하세요.

- [설치와 연결 · 공통 예제 데이터](https://grid.syidax.com/ko/docs/guides/getting-started.md)

<a id="example-1"></a>

## 예제 1. 기본 로고 유지

기본값 또는 빈 문자열로 Syidax 로고를 사용합니다.

```javascript
grid.brandLogo = '';
```

결과 확인: 표 하단 오른쪽에 기본 마크가 표시됩니다. 앱 레이아웃에서 이 영역을 잘라 숨기지 마세요.

<a id="example-2"></a>

## 예제 2. 라이선스로 로고 제거

Pro 패키지와 branding 권한을 등록한 뒤 지정합니다.

```javascript
grid.brandLogo = 'none';
```

결과 확인: 권한이 있으면 로고가 제거됩니다. 권한이 없으면 기본 로고가 유지되므로 실제 결과와 라이선스 거절 이벤트를 확인하세요.

<a id="example-3"></a>

## 예제 3. 회사 로고 사용

100KB 이하의 PNG·JPEG·WebP를 base64 data URL로 변환한 문자열을 brandLogo에 전달합니다. 외부 URL·SVG·HTML은 허용되는 입력이 아닙니다.

결과 확인: 유효한 branding 권한과 지원 이미지 형식이 모두 준비되어야 사용자 로고가 표시됩니다. 밝은 테마와 어두운 테마에서 가독성을 확인합니다.

<a id="pitfalls"></a>

## 조합할 때와 문제를 해결할 때

기본 로고 위치를 바꾸기 위해 내부 Shadow DOM이나 CSS를 억지로 덮어쓰지 마세요. 공개 설정과 제품 권한에 맞는 방법을 사용합니다.

패키지 설치와 라이선스 등록은 별개입니다. 설치와 연결 문서에서 등록 결과를 확인한 뒤 사용자 로고를 설정합니다.

<a id="related-api"></a>

## 이 기능에 사용하는 API

- [brandLogo](https://grid.syidax.com/ko/docs/options/brandLogo.md) — 기본 로고·none·지원하는 이미지 data URL 중 하나를 지정합니다. 제거와 변경에는 grid.branding 권한이 필요하며 위치는 표 하단 오른쪽입니다.

<a id="next"></a>

## 함께 읽기

- [행·열·ID의 관계](https://grid.syidax.com/ko/docs/guides/concepts.md)
- [결과와 이벤트 연결](https://grid.syidax.com/ko/docs/guides/data-event-access.md)
- [Features에서 살펴보기](https://grid.syidax.com/grid/branding) — 직접 체험 가능한 범위는 해당 가이드에 안내되어 있습니다.