Synap Editor Documentation
Page tree
Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 2 Next »

The initialization of the Synap Editor is simple as shown below.

new SynapEditor('synapEditor');

Additional preferences can be specified as arguments when creating the editor object, or through a separate configuration file.

Configuring the Editor on object creation

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
});


Configuring the Editor via separate config file

설정 객체 사용방법: 스크립트 추가, 에디터 초기화 config를 설정합니다.

<!DOCTYPE html>
<html lang="ko">
    <script src='synapeditor.config.js'></script>
    <script>
        function initEditor() {
            new SynapEditor('synapEditor', synapEditorConfig);
        }
    </script>
    <body onload="initEditor();">
        <div id="synapEditor"></div>
    </body>
</html>


사이냅 에디터 기본 설정 객체 입니다.

key, value 형태로 설정하며, 사용하지 않는 설정 제거시 기본설정으로 동작합니다.

synapeditor.config.js
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']
}


Setting Lincense

Set the path or license object for the license file.

The 'editor.license' setting is required, and the editor will not work if it is not set.


synapeditor.config.js
{
    'editor.license': '/resource/license.json'
}


synapeditor.config.js
{
    'editor.license': {
        'company': 'SynapSoft',
        'key': [
            'licenseKey'
        ]
    }
}


Sample initialization result

If the parameters above are used, the Editor will look like this:

  • No labels