リッチテキストエディターの基本事項

概要

リッチテキストエディター(RTE)では、マークアップを使用してテキストを入力できます。

コミュニティコンポーネントの場合、オーサー環境のリッチテキストエディターに似ていますが、パブリッシュ環境で入力されたテキストに影響します。

chlimage_1-410

リッチテキストエディターの有効化

ユーザー生成コンテンツ(UGC)を許可するコミュニティコンポーネントを有効にすることによって、RTE を許可することができます。コンポーネントがページに追加されたか、関数に含まれたかによって、RTEはデフォルトで有効になる場合と無効になる場合があります。

有効になっていない場合は、作成者編集モードに入り、編集するコンポーネントを選択して、Rich Text Editorチェックボックスを選択します。

RTE は、次のコミュニティコンポーネントに使用できます。

カスタマイズ

リッチテキストエディターのカスタマイズは、CKEditor に基づいて実装した場合に可能になります。

コミュニティコンポーネントの現在の設定は、次のリポジトリにある cq.social. scf clientlib に含まれています。

/libs/clientlibs/social/commons/scf/ckrte.js

今後のアップグレードにより編集内容が上書きされる可能性があるので、cq.social.scf clientlib を変更しないことをお勧めします。

セキュリティ上の懸念事項により、デフォルトでメンバーに表示されるリッチテキストアイコンのセットにハイパーリンクオプションは含まれません。UGCでhrefが許可されている場合、悪戯の能力は大きくなります。

ツールバーにハイパーリンクオプションを追加するには:

  • 追加linksという名前のツールバー
    • { name: 'links', items: [ 'Link','Unlink','Anchor' ] }
  • すべて保存」を選択します。

/libs/clientlibs/social/commons/scf/ckrte.js

CKRte.prototype.config = {
    toolbar: [
        { name: "basicstyles",
           items: ["Bold", "Italic", "Underline", "NumberedList", "BulletedList", "Outdent", "Indent", "JustifyLeft", "JustifyCenter", "JustifyRight", "JustifyBlock", "TextColor"]
        },
        { name: 'links', 
           items: [ 'Link','Unlink','Anchor' ] 
        }
    ],
    autoParagraph: false,
    autoUpdateElement: false,
    removePlugins: "elementspath",
    resize_enabled: false
};

このページ

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