現在表示中:

Adobe Experience Manager(AEM)Assets の検索機能を拡張できます。AEM Assets はデフォルトで、文字列によってアセットを検索します。

検索は QueryBuilder インターフェイスを介して実行されるので、複数の述語を使用することで検索をカスタマイズできます。/apps/dam/content/search/searchpanel/facets ディレクトリにあるデフォルトの述語セットをオーバーレイできます。

また、AEM Assets 管理パネルにタブを追加することもできます。

オーバーレイ

事前設定済みの述語をオーバーレイするには、facets ノードを /libs/dam/content/search/searchpanel から /apps/dam/content/search/searchpanel/ にコピーするか、searchpanel 設定に別の facetURL プロパティを指定します(デフォルトでは /libs/dam/content/search/searchpanel/facets.overlay.infinity.json になります)。 

注意:

デフォルトでは、/apps の下のディレクトリ構造は存在せず、新たに作成する必要があります。ノードのタイプが、/libs の下のノードのタイプと一致するようにしてください。

タブの追加

AEM Assets 管理パネルで追加の「検索」タブを設定することで、タブを追加できます。追加のタブは以下の手順で作成します。

  1. フォルダー構造 /apps/wcm/core/content/damadmin/tabs を作成します。まだ存在していない場合は、tabs ノードを /libs/wcm/core/content/damadmin からコピーして貼り付けます。

  2. 必要に応じて、2 つ目のタブを作成して設定します。 

    注意:

    2 つ目の siteadminsearchpanel を作成する場合は、フォームの競合を防ぐために id プロパティを設定してください。

カスタムの述語の作成

AEM Assets には、アセット共有ページのカスタマイズに使用できる、事前定義済みの述語のセットが付属しています。この方法でアセット共有をカスタマイズする方法については、アセット共有ページの作成と設定で説明しています。

AEM 開発者は、既存の述語を使用するだけでなく、Query Builder API を使用して独自の述語を作成することもできます。

カスタムの述語を作成するには、ウィジェットフレームワークに関する基本的な知識が必要です。

ベストプラクティスとしては、既存の述語をコピー後に変更することです。サンプルの述語は、/libs/cq/search/components/predicates にあります。

例:シンプルなプロパティ述語の作成

プロパティ述語の作成手順

  1. プロジェクトディレクトリにコンポーネントフォルダーを作成します(/apps/geometrixx/components/titlepredicate など)。

  2. 次の content.xml を追加します。

    <?xml version="1.0" encoding="UTF-8"?>
    <jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
        jcr:primaryType="cq:Component"
        jcr:title="Title Predicate"
        sling:resourceSuperType="foundation/components/parbase"
        allowedParents="[*/parsys]"
        componentGroup="Search"/>
    
  3. 次の titlepredicate.jsp を追加します。

    <%--
    
      Sample title predicate component
    
    --%><%@ page import="java.util.Calendar" %><%
    %><%@include file="/libs/foundation/global.jsp"%><%
    
        // A unique id is necessary in case this predicate is inserted multiple times on the same page
        String elemId = "cq-predicate-" +  Long.toString(Calendar.getInstance().getTimeInMillis());
    
    %><div class="predicatebox">
    
        <div class="title">Title</div>
    
        <%-- The wrapper for the form elements. All items will be append to this wrapper. --%>
        <div id="<%= elemId %>" class="content"></div>
    
    </div><script type="text/javascript">
    
        CQ.Ext.onLoad(function() {
    
            var predicateName = "property";
            var propertyName = "jcr:content/metadata/dc:title";
            var elemId = "<%= elemId %>";
    
            // Get the page wide available QueryBuilder.
            var qb = CQ.search.Util.getQueryBuilder();
    
            // createId adds a counter to the predicate name - useful in case this predicate
            // is inserted multiple times on the same page.
            var id = qb.createId(predicateName);
    
            // Hidden field that defines the property to search for; in our case this
            // is the "dc:title" metadata. The name "property" (or "1_property", "2_property" etc.)
            // indicates the server to use the property predicate
            // (com.day.cq.search.eval.JcrPropertyPredicateEvaluator).
            qb.addField({
                "xtype": "hidden",
                "renderTo": elemId,
                "name": id,
                "value": propertyName
            });
    
            // The visible text field. The name has to be like the one of the hidden field above
            // plus the ".value" suffix.
            qb.addField({
                "xtype": "textfield",
                "renderTo": elemId,
                "name": id + ".value"
            });
    
            // Depending on the predicate additional parameters allow to configure the
            // predicate. Here we add an operation parameter to create a "like" query.
            // Again note the name set to the id and a suffix.
            qb.addField({
                "xtype": "hidden",
                "renderTo": elemId,
                "name": id + ".operation",
                "value": "like"
            });
    
        });
    
    </script>
    
  4. コンポーネントを使用できるようにするには、それを編集可能にする必要があります。コンポーネントを編集可能にするには、CRXDE で、cq:EditConfig プライマリ型の cq:editConfig ノードを追加します。段落を削除できるように、DELETEという 1 つの値を持つ複数値プロパティ cq:actions を追加します。

  5. ブラウザーを開き、サンプルページ(press.html など)でデザインモードに切り替えて、述語段落システムの新しいコンポーネント(「左揃え」など)を有効にします。

  6. 編集モードで、新しいコンポーネントがサイドキック(検索グループ)で使用できるようになります。「Predicates」列にコンポーネントを挿入し、「Diamond」などの検索語句を入力して、虫眼鏡アイコンをクリックして検索を開始します。

    注意:

    検索時は、大文字と小文字の違いを含めて、語句を正確に入力してください。

