フィルター filters

フィルターを定義して、使用可能なコンポーネント、RTE オプション、アセット選択など、エディターで使用できるオプションを制限する方法を説明します。

フィルターの設定 configuring-filters

ユニバーサルエディターを使用する場合、フィルターを定義することで、特定の機能に許可されるオプションを制限できます。 フィルターとは、特定のコンテキストで使用できる項目またはアクションのリストです。 例えば、コンテナに挿入できるコンポーネントをフィルタリングしたり、RTE で使用可能なオプションを ​ フィルタリングしたり ​ アセットセレクターで ​ 使用可能なアセットを ​ フィルタリングしたりできます。

フィルターはすべて同様に定義する必要があります。

コンテナコンポーネントごとにコンポーネントをフィルタリングする例を見てみましょう。

参照フィルターの定義 add-tag

まず、フィルター定義を指す追加のスクリプトタグを導入します。

この例では、許可されたコンポーネントをコンテナごとにフィルタリングするために、タグは次のようになります。

<script type="application/vnd.adobe.aue.filter+json" src="/static/filter-definition.json"></script>

フィルターの定義 define-filter

フィルター定義には、フィルターおよびフィルター条件に固有の ID を持つ JSON が含まれています。

この例では、許可されたコンポーネントをコンテナごとにフィルタリングすると、次のように表示され、コンテナはテキストと画像の追加のみを許可するように制限されます。

[
  {
    "id": "container-filter",
    "components": ["text", "image"]
   }
]

フィルター定義の components 属性を null に設定することによって、フィルターがない場合と同様に、すべてのコンポーネントを許可します。

[
  {
    "id": "another-container-filter",
     "components": null
   }
]

フィルターの参照 reference-filter

フィルターを使用するには、フィルター定義を参照する必要があります。 手順は次のとおりです。

  • プロパティ data-aue-filter を追加してコンテナコンポーネントからフィルターを参照し、フィルターの ID を渡します。

    code language-html
    data-aue-filter="container-filter"
    
  • ​ コンポーネント定義 ​ からフィルターを参照し、フィルターの ID を渡します。

    code language-json
    {
       "title":"My Container",
       "id":"my-container",
       "model": "my-model",
       "filter": "container-filter",
       ...
    }
    

その他のリソース additional-resources

ユニバーサルエディターで使用できるその他のカスタマイズおよび拡張オプションについては、次のドキュメントを参照してください。

recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab