리치 텍스트 편집기 플러그인 구성 configure-the-rich-text-editor-plug-ins

Last update: Thu May 04 2023 00:00:00 GMT+0000 (Coordinated Universal Time)

주제:
Administering

작성 대상:

Admin

CAUTION

AEM 6.4가 확장 지원이 종료되었으며 이 설명서는 더 이상 업데이트되지 않습니다. 자세한 내용은 기술 지원 기간. 지원되는 버전 찾기 여기.

RTE 기능은 각각 기능 속성이 있는 일련의 플러그인을 통해 사용할 수 있습니다. 하나 이상의 RTE 기능을 활성화하거나 비활성화하도록 기능 속성을 구성할 수 있습니다. 이 문서에서는 RTE 플러그인을 구체적으로 구성하는 방법을 설명합니다.

다른 RTE 구성에 대한 자세한 내용은 리치 텍스트 편집기 구성.

NOTE

CRXDE Lite 작업 시, 모두 저장 선택 사항입니다.

플러그인 활성화 및 기능 속성 구성 activateplugin

플러그인을 활성화하려면 다음 단계를 수행하십시오. 일부 단계는 해당 노드가 없으므로 처음으로 플러그인을 구성할 때만 필요합니다.

기본적으로 format, link, list, justify, 및 control 플러그인과 그 모든 기능은 RTE에서 활성화됩니다.

NOTE

각각 rtePlugins node를 <rtePlugins-node> 이 문서에서 중복을 방지하려면 다음을 수행하십시오.

CRXDE Lite을 사용하여 프로젝트의 텍스트 구성 요소를 찾습니다.
의 상위 노드를 만듭니다. <rtePlugins-node> 존재하지 않는 경우 RTE 플러그인을 구성하기 전에 다음을 수행합니다.
- 구성 요소에 따라 상위 노드는 다음과 같습니다.
  - config: .../text/cq:editConfig/cq:inplaceEditing/config
  - 대체 구성 노드: .../text/cq:editConfig/cq:inplaceEditing/inplaceEditingTextConfig
  - text: .../text/dialog/items/tab1/items/text
- 유형: jcr:primaryType cq:Widget
- 두 속성 모두 다음 속성을 갖습니다.
  - 이름 name
  - 유형 String
  - 값 ./text
구성할 인터페이스에 따라 노드를 만듭니다 <rtePlugins-node>가 없는 경우:
- 이름 rtePlugins
- 유형 nt:unstructured
아래에서 활성화할 각 플러그인에 대해 노드를 만듭니다.
- 유형 nt:unstructured
- 이름 필요한 플러그인의 플러그인 ID

플러그인을 활성화한 후 다음 지침에 따라 을 구성합니다 features 속성을 사용합니다.

모든 기능 활성화

몇 가지 특정 기능 활성화

모든 기능 비활성화

이름

기능

유형

문자열

문자열(다중 문자열) type 을 String으로 설정하고 Multi in CRXDE Lite 클릭)

문자열

값

* (별표)

하나 이상의 피쳐 값으로 설정합니다.

findreplace 플러그인 이해 understand-findreplace-plugin

다음 findreplace 플러그인에는 구성이 필요하지 않습니다. 그것은 즉시 작동합니다.

바꾸기 기능을 사용하면 찾기 문자열과 동시에 대체할 바꾸기 문자열을 입력해야 합니다. 단, 계속 찾기를 클릭하여 문자열을 대체하기 전에 검색할 수 있습니다. 찾기를 클릭한 후 바꾸기 문자열을 입력하면 검색은 텍스트 시작으로 재설정됩니다.

찾기를 클릭하면 찾기 및 바꾸기 대화 상자가 투명해지고, 바꾸기를 클릭하면 불투명해집니다. 이로써 작성자는 대체될 텍스트를 검토할 수 있습니다. 사용자가 모두 바꾸기를 클릭하면 대화 상자가 닫히고 교체 수가 표시됩니다.

붙여넣기 모드 구성 paste-modes

RTE를 사용할 때 작성자가 다음 세 가지 모드 중 하나로 컨텐츠를 붙여넣을 수 있습니다.

브라우저 모드: 브라우저의 기본 붙여넣기 구현을 사용하여 텍스트를 붙여넣습니다. 원하지 않는 마크업을 도입할 수 있으므로 권장되지 않는 방법입니다.
일반 텍스트 모드: 클립보드 내용을 일반 텍스트로 붙여넣습니다. 여기에 삽입하기 전에 복사한 컨텐츠에서 스타일과 서식의 모든 요소를 제거합니다 Experience Manager 구성 요소.
MS Word 모드: MS Word에서 복사할 때 서식을 지정하여 표를 포함한 텍스트를 붙여넣습니다. 웹 페이지나 MS Excel과 같은 다른 소스에서 텍스트를 복사하고 붙여넣는 것은 지원되지 않으며 부분 형식만 유지합니다.

