X Editor WYSIWYG HTML 에디터

심플하고 필요한 핵심기능을 모두 갖춘 X editor의 상세 기능을 확인하고 무료로 사용해 보세요.

리뷰 설치 다운로드

X Editor 라이브 데모

X Editor 옵션

X Editor 주요기능

기본적인 입력 서식 작성 가능(볼드, 이탤릭, 밑줄, 취소선) 및 폰트 컬러, 폰트 배경색지정을 컬러 팔래트로 쉽게 지정이 가능합니다.

폰트 헤더 지정, 목록 스타일, 인용부호, 라인블록 지정으로 입력 문장을 스타일쉬 하고 가독성을 높여 줍니다.

지원하는 Font family의 추가/삭제가 가능합니다.

소스코드에 대한 하이라이트 기능을 제공합니다.

Table에 대한 간편한 rows/추가/삭제, cols/추가/삭제 및 Cell 서식/Table 서식 작업이 가능합니다.

KaTeX지원으로 수학 공식의 입력 및 수정이 직관적으로 작성 가능합니다.

Map(OpenLayers, Google Map, Nate Map, Naver Map)에 대한 삽입이 편리하고 원하는 위치의 마커 설정도 간편 합니다.

미디어 (Link, Image, Video, Audio, File)에 대해서 크기 조정 및 편리한 서식 지정이 가능합니다.

API기능으로는 "getContent()", "getTexts()", "setContent(html)"등을 사용합니다.

X Editor 라이센스

아래 조건을 충족할 경우 모든 사용자에게 무료 입니다.

X editor의 지적 재산권은 epari에 있습니다.

X editor은 개인 및 기업 사용자를 포함한 모든 사용자에게 무료로 제공되며 자유롭게 사용 하실 수 있습니다.

X editor은 일부를 수정, 판매할 수 없으며 배포되는 형태 그대로 사용해야 합니다.

X Editor 그룹 메뉴 미적용

X Editor 그룹 메뉴 미적용 예시

X Editor 옵션

  var xeditorOptions = {
                           isTooltip     : true ,
                           readOnly      : false,
                           lang          : 'en' ,
                           isSpellcheck  : false, 
                           placeholder   : 'Input Youer Contents.',  
                           height        : '400px'             , minHeight: '170px', maxHeight: '100%',
                           width         : 'calc(100% - 50px)' , minWidth : '200PX', maxWidth : '100%', 
                           mapSetting    : { defaultProvider: 'OpenLayers', 
                                             markerIcon     : '',
                                             markerWidth    : '26',
                                             markerHeight   : '50',
                                             startLat       : 0,
                                             startLng       : 0,
                                             Provider       : {'Google':true, 'Naver' :true, 'Kakao' :true, 'OpenLayers':true }
                                           } ,
                           modules       : { syntax : true, 
                                             formula: true, 
                                             toolbar: [ 
                                                         'bold', 'italic', 'underline', 'strike','clean'  ,       // toggled buttons
                                                         { 'color' : []       }, { 'background': []       } ,     // color picker
                                                         { 'header': 1        }, { 'header'    : 2        } ,     // font header
                                                         { 'list'  : 'ordered'}, { 'list'      : 'bullet' } ,     // ordered list
                  
                                                         'blockquote', 'code-line', 'code-block', {'table': []} , // block type input
                                                         'link'      , 'image'    , 'video'     , 'audio', 'upload', 'formula', 'map' ,      // link and image, video, audio, file, map                      
                  
                                                         { 'indent': '+1'     }, { 'indent'    : '-1'     } ,     // indent/outdent
                                                         { 'script': 'sub'    }, { 'script'    : 'super'  } ,     // superscript/subscript
                                                         { 'align' : []       }, { 'direction' : 'rtl'    } ,     // align dropdown, text direction
                  
                                                         { 'size'  : ['small', false, 'large', 'huge']    } ,     // font size dropdown
                                                         { 'header': [1, 2, 3, 4, 5, 6]                   } ,     // font header dropdown
                                                         { 'font'  : ['Serif','Monospace','Arial','Verdana','Georgia','Helvetica','Impact','Symbol','Tahoma','Terminal','Webdings','Wingdings'] },  // font family dropdown
                             
                                                    ] 
                                           },
                       };

