Page tree
Skip to end of metadata
Go to start of metadata


사이냅에디터에서 제공하는 다양한 기능들을 자유롭게 배치하고 사용 할 수 있습니다.

설정방법

'editor.toolbar'키를 이용해서 아래와 같이 설정합니다.

synapeditor.config.js
{
	'editor.toolbar': [
		'new','open','|', 
		'paragraphStyleWithText', '|', 
		'fontFamilyWithText', '|',
		'fontSizeWithText', '|',
		'bold', 'italic', 'underline', 'strike', '|',
		'fontColor', 'fontBackgroundColor'
	]
}

[적용결과]

기본설정

기본 제공되는 툴바 설정은 아래와 같습니다.

synapeditor.config.js
{
	'editor.toolbar': [
        'new', 'open', 'template', 'layout', '|',
        'undo', 'redo', '|',
        'copy', 'cut', 'paste', '|',
        'link', 'unlink', 'bookmark', '|',
        'image', 'background', 'video', 'file', '|',
        'table', 'div', 'horizontalLine', 'quote', '|',
        'specialCharacter', 'emoji', '-',
        'paragraphStyleWithText', '|',
        'fontFamilyWithText', '|',
        'fontSizeWithText', '|',
        'bold', 'italic', 'underline', 'strike', '|',
        'growFont', 'shrinkFont', '|',
        'fontColor', 'fontBackgroundColor', '|',
        'bulletList', 'numberedList', 'multiLevelList', '|',
        'align', '|',
        'lineHeight', '|',
        'decreaseIndent', 'increaseIndent'
    ],
}

[적용결과]

전체기능사용

사이냅에디터에서 제공하는 모든 기능을 사용하시려면 'editor.toolbar' 설정을 제거하면 됩니다.

전체기능 페이지에서 미리 확인 할 수 있습니다.


아이콘 및 기능설명

각 기능에 대한 KEY, ICON, 설명을 아래를 참고하세요.

KEYICON설명
new

편집중인 내용을 모두 지우고 새문서
open

문서를 임포트
print

인쇄
pageBreak

인쇄시 사용되는 페이지 구분자
template

템플릿 다이얼로그
autoSave

자동저장된 문서목록
undo

실행취소
redo

재실행

paragraphStyle

문단스타일 (P, H1 ~ H6)

paragraphStyleWithText

문단스타일 지정버튼 드롭다운

fontFamily

글꼴을 설정

fontFamilyWithText

글꼴설정 버튼 드롭다운

fontSize

글자크기

fontSizeWithText

글자크기 드롭다운
customParagraphStyle

사용자정의 문단스타일을 보여줍니다.
사용자정의 문단스타일은 config에 설정해야합니다.
customRunStyle

사용자정의 글자스타일을 보여줍니다.
사용자정의 글자스타일은 config에 설정해야합니다.
growFont

글자크기 한단계 키움
shrinkFont

글자크기 한단계 줄임
bold

굵게
italic

기울임
underline

밑줄
strike

취소선
superScript

위첨자
subScript

아래첨자
fontColor

글자색
fontBackgroundColor

글자배경색

align

>

문단정렬 (드롭다운: left, center, right, justify)

alignLeft

alignCenter

alignRight

alignJustify

왼쪽정렬

중앙정렬

오른쪽정렬

양쪽정렬

copy

복사
cut

잘라내기
paste

붙여넣기
copyRunStyle

서식복사
pasteRunStyle

서식붙여넣기
removeRunStyle

서식지우기
link

링크
unlink

링크해제
table

표 삽입
image

이미지 삽입
background

문서 배경 이미지 및 색 지정
video

동영상 삽입
file

파일 삽입
horizontalLine

가로줄 삽입
shapeEditor

도형삽입
specialCharacter

특수문자 삽입
emoji

이모지 삽입
div

레이어 삽입
drawDiv

레이어 그리기
quote

인용문구 삽입
bulletList

글머리 기호
numberedList

글머리 번호
multiLevelList

다단계 글머리
increaseIndent

들여쓰기
decreaseIndent

내어쓰기
lineHeight

줄간격
lineHeightWithText

줄간격 버튼
paragraphProperties

문단 상세속성 편집
fullScreen

전체화면
source

소스보기
preview

미리보기
ruler

줄자
divGuide (deprecated)

레이어 외각선 보이기/감추기

guide 2.9.0 이상

도형, 레이어 편집가이드 보이기/감추기
find

찾기/바꾸기
|
가로 나눔선
-
세로 나눔선
  • No labels