RTE 도구 모음에서 작성자에게 이 세 가지 아이콘 중 일부, 전체 또는 하나도 제공할 수 없습니다.

붙여넣기(Ctrl+V): 위의 세 가지 붙여넣기 모드 중 하나에 해당하도록 사전 구성할 수 있습니다.
텍스트로 붙여넣기: 일반 텍스트 모드 기능을 제공합니다.
Word에서 붙여넣기: MS Word 모드 기능을 제공합니다.

필요한 아이콘을 표시하도록 RTE를 구성하려면 다음 단계를 따르십시오.

예를 들어 구성 요소로 이동합니다 /apps/<myProject>/components/text.
노드로 이동합니다 rtePlugins/edit. 자세한 내용은 플러그인 활성화 노드가 없는 경우
만들기 features 속성 edit 노드를 추가하고 하나 이상의 기능을 추가합니다. 모든 변경 내용을 저장합니다.

붙여넣기(Ctrl+V) 아이콘과 바로 가기 동작을 구성합니다 configure-paste-icon-shortcut

의 동작을 미리 구성할 수 있습니다 붙여넣기(Ctrl+V) 아이콘 사용. 또한 이 구성은 작성자가 컨텐츠를 붙여넣는 데 사용하는 키보드 단축키 Ctrl+V의 동작을 정의합니다.

구성에서는 다음 세 가지 유형의 사용 사례를 허용합니다.

브라우저의 기본 붙여넣기 구현을 사용하여 텍스트를 붙여넣습니다. 원하지 않는 마크업을 도입할 수 있으므로 권장되지 않는 방법입니다. 를 사용하여 구성됨 browser 아래의 제품에서 사용할 수 있습니다.
클립보드 내용을 일반 텍스트로 붙여넣습니다. AEM 구성 요소에 삽입하기 전에 복사한 컨텐츠에서 스타일 및 서식의 모든 요소를 제거합니다. 를 사용하여 구성됨 plaintext 아래의 제품에서 사용할 수 있습니다.
MS Word에서 복사할 때 서식을 지정하여 표를 포함한 텍스트를 붙여넣습니다. 웹 페이지나 MS Excel과 같은 다른 소스에서 텍스트를 복사하고 붙여넣는 것은 지원되지 않으며 부분 형식만 유지합니다. 를 사용하여 구성됨 wordhtml 아래의 제품에서 사용할 수 있습니다.

구성 요소에서 다음 위치로 이동합니다. <rtePlugins-node>/edit 노드 아래에 있어야 합니다. 노드가 없으면 노드를 만듭니다. 자세한 내용은 플러그인 활성화.
에서 edit node는 다음 세부 정보를 사용하여 속성을 만듭니다.
- 이름 defaultPasteMode
- 유형 String
- 값 필요한 붙여넣기 모드 중 하나 browser, plaintext, 또는 wordhtml.

컨텐츠를 붙여넣을 때 허용되는 형식을 구성합니다 paste-formats

Paste-as-Microsoft-Word(paste-wordhtml) 모드를 추가로 구성할 수 있으므로 Microsoft Word와 같은 다른 프로그램에서 AEM에 붙여넣을 때 사용할 수 있는 스타일을 명시적으로 정의할 수 있습니다.

예를 들어 AEM에서 붙여넣을 때 굵은 서식과 목록만 허용해야 하는 경우 다른 형식을 필터링할 수 있습니다. 이를 구성 가능한 붙여넣기 필터링이라고 하며 두 작업 모두에 대해 수행할 수 있습니다.

텍스트
링크

링크의 경우 자동으로 수락되는 프로토콜을 정의할 수도 있습니다.

다른 프로그램에서 AEM에 텍스트를 붙여넣을 때 사용할 수 있는 형식을 구성하려면:

구성 요소에서 노드로 이동합니다 <rtePlugins-node>/edit. 노드가 없으면 노드를 만듭니다. 자세한 내용은 플러그인 활성화.
아래에 노드를 만듭니다. edit HTML 붙여넣기 규칙을 보류할 노드:
- 이름 htmlPasteRules
- 유형 nt:unstructured
아래에 노드 만들기 htmlPasteRules, 허용되는 기본 형식의 세부 사항을 보관하려면 다음을 수행하십시오.
- 이름 allowBasics
- 유형 nt:unstructured

허용되는 개별 형식을 제어하려면 allowBasics 노드:

이름 bold
이름 italic
이름 underline
이름 anchor (링크 및 명명된 앵커에 대해)
이름 image

모든 속성은 유형 Boolean따라서 적절한 값 확인 표시를 선택하거나 제거하여 기능을 활성화하거나 비활성화할 수 있습니다.

note note
NOTE
명시적으로 정의되지 않은 경우 기본값인 true가 사용되고 형식이 승인됩니다.

다른 형식도 다른 속성 또는 노드의 범위를 사용하여 정의할 수 있으며 htmlPasteRules 노드 아래에 있어야 합니다. 모든 변경 내용을 저장합니다.

