1. CKEditor 를 다운 받을 때 최적화된 코드로 다운받으면 코드 해석이 어렵게 됨. 최적화된 코드를 기준으로 추가된 항목을 확인하면 아래와 같다.    xe/..../ckeditor/config.js

(function(){CKEDITOR.plugins.add("btgrid",{lang:"en,ru,fr,nl",requires:"widget,dialog",icons:"btgrid",init:function(b){var f=b.lang.btgrid;CKEDITOR.dialog.add("btgrid",this.path+"dialogs/btgrid.js");b.addContentsCss(this.path+"styles/editor.css");b.ui.addButton("btgrid",{label:f.createBtGrid,command:"btgrid",icon:this.path+"icons/btgrid.png"});b.widgets.add("btgrid",{allowedContent:"div(!btgrid);div(!row,!row-*);div(!col-*-*);div(!content)",requiredContent:"div(btgrid)",parts:{btgrid:"div.btgrid"},
editables:{content:""},template:'\x3cdiv class\x3d"btgrid"\x3e\x3c/div\x3e',dialog:"btgrid",defaults:{},upcast:function(a){return"div"==a.name&&a.hasClass("btgrid")},init:function(){var a=1,e=this.element.getChildCount();for(a;a<=e;a++)this.createEditable(12,a)},data:function(){if(this.data.colCount&&1>this.element.getChildCount())for(var a=this.data.colCount,e=this.data.rowCount,h=this.data.rowHeight,c=this.parts.btgrid,d=1;d<=e;d++)this.createGrid(a,c,d,h)},createGrid:function(a,e,c,h){for(var d='\x3cdiv class\x3d"row row-'+
c+'"\x3e',b=1;b<=a;b++)d=d+'\x3cdiv class\x3d"col col-md-'+12/a+'"\x3e  \x3cdiv class\x3d"content" style="min-height:'+h+'em;"\x3e    \x3cp\x3eCol '+b+" content area\x3c/p\x3e  \x3c/div\x3e\x3c/div\x3e";e.appendHtml(d+"\x3c/div\x3e");this.createEditable(a,c)},createEditable:function(a,b){for(var c=1;c<=a;c++)this.initEditable("content"+b+c,{selector:".row-"+b+" \x3e div:nth-child("+c+") div.content"})}})}})})();

2. btgrid 플러그인 수정  ckeditor/plugins/btgrid/dialogs/btgrid.js

CKEDITOR.dialog.add("btgrid",function(d){function c(a){return function(){var b=this.getValue();(b=!!(CKEDITOR.dialog.validate.integer()(b)&&0<b))||alert(a);return b}}var b=d.lang.btgrid;return{title:b.editBtGrid,minWidth:240,minHeight:120,onShow:function(){var a=d.getSelection();a.getRanges();var b=this.getName(),c=this.getContentElement("info","rowCount"),e=this.getContentElement("info","colCount"),h=this.getContentElement("info","rowHeight");"btgrid"==b&&(a=a.getSelectedElement())&&(this.setupContent(a),c&&c.disable(),e&&e.disable())},contents:[{id:"info",
label:b.infoTab,accessKey:"I",elements:[{id:"colCount",type:"select",required:!0,label:b.selNumCols,items:[["2",2],["3",3],["4",4],["6",6],["12",12]],validate:c(b.numColsError),setup:function(a){this.setValue(a.data.colCount)},commit:function(a){a.setData("colCount",this.getValue())}},{id:"rowCount",type:"number",width:"50px",required:!0,label:b.genNrRows,validate:c(b.numRowsError),setup:function(a){this.setValue(a.data.rowCount)},commit:function(a){a.setData("rowCount",this.getValue())}},
{id:"rowHeight",type:"number",width:"50px",label:"줄높이입력",setup:function(a){this.setValue(a.data.rowHeight)},commit:function(a){a.setData("rowHeight",this.getValue())}}
]}]}});

 

CKeditor 의 Plugins 의 Dialog 상자 안에서  개별 field 요소(입력폼)의 값 변경시 다른 fields 요소(입력폼)에 영향을 끼쳐 원하는 값을 입력할 수 있도록 하는 방법입니다. - 아 설명이 이게 맞나? 아무튼 아래 그림으로 설명합니다. 

위 이미지와 같이 하나의 입력 field 를 수정하면 다른 입력 field 도 같이 바뀌는 거죠. 

{
  type: 'number',
  id: 'input-all',
  label: '일괄적용',
  onChange: function() {
      this.getDialog().setValueOf("탭id", "input-왼쪽위", this.getValue());
      this.getDialog().setValueOf("탭id", "input-오른쪽위", this.getValue());
      this.getDialog().setValueOf("탭id", "input-왼쪽아래", this.getValue());
      this.getDialog().setValueOf("탭id", "input-오른쪽아래", this.getValue());
   }
}

XE 로그인 폼과 관련 있는 CSS 임

xe/modules/message/skins/xedition/css/message.css

CAMERON STAGE Layout For XE 

XE 용 레이아웃 스킨 STAGE Layout 은 브라우저의 가로 폭① 이 특정 너비에 도달하면 주 메뉴 ② 가 펼쳐집니다.

이 때 특정 너비(메뉴가 펼쳐지는 한계값)을 바꾸는 방법입니다. 

1. xe/layouts/stage/css/stage.css 파일의 203 라인의 max-width 값을 변경합니다. 

@media screen and (max-width: 1680px){
#stage-content{padding-right:220px; padding-left:60px}
}

@media screen and (max-width: 1560px){
.stage-pc #stage-visual .sbtn{right:20px}
.stage-mobile #stage-visual .sbtn{right:0}
#lighting, #stage-cont #lighting{margin-right:-460px}
#lighting2{right:0; margin-right:-640px}
#lighting-m{display:block}
#stage.stage-pc{padding-right:20px}
#stage.stage-mobile{padding-right:0}
#stage-content{padding-right:100px; padding-left:100px}
#stage-contfull{padding-right:0}
}

@media screen and (max-width: 1140px){
#stage-content{padding-right:80px; padding-left:80px}
}

2. xe/layouts/stage/_settings.html 파일에서 65 라인 max-width 값을 변경 

<style type="text/css" id="settings">
<!--@if($layout_info->nav_width)-->
#lighting{width:{$layout_info->nav_width}px}
#lighting2{right:{$layout_info->nav_width}px}
#stage-visual .sbtn{right:{$layout_info->nav_width}px}
#stage{padding-right:{$layout_info->nav_width}px}
@media screen and (max-width: 1560px){
#stage-visual .sbtn{right:20px}
#lighting, #stage-cont #lighting{margin-right:-{$layout_info->nav_width-20}px}
#lighting2{right:0; margin-right:-{$layout_info->nav_width+160}px}
#stage{padding-right:20px}
}
<!--@endif-->

위와 같이 elFinder 에서 네트워크 드라이브를 마운트 할 경우 NetworkGroup 에 들어가도록 설정하는 방법입니다. 

    public function __construct()
    {
        $opts = array(
            'phash'  => 'gN_Lw',
            'client_id' => '',
            'client_secret' => '',
            'accessToken' => '',