알로하 편집기 사용자 정의

Question

Aloha Editor을 굵게, 기울임 꼴 및 밑줄 버튼 만 표시하고 전체 도구 막대가 필요 이상으로 커지지 않도록 구성 할 수 있습니까?

Answer 1

예, 도구 모음의 구성 설정을 살펴 걸릴 사용자 정의 할 수 있습니다 : 당신은 GitHub의에서 데모 응용 프로그램을 확인이 설정을 추가 할 수있는 설정 파일을 사용하기 시작이 있으면

http://aloha-editor.org/guides/ui.html#configuration

을 그리고 .

https://github.com/alohaeditor/Aloha-Editor/blob/dev/src/demo/demo-app/app/js/demo-app-load.js

당신이에서 데모/3col의 소스 코드를 확인할 수 있습니다 이것에 대한 대안도있다 :

http://aloha-editor.org/demos/3col/

<script> 
    var Aloha = window.Aloha || (window.Aloha = {}); 

    Aloha.settings = { 
     locale: 'en', 
     plugins: { 
      format: { 
       config: [ 'b', 'i', 'p', 'sub', 'sup', 'del', 'title', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'pre', 'removeFormat' ], 
       editables : { 
        // no formatting allowed for title 
        '#title' : [ ] 
       } 
      }, 
      link: { 
       editables : { 
        // No links in the title. 
        '#title' : [ ] 
       } 
      }, 
      list: { 
       editables : { 
        // No lists in the title. 
        '#title' : [ ] 
       } 
      }, 
      abbr: { 
       editables : { 
        // No abbr in the title. 
        '#title' : [ ] 
       } 
      }, 
      image: { 
       'fixedAspectRatio': true, 
       'maxWidth': 1024, 
       'minWidth': 10, 
       'maxHeight': 786, 
       'minHeight': 10, 
       'globalselector': '.global', 
       'ui': { 
        'oneTab': false 
       }, 
       editables : { 
        // No images in the title. 
        '#title' : [ ] 
       } 
      } 
     }, 
     sidebar: { 
      disabled: true 
     }, 
     contentHandler: { 
      allows: { 
       elements: [ 
        'a', 'abbr', 'b', 'blockquote', 'br', 'caption', 'cite', 'code', 'col', 
        'colgroup', 'dd', 'del', 'dl', 'dt', 'em', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 
        'i', 'img', 'li', 'ol', 'p', 'pre', 'q', 'small', 'strike', 'strong', 
        'sub', 'sup', 'table', 'tbody', 'td', 'tfoot', 'th', 'thead', 'tr', 'u', 
        'ul', 'span', 'hr', 'object', 'div' 
       ], 

       attributes: { 
        'a': ['href', 'title', 'id', 'class', 'target', 'data-gentics-aloha-repository', 'data-gentics-aloha-object-id'], 
        'div': [ 'id', 'class'], 
        'abbr': ['title'], 
        'blockquote': ['cite'], 
        'br': ['class'], 
        'col': ['span', 'width'], 
        'colgroup': ['span', 'width'], 
        'img': ['align', 'alt', 'height', 'src', 'title', 'width', 'class'], 
        'ol': ['start', 'type'], 
        'q': ['cite'], 
        'p': ['class'], 
        'table': ['summary', 'width'], 
        'td': ['abbr', 'axis', 'colspan', 'rowspan', 'width'], 
        'th': ['abbr', 'axis', 'colspan', 'rowspan', 'scope', 'width'], 
        'ul': ['type'], 
        'span': ['class','style','lang','xml:lang'] 
       }, 

       protocols: { 
        'a': {'href': ['ftp', 'http', 'https', 'mailto', '__relative__']}, 
        'blockquote': {'cite': ['http', 'https', '__relative__']}, 
        'img': {'src' : ['http', 'https', '__relative__']}, 
        'q': {'cite': ['http', 'https', '__relative__']} 
       } 
      } 
     } 
    }; 
</script> 

<script type="text/javascript" src="http://cdn.aloha-editor.org/latest/lib/aloha.js" 
      data-aloha-plugins="common/ui, 
           common/format, 
           common/table, 
           common/list, 
           common/link, 
           common/highlighteditables, 
           common/block, 
           common/undo, 
           common/image, 
           common/contenthandler, 
           common/paste, 
           common/commands, 
           common/abbr"></script> 

<!-- turn an element into editable Aloha continuous text --> 
<script type="text/javascript"> 
Aloha.ready(function() { 
    $('#title').aloha(); 
    $('#multicolumnElement').aloha(); 
}); 

</script> 

Answer 2

그것은 알아낼 걸 렸어요은 이 대답을 읽은 후에도 똑같은 일을하는 법. 여기

내가 무슨 짓을 :

• Aloha.settings
  는
• plugins.format.config aloha.js 포함하기 전에 정의 :

  <script language="javascript"> 
       Aloha = window.Aloha || {}; 
  
       Aloha.settings = { 
        plugins: { 
         format: { 
          config: [ 'b', 'i', 'u','del'] 
         } 
        }, 
        toolbar: { 
         exclude: ['formatBlock', '\n','subscript', 'superscript'] 
        }, 
        sidebar: { 
         disabled: true 
        } 
       }; 
  
       </script> 
       <script src="/src/aloha/lib/aloha.js" 
       data-aloha-plugins="common/ui,common/format"></script> 
  

  중요한 점은 코드에서 주목 버튼을 형식 플러그인에 사용할 수 있도록 설정합니다.

• toolbar.exclude는 내가 원하지 않는 것들을 제거합니다.
• 내 구성에는 취소 선 옵션 인 'del'이 포함되며 OP의 요청 옵션에는 포함되지 않습니다. 그들은이 나를 위해 일하기 때문에 나는 걱정하지 않았다 구성에없는 내가 몇 불필요한 설정 옵션이 있다면 난 상관하지 않기 때문에

나는 첨자와 위첨자를 제거 할 필요가 없습니다 수 있습니다.