styles.js 에 코드를 추가하여 사용자지정 스타일을 추가할 수 있습니다.

<div> 추가하기

styles.js 에서 다음을 찾아 바로 아래에 스타일을 추가합니다.

{
name: 'Special Container',
element: 'div',
styles: {
padding: '5px 10px',
background: '#eee',
border: '1px solid #ccc'
}
},

예시 )

{
name: 'Custom Div ',
element: 'div',
styles: {
padding: '15px',
background: '#f7f7f7',
border: '1px solid #ccc'
border_radius: '15px'
}
},

또는 div에 class를 추가하고 스타일 시트를 이용할 수도 있습니다. 아래 코드처럼 작성하여 추가합니다.

{ name: 'Custom Div ', element: 'div', attributes: { 'class': 'custom_div' } },

style.css에 스타일 지정합니다.

.custom_div { padding :15px;
background: #f7f7f7;
border: 1px solid #ccc
border-radius: 15px;
}

<span> class 추가하기

위에서 했던 방식처럼 아래 코드처럼 작성하여 추가합니다.

{ name: 'color1', element: 'span', attributes: { 'class': 'red' } },

style.css에 스타일 지정합니다.

.red { color: #ff5656;}

에디터 > 툴바 > 스타일에서 선택해 사용합니다.

끝!