例:シンプルなグループ述語の作成

グループ述語の作成手順

  1. プロジェクトディレクトリにコンポーネントフォルダーを作成します(/apps/geometrixx/components/picspredicate など)。

  2. 次の content.xml を追加します。

    <?xml version="1.0" encoding="UTF-8"?>
    <jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
        jcr:primaryType="cq:Component"
        jcr:title="Image Formats"
        sling:resourceSuperType="foundation/components/parbase"
        allowedParents="[*/parsys]"
        componentGroup="Search"/>
    
  3. 次の titlepredicate.jsp を追加します。

    <%--
    
      Sample group predicate component
    
    --%><%@ page import="java.util.Calendar" %><%
    %><%@include file="/libs/foundation/global.jsp"%><%
    
        // A unique id is necessary in case this predicate is inserted multiple times on the same page.
        String elemId = "cq-predicate-" +  Long.toString(Calendar.getInstance().getTimeInMillis());
    
    %><div class="predicatebox">
    
        <div class="title">Image Formats</div>
    
        <%-- The wrapper for the form elements. All items will be append to this wrapper. --%>
        <div id="<%= elemId %>" class="content"></div>
    
    </div><script type="text/javascript">
    
        CQ.Ext.onLoad(function() {
    
            var predicateName = "property";
            var propertyName = "jcr:content/metadata/dc:format";
            var elemId = "<%= elemId %>";
    
            // Get the page wide available QueryBuilder.
            var qb = CQ.search.Util.getQueryBuilder();
    
            // Create a unique group ID; will return e.g. "1_group".
            var groupId = qb.createGroupId();
    
            // Hidden field that defines the property to search for  - in our case "dc:format" -
            // and declares the group of predicates. "property" in the name ("1_group.property")
            // indicates to the server to use the "property predicate"
            // (com.day.cq.search.eval.JcrPropertyPredicateEvaluator).
            qb.addField({
                "xtype": "hidden",
                "renderTo": "<%= elemId %>",
                "name": groupId + "." + predicateName, // 1_group.property
                "value": propertyName
            });
    
            // Declare to combine the multiple values using OR.
            qb.add(new CQ.Ext.form.Hidden({
                "name": groupId + ".p.or",  // 1_group.p.or
                "value": "true"
            }));
    
    
            // The options
            var options = [
                { "label":"JPEG", "value":"image/jpeg"},
                { "label":"PNG",  "value":"image/png" },
                { "label":"GIF",  "value":"image/gif" }
            ];
    
            // Build a checkbox for each option.
            for (var i = 0; i < options.length; i++) {
                qb.addField({
                    "xtype": "checkbox",
                    "renderTo": "<%= elemId %>",
                    // 1_group.property.0_value, 1_group.property.1_value etc.
                    "name": groupId + "." +  predicateName + "." + i + "_value",
                    "inputValue": options[i].value,
                    "boxLabel": options[i].label,
                    "listeners": {
                        "check": function() {
                            // Submit the search form when checking/unchecking a checkbox.
                            qb.submit();
                        }
                    }
                });
            }
    
        });
    
    
  4. コンポーネントを使用できるようにするには、それを編集可能にする必要があります。コンポーネントを編集可能にするには、CRXDE で、cq:EditConfig プライマリ型の cq:editConfig ノードを追加します。段落を削除できるように、DELETEという 1 つの値を持つ複数値プロパティ cq:actions を追加します。

  5. ブラウザーを開き、サンプルページ(press.html など)でデザインモードに切り替えて、述語段落システムの新しいコンポーネント(「左揃え」など)を有効にします。

  6. 編集モードで、新しいコンポーネントがサイドキック(検索グループ)で使用できるようになります。「Predicates」列にコンポーネントを挿入します。

