관리자 메뉴별 설명
디자인
폰트, 테마, 로고, 헤더, 사이드바, 푸터 등 사이트의 전체적인 디자인을 설정합니다.
디자인
경로: 관리자 > 디자인
개요
사이트의 시각적 요소 전체를 관리하는 페이지입니다. 폰트, 컬러 테마, 로고, 헤더 레이아웃, 사이드바, 푸터 등을 세밀하게 설정할 수 있습니다.
글로벌 설정 카드
사이트 전체에 적용되는 기본 디자인 설정입니다.
기본 폰트 크기
- 유형: 5단계 선택
- 옵션: 매우 작게 / 작게 / 보통 / 크게 / 매우 크게
- 설명: 사이트 전체의 기본 텍스트 크기를 설정합니다. 모든 페이지에 일괄 적용됩니다.
테마 모드
- 유형: 3단계 선택
- 옵션:
모드 설명 라이트 밝은 배경의 기본 테마 다크 어두운 배경의 다크 테마 자동 사용자 OS 설정에 따라 자동 전환
기본 폰트 패밀리
- 유형: 선택 (드롭다운)
- 옵션: Pretendard / 넥슨고딕 / 페이북
- 설명: 사이트 전체에 적용되는 기본 글꼴입니다.
페이지 로딩바
- 유형: 토글 (ON/OFF)
- 설명: ON으로 설정하면 페이지 전환 시 상단에 로딩 진행 바가 표시됩니다.
컬러 테마 카드
사이트의 전체 색상 팔레트를 설정합니다. 45개 이상의 프리셋 테마를 제공합니다.
테마 미리보기
각 테마는 샘플 컴포넌트(버튼, 카드, 텍스트 등)로 미리보기를 제공합니다. 실제 사이트에 적용했을 때의 모습을 사전에 확인할 수 있습니다.
테마 적용
- 방법: 원하는 테마를 더블클릭하면 즉시 적용됩니다.
제공 테마 목록
| 테마 | 설명 |
|---|---|
| Default | 기본 테마 |
| ModernMinimal | 깔끔한 미니멀 디자인 |
| VioletBloom | 보라색 계열 |
| Twitter(X) 스타일 | |
| MochaMousse | 따뜻한 모카 톤 |
| Catppuccin | Catppuccin 팔레트 기반 |
| Claude | Claude AI 스타일 |
| Vercel | Vercel 스타일 |
그 외 다수의 프리셋 테마가 포함되어 있습니다.
로고 설정 카드
사이트 상단에 표시되는 로고를 설정합니다.
로고 유형
- 유형: 선택
- 옵션: 텍스트 / 이미지
- 설명: 로고를 텍스트로 표시할지 이미지로 표시할지 선택합니다.
로고 크기
- 유형: 5단계 선택
- 옵션: 매우 작게 / 작게 / 보통 / 크게 / 매우 크게
- 설명: 로고의 표시 크기를 조절합니다.
텍스트 로고 설정
로고 유형이 텍스트일 때 표시되는 설정입니다.
텍스트 입력
- 유형: 텍스트 입력 필드
- 설명: 로고로 표시할 텍스트를 입력합니다.
색상
- 유형: 색상 선택기 (Color Picker)
- 설명: 로고 텍스트의 색상을 선택합니다.
폰트 패밀리
- 유형: 선택 (22종)
- 분류:
분류 폰트 목록 한글 프리텐다드, 넥슨고딕, 나눔고딕, 나눔명조 등 영문 Inter, Roboto, Poppins, Montserrat 등 기본 시스템 기본 폰트
자간 (Letter Spacing)
- 유형: 5단계 선택
- 옵션: XS / S / M / L / XL
- 설명: 로고 텍스트의 글자 간격을 조절합니다. XS가 가장 좁고, XL이 가장 넓습니다.
이미지 로고 설정
로고 유형이 이미지일 때 표시되는 설정입니다.
라이트 모드 이미지
- 유형: 이미지 업로드
- 설명: 라이트 모드에서 표시될 로고 이미지를 업로드합니다.
다크 모드 이미지
- 유형: 이미지 업로드
- 설명: 다크 모드에서 표시될 로고 이미지를 업로드합니다. 밝은 색상의 로고를 사용하는 것을 권장합니다.
헤더 설정 카드
사이트 상단 헤더의 레이아웃과 동작을 설정합니다.
헤더 레이아웃
- 유형: 선택
- 옵션:
레이아웃 설명 1열 (One Row) 로고와 메뉴가 한 줄에 배치됩니다 2열 (Two Row) 로고가 상단, 메뉴가 하단에 두 줄로 배치됩니다
메뉴 스타일
- 유형: 선택
- 옵션: 좌측 / 중앙 / 우측 / 그리드
- 설명: 헤더 내 메뉴 항목의 정렬 방식을 설정합니다.
상단 헤더 표시
- 유형: 토글 (ON/OFF)
- 설명: 헤더 위에 추가 정보 바(상단 헤더)를 표시할지 여부를 설정합니다.
가짜 온라인 사용자 수
- 유형: 숫자 입력 필드
- 설명: 실제 온라인 사용자 수에 더해질 숫자를 입력합니다. 0을 입력하면 실제 수만 표시됩니다.
테마 토글 표시
- 유형: 토글 (ON/OFF)
- 설명: ON으로 설정하면 헤더에 라이트/다크 테마 전환 버튼이 표시됩니다.
헤더 배경색 활성화
- 유형: 토글 (ON/OFF)
- 설명: ON으로 설정하면 헤더에 배경색이 적용됩니다. OFF일 경우 투명 배경입니다.
검색바 표시
- 유형: 토글 (ON/OFF)
- 설명: ON으로 설정하면 헤더에 검색 입력창이 표시됩니다.
모바일 헤더 고정 (Sticky)
- 유형: 토글 (ON/OFF)
- 설명: ON으로 설정하면 모바일에서 스크롤해도 헤더가 상단에 고정됩니다.
사이드바 설정 카드
사이트 사이드바의 위치를 설정합니다.
사이드바 위치
- 유형: 선택
- 옵션:
위치 설명 좌측 사이드바가 콘텐츠 왼쪽에 배치됩니다 우측 사이드바가 콘텐츠 오른쪽에 배치됩니다 없음 사이드바를 사용하지 않습니다. 콘텐츠가 전체 너비를 차지합니다
푸터 설정 카드
사이트 하단 푸터의 표시 요소를 설정합니다.
푸터 로고 표시
- 유형: 토글 (ON/OFF)
- 설명: ON으로 설정하면 푸터에 사이트 로고가 표시됩니다.
푸터 로고 위치
- 유형: 선택
- 옵션: 좌측 / 중앙 / 우측
- 설명: 푸터에 표시되는 로고의 정렬 위치를 설정합니다.
- 조건: 푸터 로고 표시가 ON일 때만 적용됩니다.
방문자수 표시
- 유형: 토글 (ON/OFF)
- 설명: ON으로 설정하면 푸터에 사이트 방문자 통계가 표시됩니다.
약관/개인정보 링크 표시
- 유형: 토글 (ON/OFF)
- 설명: ON으로 설정하면 푸터에 이용약관 및 개인정보보호정책 링크가 표시됩니다.
푸터 텍스트 표시
- 유형: 토글 (ON/OFF)
- 설명: ON으로 설정하면 푸터에 커스텀 텍스트 영역이 표시됩니다.
푸터 텍스트 편집
- 유형: 버튼 → 모달 (리치텍스트 에디터)
- 설명: 푸터에 표시할 텍스트를 편집합니다. 사업자 정보, 저작권 표시, 연락처 등을 입력할 수 있습니다.
- 조건: 푸터 텍스트 표시가 ON일 때만 편집 내용이 반영됩니다.