# 상태 페이지 맞춤 설정하기

Source: https://instatus.com/help/ko/status-page/customize

**상태 페이지** 설정에서 상태 페이지의 로고, 색상, 헤더 디자인, 다크 모드, 언어, 날짜 형식, 소셜 미리 보기를 변경하고 커스텀 HTML, CSS, 자바스크립트를 추가할 수 있습니다.

| At a glance | Details |
| :-- | :-- |
| [브랜드](https://instatus.com/help/ko/status-page/customize#로고와-색상은-어떻게-추가하나요) | 로고, 다크 모드 로고, 파비콘, 브랜드 및 상태 색상 |
| [디자인](https://instatus.com/help/ko/status-page/customize#디자인이나-다크-모드는-어떻게-변경하나요) | 헤더 디자인 3종, 다크/라이트 모드, 구성 요소 배치 |
| [커스텀 코드](https://instatus.com/help/ko/status-page/customize#커스텀-html-css-자바스크립트를-추가할-수-있나요) | 5개 영역에 HTML, CSS, 자바스크립트 |
| [언어](https://instatus.com/help/ko/status-page/customize#상태-페이지-언어는-어떻게-변경하나요) | 기본 언어, Pro에서는 다국어 |
| [타임라인](https://instatus.com/help/ko/status-page/customize#날짜-시간-시간대-형식은-어떻게-변경하나요) | 날짜 및 시간 형식, 시간대, 시작일 |
| [검색 및 소셜](https://instatus.com/help/ko/status-page/customize#google과-소셜-미디어-미리-보기는-어떻게-설정하나요) | 미리 보기용 제목, 설명, 이미지 |

## 로고와 색상은 어떻게 추가하나요?

[instatus.com/login](https://dashboard.instatus.com/login)에서 로그인해 상태 페이지를 선택한 다음 **상태 페이지 → 디자인**으로 이동하세요.

브랜드 섹션에서 다음을 변경할 수 있습니다.

- 브랜드 로고. 다크 모드용 별도 로고도 지정할 수 있습니다.
- 파비콘.
- 로고와 어울리는 브랜드 색상.
- 상태 색상.

상태 페이지를 맞춤 설정한 뒤 **SAVE**를 클릭하면 페이지에 반영됩니다.

![브랜드 설정](https://instatus.com/help/customize/1.png)

## 디자인이나 다크 모드는 어떻게 변경하나요?

**디자인**의 디자인 섹션에서 다음을 변경할 수 있습니다:

- 헤더 디자인. 3가지 디자인 중에서 선택할 수 있습니다.
- 상태 페이지를 다크 모드, 라이트 모드 중 무엇으로 표시할지, 아니면 버튼으로 전환할 수 있게 할지.
- 구성 요소를 어떻게 표시할지.

디자인을 변경한 뒤 **SAVE**를 클릭하면 페이지에 반영됩니다.

![디자인 설정](https://instatus.com/help/customize/2.png)

## 커스텀 HTML, CSS, 자바스크립트를 추가할 수 있나요?

네. **상태 페이지 → HTML**에서 다음 다섯 영역에 직접 만든 HTML, CSS, 자바스크립트를 넣을 수 있습니다:

- 상태 페이지 헤더 위.
- 헤더 아래.
- 상태 페이지 구성 요소 아래.
- 상태 페이지 푸터 위.
- 푸터 아래.

커스텀 HTML을 추가한 뒤 **SAVE**를 클릭하면 페이지에 반영됩니다.

![커스텀 HTML 설정](https://instatus.com/help/customize/3.png)

## 상태 페이지 언어는 어떻게 변경하나요?

**상태 페이지 → 언어**에서 다음을 변경할 수 있습니다.

- 상태 페이지의 기본 언어.

**Pro 요금제 기능:**

- 다국어 상태 페이지.
- 직접 정한 언어 사용.

여러 언어를 설정하는 단계별 안내는
[다국어 지원](https://instatus.com/help/ko/status-page/multi-language) 문서에서 확인할 수 있습니다.

![언어 설정](https://instatus.com/help/customize/4.png)

상태 페이지의 언어를 변경한 뒤 **SAVE**를 클릭하면 페이지에 반영됩니다.

## 날짜, 시간, 시간대 형식은 어떻게 변경하나요?

**상태 페이지 → 타임라인**에서 다음을 변경할 수 있습니다.

- 날짜와 시간 형식. [날짜 및 시간 형식에 대한 자세한 내용은 여기](https://date-fns.org/v2.16.1/docs/format)에서 확인할 수 있습니다.
- 시간대.
- 서비스 시작일.

상태 페이지의 날짜와 시간을 변경한 뒤 **SAVE**를 클릭하면 페이지에 반영됩니다.

![날짜 및 시간 형식 설정](https://instatus.com/help/customize/5.png)

## Google과 소셜 미디어 미리 보기는 어떻게 설정하나요?

**상태 페이지 → 검색 및 소셜**에서 다음을 설정할 수 있습니다:

- 제목 변경.
- Google과 소셜 미디어용 설명 추가.
- 이미지 업로드.

검색 및 소셜 설정을 맞춤 설정한 뒤 **SAVE**를 클릭하면 변경 사항이 적용됩니다.

![검색 및 소셜 설정](https://instatus.com/help/customize/6.png)

- [다국어 지원](https://instatus.com/help/ko/status-page/multi-language): 상태 페이지를 여러 언어로 제공하는 방법을 알아보세요.