에 다음 속성을 사용할 수 있습니다 htmlPasteRules.

속성

유형

설명

allowBlockTags

문자열

허용되는 블록 태그 목록을 정의합니다. 가능한 몇 가지 블록 태그는 다음과 같습니다.

제목(h1, h2, h3)
단락 (p)
목록(ol, ul)
표(테이블)

fallbackBlockTag

문자열

에 포함되지 않은 블록 태그가 있는 모든 블록에 사용되는 블록 태그를 정의합니다 allowBlockTags. p 대부분의 경우에 충분합니다.

표

nt:unstructured

표를 붙여넣을 때의 동작을 정의합니다. 이 노드에는 속성이 있어야 합니다 allow (부울 유형) 테이블 붙여넣기가 허용되는지 여부를 정의합니다. 허용 이 로 설정된 경우 false, 속성을 지정해야 합니다 ignoreMode (문자열 유형) 을 사용하여 붙여넣은 테이블 컨텐츠가 처리되는 방식을 정의합니다. 에 대한 유효한 값 ignoreMode 입니다.

remove: 테이블 컨텐츠를 제거합니다.
paragraph: 표 셀을 단락으로 변환합니다.

list

nt:unstructured

목록을 붙여넣을 때의 동작을 정의합니다. 속성이 있어야 합니다. allow (부울 유형) 을 입력하여 목록 붙여넣기가 허용되는지 여부를 정의합니다. If allow 가 로 설정되어 있습니다. false, 속성을 지정해야 합니다 ignoreMode (문자열 유형) 붙여넣은 목록 컨텐츠를 처리하는 방법을 정의합니다. 에 대한 유효한 값 ignoreMode 입니다.

remove: 목록 콘텐츠를 제거합니다.
paragraph: 목록 항목을 단락으로 바꿉니다.

올바른 예 htmlPasteRules 구조는 아래에 있습니다.

"htmlPasteRules": {
    "allowBasics": {
        "italic": true,
        "link": true
    },
    "allowBlockTags": [
        "p", "h1", "h2", "h3"
    ],
    "list": {
        "allow": false,
        "ignoreMode": "paragraph"
    },
    "table": {
        "allow": true,
        "ignoreMode": "paragraph"
    }
}

텍스트 스타일 구성 text-styles

작성자가 스타일을 적용하여 텍스트 부분을 변경할 수 있습니다. 스타일은 CSS 스타일 시트에서 미리 정의한 CSS 클래스를 기반으로 합니다. 스타일이 지정된 콘텐츠는 span 태그를 사용하여 class CSS 클래스를 참조할 속성입니다. (예: <span class=monospaced>Monospaced Text Here</span>)

스타일 플러그인이 처음 활성화되면 기본 스타일을 사용할 수 없습니다. 팝업 목록이 비어 있습니다. 작성자에게 스타일을 제공하려면 다음을 수행하십시오.

스타일 드롭다운 선택기를 활성화합니다.
스타일 시트의 위치를 지정합니다.
스타일 드롭다운 목록에서 선택할 수 있는 개별 스타일을 지정합니다.

이후 구성의 경우 스타일을 더 추가하려면 지침만 따라 새 스타일 시트를 참조하고 추가 스타일을 지정합니다.

NOTE

에 대한 스타일을 정의할 수 있습니다 표 또는 표 셀. 이러한 구성에는 별도의 절차가 필요합니다.

스타일 드롭다운 선택기 목록 활성화 style-selector-list

이 작업은 스타일 플러그인을 활성화하여 수행됩니다.

구성 요소에서 노드로 이동합니다 <rtePlugins-node>/styles. 노드가 없으면 노드를 만듭니다. 자세한 내용은 플러그인 활성화.
만들기 features 속성 styles 노드:
- 이름 features
- 유형 String
- 값 * (별표)
모든 변경 내용을 저장합니다.

NOTE

스타일 플러그인이 활성화되면 스타일 드롭다운 목록이 편집 대화 상자에 표시됩니다. 하지만 스타일이 구성되지 않아 목록이 비어 있습니다.

스타일시트 위치를 지정합니다 location-stylesheet

그런 다음 참조할 스타일 시트의 위치를 지정합니다.

텍스트 구성 요소의 루트 노드로 이동합니다(예: ) /apps/<myProject>/components/text.

속성 추가 externalStyleSheets 의 상위 노드로 <rtePlugins-node>:

이름 externalStyleSheets
유형 String[] (다중 문자열) click 다중 CRXDE)
값 포함할 모든 스타일 시트의 경로 및 파일 이름입니다. 저장소 경로를 사용합니다.

note note
NOTE
나중에 언제든지 추가 스타일 시트에 대한 참조를 추가할 수 있습니다.

모든 변경 내용을 저장합니다.

