AlloyEditorの新しいボタンの作成

AlloyEditorの新しいボタンの作成

ご覧のページは、お客様の利便性のために一部機械翻訳されています。また、ドキュメントは頻繁に更新が加えられており、翻訳は未完成の部分が含まれることをご了承ください。最新情報は都度公開されておりますため、必ず英語版をご参照ください。翻訳に問題がある場合は、こちらまでご連絡ください。

AlloyEditorは React.js 上に構築され、 jsx を使用してエディターの各ボタンをレンダリングします。 AlloyEditorに新しいボタンを追加するには、3つのキーピースを含むOSGiバンドルを作成する必要があります。

  • ボタンの構成を含むJSXファイル
  • 利用可能なボタンのリストにボタンを提供するJavaクラス
  • AlloyEditorのツールバーにボタンを追加するJavaクラス

以下は、新しいボタンを追加するモジュールのフォルダー構造です。

  • frontend-editor-my-button-web
    • src

      • main
        • java
          • com/liferay/frontend/editor/my/button/web/
            • editor
              • configuration
                • AlloyEditorMyButtonConfigContributor.java
              • servlet
                • taglib
                  • AlloyEditorMyButtonDynamicInclude.java
        • resources
          • META-INF
            • resources
              • js
                • my_button.jsx
    • .babelrc

    • bnd.bnd

    • build.gradle

    • package.json

このセクションのチュートリアルでは、次のトピックについて説明します。

  • ボタンのOSGiバンドルを作成する方法
  • ボタンのJSXファイルを作成する方法
  • 利用可能なボタンのリストにボタンを提供する方法

EditorEditorのツールバーにボタンを追加するチュートリアル、エディターのツールバーにボタンを追加する方法を学ぶことができます。

my-log-text-button bundle は、このチュートリアル全体を通して例として使用されます。 次のことができます ダウンロードバンドルのzipファイル 参照のために、または必要に応じて、プロジェクトの開始点として使用します。

« スタイルツールバーへのボタンの追加AlloyEditorボタンのOSGiバンドルの作成 »
この記事は役に立ちましたか?
0人中0人がこの記事が役に立ったと言っています