X Editor 메뉴 옵션 미적용

X Editor 메뉴 옵션 미적용 예시

X Editor 옵션

  var xeditorOptions = {
                           isTooltip     : true ,
                           readOnly      : false,
                           lang          : 'en' ,
                           isSpellcheck  : false, 
                           placeholder   : 'Input Youer Contents.',  
                           height        : '400px'             , minHeight: '170px', maxHeight: '100%',
                           width         : 'calc(100% - 50px)' , minWidth : '200PX', maxWidth : '100%', 
                           mapSetting    : { defaultProvider: 'OpenLayers', 
                                             markerIcon     : '',
                                             markerWidth    : '26',
                                             markerHeight   : '50',
                                             startLat       : 0,
                                             startLng       : 0,
                                             Provider       : {'Google':true, 'Naver' :true, 'Kakao' :true, 'OpenLayers':true }
                                           } ,
                           modules       : { syntax : true, 
                                             formula: true, 
                                             toolbar: [  ] 
                                           },
                       };

X Editor 최소화 기능 적용

X Editor 최소화 기능 적용 예시

X Editor 옵션

  var xeditorOptions = {
                           isTooltip     : true ,
                           readOnly      : false,
                           lang          : 'en' ,
                           isSpellcheck  : false, 
                           placeholder   : 'Input Youer Contents.',  
                           height        : '400px'             , minHeight: '170px', maxHeight: '100%',
                           width         : 'calc(100% - 50px)' , minWidth : '200PX', maxWidth : '100%', 
                           mapSetting    : { defaultProvider: 'OpenLayers', 
                                             markerIcon     : '',
                                             markerWidth    : '26',
                                             markerHeight   : '50',
                                             startLat       : 0,
                                             startLng       : 0,
                                             Provider       : {'Google':true, 'Naver' :true, 'Kakao' :true, 'OpenLayers':true }
                                           } ,
                           modules       : { syntax : true, 
                                             formula: true, 
                                             toolbar: [  
                                                        [ 'bold', 'italic', 'underline', 'strike','clean'            ],   // (Group) toggled buttons
                                                        [ { 'color' : []       }, { 'background': []       }         ],   // (Group) color picker
                                                        [ { 'header': 1        }, { 'header'    : 2        }         ],   // (Group) font header
                                                        [ 'link'      , 'image'    , 'video'     , 'audio', 'upload' ],   // (Group) link and image, video, audio, file 
                                                        [ 'blockquote', 'code-line', 'code-block'                    ],   // (Group) block type input
                                                      ] 
                                           },
                       };

X Editor 읽기 전용 전환

X Editor 읽기 전용 전환 예시

X Editor 옵션

  var xeditorOptions = {
                           isTooltip     : true ,
                           readOnly      : true ,  // Input Disabled
                           lang          : 'en' ,
                           isSpellcheck  : false, 
                           placeholder   : 'Comments can only be entered after logging in.',  
                           height        : '400px'             , minHeight: '170px', maxHeight: '100%',
                           width         : 'calc(100% - 50px)' , minWidth : '200PX', maxWidth : '100%', 
                           mapSetting    : { defaultProvider: 'OpenLayers', 
                                             markerIcon     : '',
                                             markerWidth    : '26',
                                             markerHeight   : '50',
                                             startLat       : 0,
                                             startLng       : 0,
                                             Provider       : {'Google':true, 'Naver' :true, 'Kakao' :true, 'OpenLayers':true }
                                           } ,
                           modules       : { syntax : true, 
                                             formula: true, 
                                             toolbar: [  
                                                        [ 'bold', 'italic', 'underline', 'strike','clean'            ],   // (Group) toggled buttons
                                                        [ { 'color' : []       }, { 'background': []       }         ],   // (Group) color picker
                                                        [ { 'header': 1        }, { 'header'    : 2        }         ],   // (Group) font header
                                                        [ 'link'      , 'image'    , 'video'     , 'audio', 'upload' ],   // (Group) link and image, video, audio, file 
                                                        [ 'blockquote', 'code-line', 'code-block'                    ],   // (Group) block type input
                                                      ] 
                                           },
                       };

로그인 회원가입 이용약관 개인정보 취급방침

Table

테마