대화 상자(클래식 UI)에서 RTE를 사용할 때 리치 텍스트 편집에 최적화된 스타일시트를 지정할 수 있습니다. 기술 제한 사항으로 인해 CSS 컨텍스트는 편집기에서 손실되므로 이 컨텍스트를 에뮬레이션하여 WYSIWYG 경험을 향상시킬 수 있습니다. 리치 텍스트 편집기에서는 ID가 인 컨테이너 DOM 요소를 사용합니다 CQrte 보고 편집할 수 있는 다양한 스타일을 제공하는 데 사용할 수 있습니다.

#CQ td {
// defines the style for viewing }

#CQrte td {
// defines the style for editing }

구성 요소 정의에서 노드로 이동합니다 <rtePlugins-node>/styles에 만든 대로 스타일 드롭다운 선택기 활성화.
노드 아래에 있습니다. styles, 새 노드 만들기( styles) 사용 가능한 목록을 유지하려면:
- 이름 styles
- 유형 cq:WidgetCollection
아래에 새 노드를 만듭니다. styles 개별 스타일을 나타내는 노드:
- 이름 를 채울 수 있지만 스타일에 적합해야 합니다
- 유형 nt:unstructured
속성 추가 cssName 이 노드에서 CSS 클래스를 참조할 수 있습니다.
- 이름 cssName
- 유형 String
- 값 CSS 클래스의 이름(이전 '.' 없음); 예 cssClass 대신 .cssClass)
속성 추가 text 동일한 노드에 추가할 수 있습니다. 선택 상자에 표시되는 텍스트를 정의합니다.
- 이름 text
- 유형 String
- 값 스타일에 대한 설명입니다. 스타일 드롭다운 선택 상자에 나타납니다.
변경 사항을 저장합니다.

필요한 각 스타일에 대해 위의 단계를 반복합니다.

단락 형식 구성 para-formats

RTE에서 작성된 모든 텍스트는 기본적으로 <p>. 를 활성화하여 paraformat 플러그인을 사용하면 드롭다운 선택 목록을 사용하여 단락에 지정할 수 있는 추가 블록 태그를 지정할 수 있습니다. 단락 형식은 올바른 블록 태그를 지정하여 단락 유형을 결정합니다. 작성자는 형식 선택기를 사용하여 선택하여 할당할 수 있습니다. 예제 블록 태그에는 표준 단락이 포함되어 있습니다 <p> 및 제목 <h1>, <h2>등

CAUTION

이 플러그인은 목록 또는 표와 같은 복잡한 구조의 컨텐츠에는 적합하지 않습니다.

NOTE

예를 들어 블록 태그의 경우 <hr> 태그는 단락에 할당할 수 없으며 paraformat 플러그인에 유효한 사용 사례가 아닙니다.

단락 형식 플러그인이 처음 활성화되면 기본 단락 형식 을 사용할 수 없습니다. 팝업 목록이 비어 있습니다. 작성자에게 단락 형식을 제공하려면 다음을 수행하십시오.

형식 드롭다운 선택기 목록을 활성화합니다.
드롭다운에서 단락 형식으로 선택할 수 있는 블록 태그를 지정합니다.

이후(재)구성의 경우, 형식을 더 추가하려면 지침의 관련 부분만 따르십시오.

형식 드롭다운 선택기를 활성화합니다 format-selector-list

먼저 을(를) 활성화합니다 paraformat 플러그인:

구성 요소에서 노드로 이동합니다 <rtePlugins-node>/paraformat. 노드가 없으면 노드를 만듭니다. 자세한 내용은 플러그인 활성화.
만들기 features 속성 paraformat 노드:
- 이름 features
- 유형 String
- 값 * (별표)

NOTE

플러그인이 추가로 구성되지 않으면 다음 기본 형식이 활성화됩니다.

단락 ( <p>)
제목 1 ( <h1>)
제목 2 ( <h2>)
제목 3 ( <h3>)

CAUTION

RTE의 단락 형식을 구성할 때는 단락 태그를 제거하지 마십시오 <p> 을 서식 옵션으로 사용합니다. 만약 <p> 태그가 제거되면 컨텐츠 작성자가 태그를 선택할 수 없습니다 단락 형식 추가 형식이 구성된 경우에도 선택 사항입니다.

단락 포맷은 다음 방법으로 선택할 수 있습니다.

구성 요소 정의에서 노드로 이동합니다 <rtePlugins-node>/paraformat에 만든 대로 형식 드롭다운 선택기 활성화.
아래에 paraformat 노드 형식 목록을 저장할 새 노드를 만듭니다.
- 이름 formats
- 유형 cq:WidgetCollection
아래에 새 노드를 만듭니다. formats 노드, 개별 형식에 대한 세부 정보가 있습니다.
- 이름 를 지정하면 이름을 지정할 수 있지만 형식에 적합해야 합니다(예: myparagraph, myheading1).
- 유형 nt:unstructured
이 노드에 속성을 추가하여 사용되는 블록 태그를 정의합니다.
- 이름 tag
- 유형 String
- 값 형식에 대한 블록 태그 예: p, h1, h2 등
  
  구분 꺾쇠 괄호는 입력할 필요가 없습니다.
