여러 즉석 편집기 구성

여러 즉석 편집기가 있도록 Adobe Experience Manager에서 리치 텍스트 편집기를 구성할 수 있습니다. 구성된 경우 적절한 컨텐츠를 선택하고 적절한 편집기를 열 수 있습니다.

특정 즉석 편집기

여러 편집기 구성

여러 즉석 편집기를 사용하기 위해 cq:ChildEditorConfig 노드 유형의 정의를 사용하여 cq:InplaceEditingConfig 노드 유형의 구조가 향상되었습니다.

예:

   /**
       * Configures in-place editing of a component.
       *
       * @prop active true to activate in-place editing for the component.
       * @prop editorType ID of in-place editor to use.
       * @prop cq:childEditors collection of {@link cq:ChildEditorConfig} nodes.
       * @prop configPath path to editor's config (optional).
       * @node config editor's config (used if no configPath is specified; optional).
     */
    [cq:InplaceEditingConfig] > nt:unstructured
      - active (boolean)
      - editorType (string)
      + cq:childEditors (nt:base) = nt:unstructured
      - configPath (string)
      + config (nt:unstructured) = nt:unstructured

    /**
      * Configures one child editor for a sub-component. The name of the this node is
      * used as DD ID.
      *
      * @prop type type of the inline editor. For example, ["image"].
      * @prop title Title of the inline editor.
      * @prop icon Icon to represent the inline editor.
    */
    [cq:ChildEditorConfig] > nt:unstructured
      orderable
      - type (string)
      - title (string)

여러 편집기를 구성하려면 다음 단계를 수행합니다.

  1. 노드 cq:inplaceEditing(유형 cq:InplaceEditingConfig)에서 다음 속성을 정의합니다.

    • 이름:editorType
    • 유형: String
    • 값: hybrid
  2. 이 노드 아래에서 노드를 만듭니다.

    • 이름: cq:ChildEditors
    • 유형: nt:unstructured
  3. cq:childEditors 노드 아래에서 각 즉석 편집기에 대한 노드를 만듭니다.

    • 이름:각 노드의 이름은 드롭 대상의 경우와 마찬가지로 이 노드가 나타내는 속성의 이름입니다. 예: imagetext.
    • 유형: cq:ChildEditorConfig
    노트

    정의된 드롭 대상과 하위 편집기 간에 상관 관계가 있습니다. cq:ChildEditorConfig 노드의 이름은 드롭 대상 ID로 간주되어 선택한 자식 편집기에 매개 변수로 사용됩니다. 편집 가능한 하위 영역에 드롭 대상이 없는 경우(예: 텍스트 구성 요소에서) 하위 편집기의 이름은 해당 편집 가능 영역을 식별하기 위한 ID로 계속 간주됩니다.

  4. 이러한 각 노드(cq:ChildEditorConfig)에서 속성을 정의합니다.

    • 이름: type.

    • 값:등록된 즉석 편집기의 이름;예: imagetext.

    • 이름: title.

    • 값:사용 가능한 편집기의 구성 요소 선택 목록에 표시되는 제목입니다. 예: ImageText.

리치 텍스트 편집기에 대한 추가 구성

각 개별 RTE 인스턴스를 개별적으로 구성할 수 있으므로 여러 리치 텍스트 편집기에 대한 구성은 약간 다릅니다. 자세한 내용은 리치 텍스트 편집기 구성을 참조하십시오. 여러 RTE를 만들려면 각 즉석 RTE에 대한 구성을 만듭니다. 각 개별 RTE의 구성이 다를 수 있으므로 Adobe은 cq:InplaceEditingConfig 아래에 새 구성 노드를 만드는 것이 좋습니다. 새 노드 아래에서 각 개별 RTE 구성을 만듭니다.

    texttext
        cq:dialog
        cq:editConfig
            cq:inplaceEditing
                cq:childEditors
                    someconfig
                        text1
                            rtePlugins
                        text2
                            rtePlugins
노트

그러나 RTE의 경우 구성 요소에 텍스트 편집기(편집 가능한 하위 영역)의 인스턴스가 하나만 있을 경우 configPath 속성이 지원됩니다. 이러한 configPath 사용은 구성 요소의 이전 사용자 인터페이스 대화 상자와의 호환성을 지원하기 위해 제공됩니다.

주의

RTE 구성 노드의 이름을 config으로 지정하지 마십시오. 그렇지 않은 경우 RTE 구성은 관리자만 사용할 수 있고 content-author 그룹의 사용자는 사용할 수 없습니다.

코드 샘플

GitHub](https://github.com/Adobe-Marketing-Cloud/aem-authoring-hybrideditors)의 [aem-authoring-hybrideditors 프로젝트에서 이 페이지의 코드를 찾을 수 있습니다. 전체 프로젝트를 ZIP 아카이브로 다운로드할 수 있습니다.

즉석 편집기 추가

즉석 편집기 추가에 대한 일반적인 내용은 페이지 작성 사용자 지정 문서를 참조하십시오.

이 페이지에서는

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now