Cloudwiki/에디터/툴바
정보:
에디터 상단 툴바의 모든 버튼을 그룹별로 정리합니다. 각 버튼은 클릭 시 현재 커서 위치(또는 선택 영역)에 위키 문법을 삽입하거나 모달을 엽니다. 상위 문서: [[Cloudwiki/에디터]].
# 텍스트 꾸미기
| 버튼 | 동작 |
| --- | --- |
| **H** | 현재 줄 앞에 `## ` (제목 2단계) 삽입 |
| **B** | 선택 영역을 `**굵게**` 로 감싸기 |
| *I* | 선택 영역을 `*기울임*` 으로 감싸기 |
| ~~S~~ | 선택 영역을 `~~취소선~~` 으로 감싸기 |
| | 선택 영역을 `__밑줄__` 로 감싸기 |
| | 선택 영역을 `==형광펜==` 으로 감싸기 |
# 블록 요소
| 버튼 | 동작 |
| --- | --- |
| ─ | `---` (수평선) 삽입 |
| | 현재 줄 앞에 `> ` (인용) 삽입 |
# 목록
| 버튼 | 동작 |
| --- | --- |
| | `- ` 글머리 기호 목록 |
| | `1. ` 번호 목록 |
| | `- [ ] ` 체크리스트 |
# 위키 블록 컴포넌트
| 버튼 | 동작 |
| --- | --- |
| 그리드 | `:::grid` ~ `:::` 블록 삽입(또는 선택 영역 감싸기) |
| row | `:::row` ~ `:::` (가로 정렬) 블록 |
# 표
표 버튼을 클릭하면 작은 팝오버가 열립니다.
- **그리드 (8 × 10)**: 마우스를 움직여 행/열 수를 선택하고 클릭하면 빈 마크다운 표가 삽입됩니다.
- **CSV로 삽입**: CSV 텍스트를 붙여넣어 표로 변환합니다 (쉼표/세미콜론/탭 구분).
표 삽입 이후의 정렬·행/열 추가삭제·셀 병합·색상·간격 정렬은 표 안 셀에 커서를 두면 셀 위에 자동으로 떠오르는 **표 인라인 툴바** 가 담당합니다. 자세한 사용법은 [[Cloudwiki/에디터/표]] 를 참고하세요.
# 링크 / 위키 링크 / 틀
| 버튼 | 동작 |
| --- | --- |
| | 선택을 `[선택](url)` 마크다운 링크로 감싸기 |
| `[[ ]]` | `[[문서제목]]` 삽입 (위키 링크) |
| `{{ }}` | `{{틀제목}}` 삽입 (트랜스클루전) |
# 본문 보조 요소
| 버튼 | 동작 |
| --- | --- |
| `[*]` | `[* 각주 내용]` 삽입 |
| | 펼치기/접기 블록 `[+ 제목]` ~ `[-]` 삽입 |
| | **하위 문서 삽입 모달** — 현재 문서의 하위 문서 트리를 탐색해 위키 링크로 삽입 |
| | **타임스탬프 삽입 모달** — D-Day / 시각 / 타이머 / 만 나이 / 캘린더를 탭으로 골라 입력 |
# 특수문자
Ω 버튼을 누르면 카테고리(라틴/그리스/화살표/수학/통화 등)별로 정리된 특수문자 그리드가 열립니다. 클릭하면 커서 위치에 삽입됩니다.
# 아이콘
사이트 설정에 따라 다음 중 일부가 표시됩니다.
| 버튼 | 동작 |
| --- | --- |
| 아이콘 | 사이트에 등록된 **선택 아이콘 피커** (선택 아이콘 모드 ON 일 때) |
| MDI | Material Design Icons 피커 (선택 아이콘 모드 OFF 일 때) |
| BI | Bootstrap Icons 피커 (선택 아이콘 모드 OFF 일 때) |
피커는 검색·페이징·키보드 탐색을 지원합니다.
# 카드 / 색상 / 배지
| 버튼 | 동작 |
| --- | --- |
| 카드 블록 | **카드 삽입 모달** — 제목·본문·아이콘·색상·아이콘 모드를 설정해 `:::card` 블록 생성 |
| 탭 / 아코디언 / 진행상황 | **구조 컴포넌트 삽입 모달** — 상단 타입 토글로 탭(`:::tabs`/`:::tab`), 아코디언(`:::accordion`/`:::item`, `{multiple}` · `{open}` 옵션), 진행상황(단계별 `:::steps`/`:::step` `{status}`·`{layout}` 또는 인라인 진행 바 `{progress:값\|라벨}`) 중 하나를 동적 항목 추가/삭제로 작성 |
| 색상 삽입 | **색상 / 팔레트 모달** — HSV 캔버스, HEX, 팔레트 탭. 적용 시 `{bg:...}{color:...}` 또는 `{palette:...}` 삽입 |
| 배지 | **배지 삽입 모달** — 텍스트, 아이콘, 배경/글자색을 선택해 인라인 배지 생성 |
# 코드
| 버튼 | 동작 |
| --- | --- |
| `</>` 인라인 코드 | 선택을 `` `...` `` 으로 감싸기 |
| 코드 블록 | 선택을 ` FENCED_CODE_0 ` 펜스로 감싸기 (언어 지정 가능) |
# 외부 콘텐츠
| 버튼 | 동작 |
| --- | --- |
| 구글 지도 | **지도 임베드 모달** — Google Maps "공유" 의 임베드 iframe URL을 검증 후 삽입 |
| 이미지 업로드 | **이미지 업로드 팝업** — 자세한 내용은 [[Cloudwiki/에디터/이미지 업로드]] |
# 우측 도구
| 버튼 | 동작 |
| --- | --- |
| 찾기/바꾸기 (`Ctrl+F`) | 에디터 내장 찾기 패널 |
| 모드▾ (PC 전용) | **일반 모드** (에디터+프리뷰 분할) / **작성 모드** (에디터만) / **보기 모드** (프리뷰만) 전환 |
| 설정 | 에디터 설정 — 줄번호, 자동 줄바꿈, 문법 강조, 고급 편집(색상 배지/팔레트 배지/아이콘 위젯), 편집 요약 자동 작성, 선택 아이콘만 사용 등 |
# 표 인라인 툴바
표 안에 커서를 놓으면 셀 바로 위에 작은 부동(floating) 툴바가 떠 정렬·행/열 추가삭제·셀 병합 토큰(`{<}` `{>}` `{^}` `{><}`)·색상 삽입·표 간격 정렬을 한 번에 처리할 수 있습니다. 각 버튼의 동작과 가드 조건은 [[Cloudwiki/에디터/표]] 문서에 정리돼 있습니다.
# 색상·팔레트 배지 클릭 편집
본문에 입력된 `{color:...}` `{bg:...}` `{palette:...}` 토큰 옆에 표시되는 ▢ 색상 배지를 클릭하면, 해당 토큰을 다시 편집하는 자동완성이 즉시 열립니다 — 토큰을 다시 타이핑하지 않고도 색상을 바꿀 수 있습니다.
> 이 배지는 설정 → 고급 편집 옵션이 켜져 있을 때만 표시됩니다.