동일한 노드에 다른 속성을 추가하려면 설명 텍스트가 드롭다운 목록에 나타나도록 합니다.
- 이름 description
- 유형 String
- 값 이 형식을 설명하는 텍스트입니다. 예를 들어, 단락, 머리글 1, 머리글 2 등이 있습니다. 이 텍스트는 형식 선택 목록에 표시됩니다.
변경 사항을 저장합니다.

필요한 각 형식에 대한 단계를 반복합니다.

CAUTION

사용자 지정 형식을 정의하는 경우 기본 형식(<p>, <h1>, <h2>, 및 <h3>)가 제거됩니다. 다시 만들기 <p> 형식을 기본 형식으로 지정합니다.

특수 문자 구성 special-char

표준 AEM 설치에서는 misctools 특수 문자(specialchars) 기본 선택 항목을 즉시 사용할 수 있습니다. 예를 들어, 저작권 및 상표 기호

RTE를 구성하여 사용자가 직접 선택한 문자를 사용할 수 있도록 할 수 있습니다. 또는 전체 시퀀스를 정의하여

CAUTION

고유한 특수 문자를 추가하면 기본 선택 내용이 무시됩니다. 필요한 경우(재)원하는 대로 선택 영역에 이러한 문자를 정의합니다.

단일 문자 정의 define-single-char

구성 요소에서 노드로 이동합니다 <rtePlugins-node>/misctools. 노드가 없으면 노드를 만듭니다. 자세한 내용은 플러그인 활성화.
만들기 features 속성 misctools 노드:
- 이름 features
- 유형 String[]
- 값 specialchars
  
  또는 String / * 이 플러그인에 대한 모든 기능을 적용하는 경우)
아래 misctools 특수 문자 구성을 보유할 노드를 만듭니다.
- 이름 specialCharsConfig
- 유형 nt:unstructured
아래 specialCharsConfig 문자 목록을 저장할 다른 노드를 만듭니다.
- 이름 chars
- 유형 nt:unstructured
아래 chars 개별 문자 정의를 유지하려면 새 노드를 추가하십시오.
- 이름 이름은 지정할 수 있지만 문자를 반영해야 합니다. 예를 들면 절반입니다.
- 유형 nt:unstructured
이 노드에 다음 속성을 추가합니다.
- 이름 entity
- 유형 String
- 값 필요한 문자의 HTML 표시 예 &189; 반쪽짜리.
변경 사항을 저장합니다.

속성이 저장되면 표현된 문자가 CRXDE에 표시됩니다. 아래의 절반 예를 참조하십시오. 위의 단계를 반복하여 작성자가 더 특수 문자를 사용할 수 있습니다.

CRXDE에서 RTE 도구 모음에서 사용할 수 있도록 단일 문자를 추가합니다

문자 범위 정의 define-range-char

1~3단계를 사용합니다. 단일 문자 정의.
아래 chars 문자 범위의 정의를 유지하려면 새 노드를 추가하십시오.
- 이름 이름을 지정할 수 있지만 문자 범위를 반영해야 합니다. 예를 들면 연필입니다.
- 유형 nt:unstructured
이 노드(특수 문자 범위에 따라 이름이 지정됨) 아래에 다음 두 속성을 추가합니다.
- 이름 rangeStart
  
  유형 Long
  값 a 유니코드 범위의 첫 번째 문자의 표시(십진수)
- 이름 rangeEnd
  
  유형 Long
  값 a 유니코드 범위의 마지막 문자의 표시(십진수)
변경 사항을 저장합니다.

예를 들어, 998 - 10000에서 범위를 정의하면 다음 문자가 제공됩니다.

CRXDE에서 RTE에서 사용할 수 있는 문자 범위를 정의합니다

RTE에서 사용할 수 있는 특수 문자는 팝업 창에서 작성자에게 표시됩니다

표 스타일 구성 table-styles

스타일은 일반적으로 텍스트에 적용되지만 별도의 스타일 세트를 테이블이나 몇 개의 표 셀에도 적용할 수 있습니다. 이러한 스타일은 셀 속성 또는 표 속성 대화 상자의 스타일 선택기 상자에서 작성자가 사용할 수 있습니다. 스타일은 표준 표 구성 요소가 아니라 텍스트 구성 요소(또는 파생) 내에서 표를 편집할 때 사용할 수 있습니다.

NOTE

클래식 UI의 표 및 셀에 대해서만 스타일을 정의할 수 있습니다.

NOTE

RTE 구성 요소에서 또는 에서 표를 복사하고 붙여넣는 것은 브라우저에 따라 다릅니다. 모든 브라우저에 대해 기본적으로 지원되지 않습니다. 테이블 구조 및 브라우저에 따라 다양한 결과를 얻을 수 있습니다. 예를 들어, 클래식 UI 및 Touch UI에서 Mozilla Firefox의 RTE 구성 요소에 표를 복사하여 붙여넣으면 표의 레이아웃이 유지되지 않습니다.

