단축키와 작성 약어 문서 추가
This commit is contained in:
@@ -1,5 +1,9 @@
|
||||
# 업데이트 요약
|
||||
|
||||
## v1.9.29
|
||||
|
||||
- 사이트에서 쓰는 단축키, 슬래시 명령, Markdown 약식 문법을 `docs/shortcuts.md`로 정리했다.
|
||||
|
||||
## v1.9.28
|
||||
|
||||
- 페이지 HTML 문서 작성 시 태그 내부 스마트 따옴표로 링크 속성이 깨지지 않도록 보정했다.
|
||||
|
||||
@@ -47,6 +47,12 @@
|
||||
| lib/analytics-traffic.js | referrer·User-Agent 기반 유입원·디바이스·검색 키워드 축약 분류 |
|
||||
| lib/social-links.js | 사이트 설정 SNS 링크 아이콘 프리셋·사용자 SVG 정리·URL 자동 보정·레거시 JSON 문자열 복구·공개 노출 목록 생성 |
|
||||
|
||||
## 문서
|
||||
|
||||
| 파일 | 용도 |
|
||||
|------|------|
|
||||
| docs/shortcuts.md | 사이트 단축키, 작성 약어, 슬래시 명령, Markdown 약식 문법 정리 |
|
||||
|
||||
## Nuxt 모듈
|
||||
|
||||
| 파일 | 용도 |
|
||||
|
||||
253
docs/shortcuts.md
Normal file
253
docs/shortcuts.md
Normal file
@@ -0,0 +1,253 @@
|
||||
# 단축키 및 작성 약어
|
||||
|
||||
이 문서는 sori.studio에서 직접 구현한 단축키, 슬래시 명령, Markdown 약식 문법을 정리한다.
|
||||
브라우저 기본 단축키는 제외한다.
|
||||
|
||||
## 기본 표기
|
||||
|
||||
- `Cmd/Ctrl`: macOS는 `Cmd`, Windows/Linux는 `Ctrl`.
|
||||
- `Enter`: 선택 또는 확정.
|
||||
- `Escape`: 열려 있는 패널, 메뉴, 모달을 닫음.
|
||||
|
||||
## 공개 화면
|
||||
|
||||
| 입력 | 동작 | 위치 |
|
||||
|------|------|------|
|
||||
| `/` | 통합 검색 모달 열기 | 공개 화면 전체. 입력창, textarea, select, contenteditable 포커스 중에는 무시 |
|
||||
| `Escape` | 통합 검색 모달 닫기 | 통합 검색 모달 열림 상태 |
|
||||
| `Escape` | 사용자 메뉴 닫기 | 사용자 메뉴 열림 상태 |
|
||||
| `Escape` | 모바일 왼쪽 메뉴 닫기 | 모바일 왼쪽 메뉴 열림 상태 |
|
||||
|
||||
## 게시글 작성 에디터
|
||||
|
||||
### 공통
|
||||
|
||||
| 입력 | 동작 | 위치 |
|
||||
|------|------|------|
|
||||
| `Cmd/Ctrl+E` | 작성 모드와 미리보기 모드 전환 | 게시글/페이지 Markdown 에디터 |
|
||||
| `Cmd/Ctrl+Z` | 에디터 자체 실행 취소 | 게시글/페이지 Markdown 에디터 |
|
||||
| `Cmd/Ctrl+Shift+Z` | 에디터 자체 다시 실행 | 게시글/페이지 Markdown 에디터 |
|
||||
| `Cmd/Ctrl+Y` | 에디터 자체 다시 실행 | 게시글/페이지 Markdown 에디터 |
|
||||
| `Escape` | 미디어 선택 모달 닫기 | 미디어 선택 모달 열림 상태 |
|
||||
|
||||
### 소스 작성 모드
|
||||
|
||||
| 입력 | 동작 |
|
||||
|------|------|
|
||||
| `Cmd/Ctrl+K` | 선택 텍스트를 `[선택 텍스트](https://)` 인라인 링크로 감싸고 URL 부분 선택 |
|
||||
| `Cmd/Ctrl+B` | 선택 텍스트를 `**굵은 글씨**`로 감싸기 |
|
||||
| `Cmd/Ctrl+I` | 선택 텍스트를 `*기울임*`으로 감싸기 |
|
||||
| `Cmd/Ctrl+Shift+K` | 선택된 줄 삭제 |
|
||||
| 이미지 파일 드롭 | 이미지 1개는 이미지 블록, 여러 개는 갤러리 블록으로 업로드 삽입 |
|
||||
|
||||
### 미리보기/라이브 편집 모드
|
||||
|
||||
| 입력 | 동작 |
|
||||
|------|------|
|
||||
| `Cmd/Ctrl+K` | 선택 텍스트를 `[선택 텍스트](https://)` 인라인 링크로 삽입 |
|
||||
| `Cmd/Ctrl+Shift+K` | 현재 줄 또는 선택 카드 블록 삭제 |
|
||||
| `Cmd/Ctrl+A` | 라이브 문서 전체 선택 |
|
||||
| `Backspace` / `Delete` | 선택된 카드형 블록 삭제 |
|
||||
| `ArrowUp` / `ArrowDown` | 편집 커서를 이전/다음 블록으로 이동 |
|
||||
| 카드형 블록에서 `Enter` | 해당 블록 아래에 새 줄 삽입 |
|
||||
| 카드형 블록에서 `ArrowUp` / `ArrowDown` | 이전/다음 블록으로 이동 |
|
||||
|
||||
### 슬래시 명령 메뉴
|
||||
|
||||
본문 줄에서 `/`를 입력하면 슬래시 명령 메뉴가 열린다.
|
||||
|
||||
| 입력 | 동작 |
|
||||
|------|------|
|
||||
| `/` | 슬래시 명령 메뉴 열기 |
|
||||
| `/검색어` | 명령 검색 |
|
||||
| `ArrowUp` / `ArrowDown` | 명령 선택 이동 |
|
||||
| `Enter` | 선택 명령 실행 |
|
||||
| `Escape` | 슬래시 명령 취소 |
|
||||
|
||||
## 슬래시 명령 목록
|
||||
|
||||
| 명령 | 삽입/동작 | 설명 |
|
||||
|------|-----------|------|
|
||||
| `/이미지`, `/image`, `/img`, `/photo` | 미디어 선택 | 단일 이미지 삽입 |
|
||||
| `/갤러리`, `/gallery`, `/images` | 미디어 선택 | 여러 이미지 갤러리 삽입 |
|
||||
| `/h1`, `/heading1` | `# ` | 제목 1. 게시물 제목 외에는 비권장 |
|
||||
| `/h2`, `/heading`, `/subtitle`, `/제목` | `## ` | 제목 2 |
|
||||
| `/h3`, `/heading`, `/제목` | `### ` | 제목 3 |
|
||||
| `/h4`, `/heading`, `/제목` | `#### ` | 제목 4 |
|
||||
| `/인용`, `/quote`, `/blockquote` | `> ` | 인용문 |
|
||||
| `/목록`, `/list`, `/bullet`, `/ul` | `- ` | 불릿 목록 |
|
||||
| `/표`, `/table`, `/테이블` | 기본 3열 Markdown 표 | 표 삽입 |
|
||||
| `/코드`, `/code`, `/pre` | 코드 블록 | 줄번호 숨김 기본값 |
|
||||
| `/구분선`, `/divider`, `/hr`, `/line` | `---` | 가로 구분선 |
|
||||
| `/콜아웃`, `/callout`, `/notice`, `/info` | `:::callout ... :::` | 강조 안내 블록 |
|
||||
| `/토글`, `/toggle`, `/details` | `:::toggle ... :::` | 접기/펼치기 블록 |
|
||||
| `/html`, `/markup`, `/tablehtml`, `/html표` | `:::html ... :::` | HTML 코드 블록 |
|
||||
| `/링크`, `/link`, `/url`, `/embed`, `/youtube` | `:::link ... :::` | URL 링크/임베드 카드. 인라인 링크가 아님 |
|
||||
| `/iframe`, `/frame`, `/아이프레임` | `:::iframe ... :::` | 외부 iframe 코드 |
|
||||
| `/비디오`, `/video`, `/movie`, `/mp4` | 미디어 선택 | 업로드 비디오 카드 |
|
||||
| `/오디오`, `/audio`, `/music`, `/mp3` | 미디어 선택 | 오디오 플레이어 카드 |
|
||||
| `/파일`, `/file`, `/download`, `/pdf` | 미디어 선택 | 다운로드 파일 카드 |
|
||||
|
||||
## Markdown 약식 문법
|
||||
|
||||
### 인라인
|
||||
|
||||
| 문법 | 결과 |
|
||||
|------|------|
|
||||
| `[여기](https://example.com)` | `여기`에 링크 적용 |
|
||||
| `[내부 링크](/pages/about)` | 사이트 내부 경로 링크 |
|
||||
| `**텍스트**` | 굵게 |
|
||||
| `*텍스트*` | 기울임 |
|
||||
| `` `code` `` | 인라인 코드 |
|
||||
| `::red[텍스트]` | 빨간색 인라인 텍스트 |
|
||||
| `::blue[텍스트]` | 파란색 인라인 텍스트 |
|
||||
| `::green[텍스트]` | 초록색 인라인 텍스트 |
|
||||
| `::yellow[텍스트]` | 노란색 인라인 텍스트 |
|
||||
| `::purple[텍스트]` | 보라색 인라인 텍스트 |
|
||||
| `::gray[텍스트]` | 회색 인라인 텍스트 |
|
||||
| `$H_2O$` | 아래첨자 |
|
||||
| `$x^2$` | 위첨자 |
|
||||
|
||||
### 블록
|
||||
|
||||
| 문법 | 결과 |
|
||||
|------|------|
|
||||
| `# 제목` | 제목 1 |
|
||||
| `## 제목` | 제목 2 |
|
||||
| `### 제목` | 제목 3 |
|
||||
| `#### 제목` | 제목 4 |
|
||||
| `> 인용` | 인용문 |
|
||||
| `> [!bg=blue]` | 파란 인용 막대 옵션 |
|
||||
| `> {bg=red}` | 빨간 인용 막대 옵션 |
|
||||
| `- 항목` | 불릿 목록 |
|
||||
| `1. 항목` | 번호 목록 |
|
||||
| `---` | 구분선 |
|
||||
| `` | 이미지 |
|
||||
| 표준 Markdown 표 | 표 |
|
||||
|
||||
### 코드 블록
|
||||
|
||||
````markdown
|
||||
```javascript
|
||||
console.log('hello')
|
||||
```
|
||||
````
|
||||
|
||||
| 옵션 | 설명 |
|
||||
|------|------|
|
||||
| ```javascript | 언어 지정 |
|
||||
| ```javascript line-numbers | 줄번호 표시 |
|
||||
| ```javascript linenos | 줄번호 표시 |
|
||||
| ```javascript no-line-numbers | 줄번호 숨김 |
|
||||
| ```javascript no-linenos | 줄번호 숨김 |
|
||||
|
||||
### 콜아웃
|
||||
|
||||
```markdown
|
||||
:::callout emoji=💡 bg=blue title="안내"
|
||||
본문
|
||||
:::
|
||||
```
|
||||
|
||||
| 옵션 | 설명 |
|
||||
|------|------|
|
||||
| `emoji=none` | 아이콘 숨김 |
|
||||
| `emoji=💡` | 아이콘 표시 |
|
||||
| `bg=gray` | 회색 배경 |
|
||||
| `bg=blue` | 파란 배경 |
|
||||
| `bg=green` | 초록 배경 |
|
||||
| `bg=yellow` | 노란 배경 |
|
||||
| `bg=red` | 빨간 배경 |
|
||||
| `bg=purple` | 보라 배경 |
|
||||
| `title="제목"` | 콜아웃 제목 |
|
||||
|
||||
### 토글
|
||||
|
||||
```markdown
|
||||
:::toggle open 더 보기
|
||||
내용
|
||||
:::
|
||||
```
|
||||
|
||||
| 옵션 | 설명 |
|
||||
|------|------|
|
||||
| `open`, `opened`, `default-open` | 기본 펼침 |
|
||||
| `closed`, `close`, `default-closed` | 기본 닫힘 |
|
||||
|
||||
### 링크/임베드 카드
|
||||
|
||||
```markdown
|
||||
:::link
|
||||
https://example.com
|
||||
:::
|
||||
```
|
||||
|
||||
| 옵션 | 설명 |
|
||||
|------|------|
|
||||
| `url=https://example.com` | URL |
|
||||
| `title=제목` | 카드 제목 |
|
||||
| `description=설명` 또는 `desc=설명` | 카드 설명 |
|
||||
| `thumbnail=이미지URL` 또는 `image=이미지URL` | 썸네일 |
|
||||
|
||||
### 비디오/오디오/파일 카드
|
||||
|
||||
```markdown
|
||||
:::video
|
||||
url=/uploads/posts/video.mp4
|
||||
title=영상 제목
|
||||
:::
|
||||
```
|
||||
|
||||
| 옵션 | 설명 |
|
||||
|------|------|
|
||||
| `url=` 또는 `src=` | 파일 URL |
|
||||
| `title=` | 제목 |
|
||||
| `description=` 또는 `desc=` | 설명 |
|
||||
| `poster=` 또는 `thumbnail=` | 비디오 포스터 |
|
||||
| `caption=` | 캡션 |
|
||||
| `name=`, `filename=`, `file=` | 파일명 |
|
||||
| `size=` | 파일 크기 표시 |
|
||||
|
||||
### iframe
|
||||
|
||||
```markdown
|
||||
:::iframe
|
||||
<iframe src="https://example.com"></iframe>
|
||||
:::
|
||||
```
|
||||
|
||||
### HTML
|
||||
|
||||
```markdown
|
||||
:::html
|
||||
<div class="custom">HTML</div>
|
||||
:::
|
||||
```
|
||||
|
||||
## 페이지 작성
|
||||
|
||||
| 입력 | 동작 | 위치 |
|
||||
|------|------|------|
|
||||
| 빈 HTML 문서 입력창에서 `!` 입력 후 `Tab` | 기본 HTML 문서 골격 삽입 | 페이지 HTML 문서 모드 |
|
||||
| 페이지 섹션 입력에서 `ArrowUp` / `ArrowDown` | 섹션 추천 이동 | 페이지 설정 |
|
||||
| 페이지 섹션 입력에서 `Enter` | 선택한 섹션 적용 | 페이지 설정 |
|
||||
| 페이지 섹션 입력에서 `Escape` | 섹션 추천 닫기 | 페이지 설정 |
|
||||
| 빈 페이지 섹션 입력에서 `Backspace` | 선택된 섹션 제거 | 페이지 설정 |
|
||||
|
||||
## 게시글 설정
|
||||
|
||||
| 입력 | 동작 | 위치 |
|
||||
|------|------|------|
|
||||
| 태그 입력에서 `ArrowUp` / `ArrowDown` | 태그 추천 이동 | 게시글 설정 |
|
||||
| 태그 입력에서 `Enter` | 추천 태그 선택 또는 입력 태그 추가 | 게시글 설정 |
|
||||
| 태그 입력에서 `,` | 입력 태그 추가 | 게시글 설정 |
|
||||
| 태그 입력에서 `Escape` | 태그 추천 닫기 | 게시글 설정 |
|
||||
| 빈 태그 입력에서 `Backspace` | 마지막 선택 태그 제거 | 게시글 설정 |
|
||||
|
||||
## 미디어 보기
|
||||
|
||||
| 입력 | 동작 | 위치 |
|
||||
|------|------|------|
|
||||
| `Escape` | 이미지 라이트박스 닫기 | 공개 게시글 이미지 확대 보기 |
|
||||
| `ArrowLeft` | 이전 이미지 | 이미지 라이트박스 |
|
||||
| `ArrowRight` | 다음 이미지 | 이미지 라이트박스 |
|
||||
@@ -1,5 +1,9 @@
|
||||
# 업데이트 이력
|
||||
|
||||
## v1.9.29
|
||||
|
||||
- 사이트 단축키·슬래시 명령·Markdown 약식 문법 정리 문서 추가.
|
||||
|
||||
## v1.9.28
|
||||
|
||||
- 페이지 HTML 문서 모드에서 태그 내부 스마트 따옴표가 HTML 속성 해석을 깨뜨리지 않도록 정규화 추가.
|
||||
|
||||
Reference in New Issue
Block a user