インストール済みの述語ウィジェット

事前設定済みの ExtJS ウィジェットでは次の述語が使用可能です。

FulltextPredicate

プロパティ
タイプ 説明
predicateName 文字列 述語の名前。デフォルトは「fulltext」です。
searchCallback 関数 イベント「keyup」時に検索を呼び出すコールバック。デフォルトは「CQ.wcm.SiteAdmin.doSearch」です。

PropertyPredicate

プロパティ
タイプ 説明
predicateName 文字列 述語の名前。デフォルトは「property」です。
propertyName 文字列 JCR プロパティの名前。デフォルトは「jcr:title」です。
defaultValue
文字列
あらかじめ入力されたデフォルト値です。

PathPredicate

プロパティ
タイプ 説明
predicateName 文字列 述語の名前。デフォルトは「path」です。
rootPath 文字列 述語のルートパス。デフォルトは「/content/dam」です。
pathFieldPredicateName 文字列 デフォルトは「folder」です。
showFlatOption ブール値 「サブフォルダーを検索」チェックボックスを表示するかどうかを指定するフラグ。デフォルトは true です。

DatePredicate

プロパティ
タイプ 説明
predicateName 文字列 述語の名前。デフォルトは「daterange」です。
propertyname 文字列 JCR プロパティの名前。デフォルトは「jcr:content/jcr:lastModified」です。
defaultValue 文字列 あらかじめ入力されたデフォルト値です。

OptionsPredicate

プロパティ
タイプ 説明
title 文字列 上部のタイトルを追加で指定します。
predicateName 文字列 述語の名前。デフォルトは「daterange」です。
propertyname 文字列 JCR プロパティの名前。デフォルトは「jcr:content/metadata/cq:tags」です。
collapse 文字列 折りたたみのレベル。デフォルトは「level1」です。
triggerSearch ブール値 チェック時に検索を呼び出すかどうかを指定するフラグ。デフォルトは false です。
searchCallback 関数 検索を呼び出すコールバック。デフォルトは「CQ.wcm.SiteAdmin.doSearch」です。
searchTimeoutTime 数値 searchCallback が呼び出されるまでのタイムアウト時間。デフォルトは 800 ミリ秒です。

検索結果のカスタマイズ

アセット共有ページでの検索結果の表示方法は、選択したレンズによって制御されます。AEM Assets には、アセット共有ページのカスタマイズに使用できる、事前定義済みのレンズのセットが付属しています。この方法でアセット共有をカスタマイズする方法については、アセット共有ページの作成と設定で説明しています。

AEM 開発者は、既存のレンズを使用するだけでなく、独自のレンズを作成することもできます。

本作品は Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License によってライセンス許可を受けています。  Twitter™ および Facebook の投稿には、Creative Commons の規約内容は適用されません。

法律上の注意   |   プライバシーポリシー