구성 요소 내에서 노드로 이동합니다 <rtePlugins-node>/table. 노드가 없으면 노드를 만듭니다. 자세한 내용은 플러그인 활성화.

만들기 features 속성 table 노드:

이름 features
유형 String
값 * (별표)

note note
NOTE
모든 테이블 기능을 활성화하지 않으려면 `features` 다음 속성:
유형 `String[]` 값 머. 다음 중 하나 또는 둘 다 필요에 따라 선택합니다. `table` 표 속성을 편집할 수 있도록 허용 스타일을 포함합니다. `cellprops` 스타일을 포함하여 셀 속성을 편집할 수 있도록 허용합니다.

CSS 스타일 시트의 위치를 정의하여 이를 참조합니다. 자세한 내용은 스타일시트의 위치 지정 다음과 같이 정의할 때와 동일합니다 텍스트에 대한 스타일. 다른 스타일을 정의한 경우 위치를 정의할 수 있습니다.
아래에 table 노드 는 다음 새 노드를 만듭니다(필요에 따라).
- 전체 테이블의 스타일을 정의하려면 표 속성):
  - 이름 table-styles
  - 유형 cq:WidgetCollection
- 개별 셀의 스타일을 정의하려면 셀 속성):
  - 이름 cellStyles
  - 유형 cq:WidgetCollection
새 노드 만들기(아래에 있음) table-styles 또는 cellStyles 노드)를 사용하여 개별 스타일을 나타냅니다.
- 이름 이름은 지정할 수 있지만 스타일은 반영되어야 합니다.
- 유형 nt:unstructured
이 노드에서 속성을 만듭니다.
- 참조할 CSS 스타일을 정의하려면
  - 이름 cssName
  - 유형 String
  - 값 CSS 클래스의 이름(이전 이름 없음) .예: cssClass 대신 .cssClass)
- 드롭다운 선택기에 표시할 설명 텍스트를 정의하려면
  - 이름 text
  - 유형 String
  - 값 선택 목록에 표시할 텍스트
모든 변경 내용을 저장합니다.

필요한 각 스타일에 대해 위의 단계를 반복합니다.

접근성을 위해 테이블에서 숨겨진 헤더 구성 hidden-header

열 헤더에서 헤더의 목적이 다른 열과 열의 시각적 관계에 의해 암묵된다고 가정할 때, 시각적 텍스트 없이 데이터 표를 만들 수 있습니다. 이 경우, 다양한 요구 사항이 있는 독자가 열의 목적을 이해하는 데 도움이 되도록 머리글 셀의 셀 내에 숨겨진 내부 텍스트를 제공하는 것이 필요합니다.

이러한 시나리오에서 액세스 가능성을 향상시키기 위해 RTE는 숨겨진 헤더 셀을 지원합니다. 또한 테이블의 숨겨진 헤더와 관련된 구성 설정을 제공합니다. 이러한 설정을 사용하면 편집 및 미리 보기 모드에서 숨겨진 헤더에 CSS 스타일을 적용할 수 있습니다. 작성자가 편집 모드에서 숨겨진 헤더를 식별하는 데 도움이 되도록 코드에 다음 매개 변수를 포함하십시오.

hidden-headerEditingCSS: RTE를 편집할 때 숨겨진 헤더 셀에 적용되는 CSS 클래스의 이름을 지정합니다.
hidden-headerEditingStyle: RTE를 편집할 때 숨겨진 헤더 셀에 적용되는 스타일 문자열을 지정합니다.

코드에서 CSS와 스타일 문자열을 모두 지정하는 경우 CSS 클래스가 스타일 문자열보다 우선하며 스타일 문자열의 구성 변경 사항을 덮어쓸 수 있습니다.

작성자가 미리 보기 모드에서 숨겨진 헤더에 CSS를 적용할 수 있도록 코드에 다음 매개 변수를 포함할 수 있습니다.

hidden-headerClassName: 미리 보기 모드에서 숨김 헤더 셀에 적용되는 CSS 클래스의 이름을 지정합니다.
hidden-headerStyle: 미리 보기 모드에서 숨김 헤더 셀에 적용되는 스타일 문자열을 지정합니다.

코드에서 CSS와 스타일 문자열을 모두 지정하는 경우 CSS 클래스가 스타일 문자열보다 우선하며 스타일 문자열의 구성 변경 사항을 덮어쓸 수 있습니다.

맞춤법 검사기의 사전 추가 add-dict

맞춤법 검사 플러그인이 활성화되면 RTE에서는 각 적절한 언어에 대해 사전을 사용합니다. 그런 다음 하위 트리의 언어 속성을 사용하거나 URL에서 언어를 추출하여 웹 사이트의 언어에 따라 선택됩니다. 예. a /en/ 분기는 영어로 확인되고 /de/ 독일어

NOTE

메시지 Spell checking failed 설치되지 않은 언어에 대해 검사를 시도하면 표시됩니다. 표준 사전은 다음 위치에 있습니다. /libs/cq/spellchecker/dictionaries와 함께 추가 정보 파일을 참조하십시오. 파일을 수정하지 마십시오.

