1. 에디터 초기화
사이냅 에디터의 초기화는 아래와 같이 새 객체를 생성하는 구문으로 간단히 이루어집니다.
...
추가적인 환경설정은 SynapEditor 객체 생성시에 인자로 명시하거나, 별도의 설정 파일을 통해서도 가능합니다.
...
객체 생성을 통한 환경설정
| Code Block | ||||
|---|---|---|---|---|
| ||||
window.editor = new SynapEditor('synapEditor', {
'editor.license': '/resource/license.json',
'editor.toolbar': ['new','open','|', 'paragraphStyleWithText', '|', 'fontFamilyWithText', '|','fontSizeWithText', '|','bold', 'italic', 'underline', 'strike', '|','fontColor', 'fontBackgroundColor'],
'editor.size.width': '100%',
'editor.size.height': '100%',
'editor.lang.default': 'en',
'editor.menu.show': false
}); |
...
독립적인 config file을 이용한 환경설정
설정 객체 사용방법: 스크립트 추가, 에디터 초기화 config를 설정합니다.
...
| Code Block | ||||||
|---|---|---|---|---|---|---|
| ||||||
var synapEditorConfig = {
'editor.license': '/resource/license.json',
'editor.size.width': '100%',
'editor.size.height': '100%',
'editor.lang.default': 'en',
'editor.menu.show': false,
'editor.toolbar': ['new','open','|', 'paragraphStyleWithText', '|', 'fontFamilyWithText', '|','fontSizeWithText', '|','bold', 'italic', 'underline', 'strike', '|','fontColor', 'fontBackgroundColor']
}
|
...
라이센스 설정
라이센스 파일의 경로 또는 라이센스 객체를 설정합니다.
...
| Code Block | ||||||
|---|---|---|---|---|---|---|
| ||||||
{
'editor.license': {
'company': 'SynapSoft',
'key': [
'licenseKey'
]
}
}
|
...
초기화 예시
위와 같은 파라메터들을 설정한 경우 사이냅에디터는 아래와 보입니다.
...