표준 AEM 설치에는 미국 영어에 대한 사전이 포함되어 있습니다(en_us) 및 영국 영어(en_gb). 사전을 더 추가하려면 다음 단계를 따르십시오.

페이지로 이동합니다 https://extensions.openoffice.org/.
원하는 언어 사전을 찾으려면 다음 중 하나를 수행합니다.
- 원하는 언어 사전을 찾아보세요. 사전 페이지에서 원본 소스 또는 작성자 웹 페이지에 대한 링크를 찾습니다. 이러한 페이지에서 v2.x용 사전 파일을 찾습니다.
- 에서 v2.x 사전 파일을 검색합니다. https://wiki.openoffice.org/wiki/User:Khirano/Dictionaries.

맞춤법 정의가 있는 아카이브를 다운로드합니다. 파일 시스템에서 아카이브 컨텐츠를 추출합니다.

note caution
CAUTION
의 사전만 `MySpell` OpenOffice.org v2.0.1 이전 버전의 형식이 지원됩니다. 이제 사전이 파일을 보관하므로 다운로드한 후 아카이브를 확인하는 것이 좋습니다.

.aff 및 .dic 파일을 찾습니다. 파일 이름을 소문자로 유지합니다. 예, de_de.aff 및 de_de.dic.
저장소에서 .aff 및 .dic 파일을 로드합니다. /apps/cq/spellchecker/dictionaries.

NOTE

RTE 맞춤법 검사기는 온디맨드로 사용할 수 있습니다. 텍스트 입력을 시작할 때 자동으로 실행되지 않습니다. 맞춤법 검사를 실행하려면 맞춤법 검사기 를 클릭합니다. RTE는 단어의 철자를 확인하고 철자가 잘못된 단어를 강조 표시합니다.
맞춤법 검사기에서 제안하는 변경 내용을 통합할 경우 텍스트 변경 상태와 철자가 잘못된 단어가 더 이상 강조 표시되지 않습니다. 맞춤법 검사기를 실행하려면 맞춤법 검사 단추를 다시 탭/클릭합니다.

실행 취소 및 다시 실행 작업에 대한 기록 크기 구성 undo-history

RTE를 통해 작성자는 몇 개의 마지막 편집 내용을 실행 취소하거나 재실행할 수 있습니다. 기본적으로 50개의 편집 내용이 기록에 저장됩니다. 필요에 따라 이 값을 구성할 수 있습니다.

구성 요소 내에서 노드로 이동합니다 <rtePlugins-node>/undo. 이러한 노드가 없는 경우 해당 노드를 만듭니다. 자세한 내용은 플러그인 활성화.
설정 undo node create property:
- 이름 maxUndoSteps
- 유형 Long
- 값 기록에 저장하려는 실행 취소 단계 수입니다.
  - 기본값은 50입니다.
  - 실행 취소/다시 실행을 완전히 비활성화하려면 0을 사용합니다.
변경 사항을 저장합니다.

탭 크기 구성 tab-size

텍스트 내에서 탭 문자를 누르면 사전 정의된 공백 수가 삽입됩니다. 기본적으로 3개의 줄바꿈 없는 공백과 1개의 공백이 있습니다. 탭 크기를 정의하려면

구성 요소에서 노드로 이동합니다 <rtePlugins-node>/keys. 노드가 없으면 노드를 만듭니다. 자세한 내용은 플러그인 활성화.
설정 keys node create property:
- 이름 tab-size
- 유형 String
- 값 테이블뮬레이터에 사용할 공백 문자 수
변경 사항을 저장합니다.

들여쓰기 여백 설정 indent-margin

들여쓰기를 활성화하면(기본값) 들여쓰기 크기를 정의할 수 있습니다.

NOTE

이 들여쓰기 크기는 텍스트 단락(블록)에만 적용됩니다. 실제 목록의 들여쓰기에는 영향을 주지 않습니다.

구성 요소 내에서 노드로 이동합니다 <rtePlugins-node>/lists. 이러한 노드가 없는 경우 해당 노드를 만듭니다. 자세한 내용은 플러그인 활성화.
설정 lists 노드 만들기 identSize 매개 변수:
- 이름: identSize
- 유형: Long
- 값: 들여쓰기 여백에 필요한 픽셀 수

편집 가능한 공간의 높이 구성 editable-space

구성 요소 대화 상자에 표시된 편집 가능한 공간의 높이를 정의할 수 있습니다.

설정 ../items/text 노드에 대한 구성 요소의 대화 상자 정의에서 새 속성을 만듭니다.

이름 height
유형 Long
값 편집 캔버스의 높이(픽셀 단위)

note note
NOTE
대화 상자 창의 높이는 변경되지 않습니다.

변경 사항을 저장합니다.

NOTE

이 기능은 대화 상자에서 RTE를 사용할 때만 적용됩니다(클래식 UI에서 즉석 편집은 아님).

링크에 대한 스타일 및 프로토콜 구성 link-styles

AEM에서 링크를 추가할 때 다음을 정의할 수 있습니다.

사용할 CSS 스타일
프로토콜은 자동으로 수락됩니다

다른 프로그램에서 AEM에 링크를 추가하는 방법을 구성하려면 HTML 규칙을 정의합니다.

CRXDE Lite을 사용하여 프로젝트의 텍스트 구성 요소를 찾습니다.

와 동일한 수준에서 새 노드 만들기 <rtePlugins-node>즉, 의 상위 노드 아래에 노드를 만듭니다 <rtePlugins-node>:

이름 htmlRules
유형 nt:unstructured

note note
NOTE
다음 `../items/text` 노드에는 다음 속성이 있습니다.
이름 `xtype` 유형 `String` 값 `richtext`

의 위치 ../items/text 노드는 대화 상자의 구조에 따라 달라질 수 있습니다. 두 가지 예는 다음과 같습니다.

/apps/myProject>/components/text/dialog/items/text
/apps/<myProject>/components/text/dialog/items/panel/items/text

아래 htmlRules새 노드를 만듭니다.
- 이름 links
- 유형 nt:unstructured
아래에 links 노드는 필요에 따라 속성을 정의합니다.
- 내부 링크에 대한 CSS 스타일:
  - 이름 cssInternal
  - 유형 String
  - 값 CSS 클래스의 이름(이전 ' 없이)입니다.; 예 cssClass 대신 .cssClass)
- 외부 링크에 대한 CSS 스타일
  - 이름 cssExternal
  - 유형 String
  - 값 CSS 클래스의 이름(이전 ' 없이)입니다.; 예 cssClass 대신 .cssClass)
- 올바른 배열 프로토콜. 지원되는 프로토콜은 다음과 같습니다 http://, https://, file://, 및 mailto:.
  - 이름 protocols
  - 유형 String[]
  - 값(s) 하나 이상의 프로토콜
- defaultProtocol (유형 속성) 문자열): 사용자가 명시적으로 지정하지 않은 경우 사용할 프로토콜입니다.
  - 이름 defaultProtocol
  - 유형 String
  - 값(s) 하나 이상의 기본 프로토콜
- 링크의 대상 속성을 처리하는 방법에 대한 정의입니다. 새 노드를 만듭니다.
  - 이름 targetConfig
  - 유형 nt:unstructured
  노드에서 targetConfig: 필수 속성을 정의합니다.
  - 대상 모드를 지정합니다.
    - 이름 mode
    - 유형 String)
    - 값(s) :
      - auto: 자동 타겟 선택
        
        ( targetExternal 외부 링크 또는 targetInternal 내부 링크).
      - manual: 이 컨텍스트에서는 적용할 수 없습니다.
      - blank: 이 컨텍스트에서는 적용할 수 없습니다.
  - 내부 링크의 대상:
    - 이름 targetInternal
    - 유형 String
    - 값 내부 링크의 대상(모드가 auto)
  - 외부 링크의 대상:
    - 이름 targetExternal
    - 유형 String
    - 값 외부 링크의 대상(모드가 auto).
모든 변경 내용을 저장합니다.

recommendation-more-help

5ce3024a-cbea-458b-8b2f-f9b8dda516e8

리치 텍스트 편집기 플러그인 구성 configure-the-rich-text-editor-plug-ins

플러그인 활성화 및 기능 속성 구성 activateplugin

findreplace 플러그인 이해 understand-findreplace-plugin

붙여넣기 모드 구성 paste-modes

RTE 도구 모음에서 사용할 수 있는 붙여넣기 옵션 구성 configure-paste-options-toolbar

붙여넣기(Ctrl+V) 아이콘과 바로 가기 동작을 구성합니다 configure-paste-icon-shortcut

컨텐츠를 붙여넣을 때 허용되는 형식을 구성합니다 paste-formats

텍스트 스타일 구성 text-styles

스타일 드롭다운 선택기 목록 활성화 style-selector-list

스타일시트 위치를 지정합니다 location-stylesheet

팝업 목록에서 사용 가능한 스타일을 지정합니다 styles-popup-list

단락 형식 구성 para-formats

형식 드롭다운 선택기를 활성화합니다 format-selector-list

사용 가능한 단락 형식 지정 para-formats-popup

특수 문자 구성 special-char

단일 문자 정의 define-single-char

문자 범위 정의 define-range-char

표 스타일 구성 table-styles

접근성을 위해 테이블에서 숨겨진 헤더 구성 hidden-header

맞춤법 검사기의 사전 추가 add-dict

실행 취소 및 다시 실행 작업에 대한 기록 크기 구성 undo-history

탭 크기 구성 tab-size

들여쓰기 여백 설정 indent-margin

편집 가능한 공간의 높이 구성 editable-space

링크에 대한 스타일 및 프로토콜 구성 link-styles