デフォルトのクラウドサービスを、カスタムクラウドサービスタイプで拡張することができます。これにより、カスタムマークアップを構造的な方法でページに挿入できます。この手法は、Google Analytics や Chartbeat など、主としてサードパーティの分析プロバイダーに使用されます。クラウドサービスは、親ページから子ページに継承されますが、任意のレベルで継承を中断できます。
ここで紹介する手順は、Google Analytics を使用して新しいクラウドサービスを作成する場合の例です。この内容がそのまま実際のユースケースに当てはまるとは限りません。
CRXDE Liteで、/apps
の下に新しいノードを作成します。
acs
nt:folder
/apps/acs
の下に新しいノードを作成します。
analytics
sling:Folder
/apps/acs/analytics
の下に2つの新しいノードを作成:
sling:Folder
および
sling:Folder
/apps/acs/analytics/components
を右クリックします。 「作成…」を選択し、「コンポーネントを作成…」をクリックします。表示されるダイアログで、以下の項目を指定します。
googleanalyticspage
Google Analytics Page
cq/cloudserviceconfigs/components/configpage
.hidden
「次へ」を2回クリックし、次を指定します。
acs/analytics/templates/googleanalytics
「次へ」を2回クリックし、「OK」をクリックします。
<a0/追加>に対するプロパティ:googleanalyticspage
cq:defaultView
html
/apps/acs/analytics/components/googleanalyticspage
の下にcontent.jsp
という名前の新しいファイルを作成し、次の内容を入力します。
<%@page contentType="text/html"
pageEncoding="utf-8"%><%
%><%@include file="/libs/foundation/global.jsp"%><div>
<div>
<h3>Google Analytics Settings</h3>
<ul>
<li><div class="li-bullet"><strong>accountID: </strong><br><%= xssAPI.encodeForHTML(properties.get("accountID", "")) %></div></li>
</ul>
</div>
/apps/acs/analytics/components/googleanalyticspage/
の下に新しいノードを作成します。
名前:dialog
型:cq:Dialog
プロパティ:
title
String
Google Analytics Config
xtype
String
dialog
/apps/acs/analytics/components/googleanalyticspage/dialog
の下に新しいノードを作成します。
名前:items
型:cq:Widget
プロパティ:
xtype
String
tabpanel
/apps/acs/analytics/components/googleanalyticspage/dialog/items
の下に新しいノードを作成します。
items
cq:WidgetCollection
/apps/acs/analytics/components/googleanalyticspage/dialog/items/items
の下に新しいノードを作成します。
名前:tab1
型:cq:Panel
プロパティ:
title
String
Config
/apps/acs/analytics/components/googleanalyticspage/dialog/items/items/tab1
の下に新しいノードを作成します。
名前:items
型:nt:unstructured
プロパティ:
名前:fieldLabel
種類:string
値:アカウント ID
名前:fieldDescription
型:String
値: The account ID assigned by Google. Usually in the form UA-NNNNNN-N
名前:name
型:String
値: ./accountID
名前:validateOnBlur
型:String
値: true
名前:xtype
型:String
値: textfield
/libs/cq/cloudserviceconfigs/components/configpage/body.jsp
を/apps/acs/analytics/components/googleanalyticspage/body.jsp
にコピーし、libs
をapps
に変更して、行34に対するスクリプト参照を完全修飾パスにします。
/apps/acs/analytics/templates/
の下に新しいテンプレートを作成:
acs/analytics/components/googleanalyticspage
のgoogleanalytics
Google Analytics Configuration
/etc/cloudservices/googleanalytics(/.*)?
の/apps/acs/analytics/templates/googleanalytics
のcq/cloudserviceconfigs/templates/configpage
(テンプレートノードで、jcr:contentノードではなく)/etc/designs/cloudservices/googleanalytics
(jcr:content)新しいコンポーネントの作成:/apps/acs/analytics/components/googleanalytics
.
次の内容を googleanalytics.jsp
に追加します。
<%@page import="org.apache.sling.api.resource.Resource,
org.apache.sling.api.resource.ValueMap,
org.apache.sling.api.resource.ResourceUtil,
com.day.cq.wcm.webservicesupport.Configuration,
com.day.cq.wcm.webservicesupport.ConfigurationManager" %>
<%@include file="/libs/foundation/global.jsp" %><%
String[] services = pageProperties.getInherited("cq:cloudserviceconfigs", new String[]{});
ConfigurationManager cfgMgr = resource.getResourceResolver().adaptTo(ConfigurationManager.class);
if(cfgMgr != null) {
String accountID = null;
Configuration cfg = cfgMgr.getConfiguration("googleanalytics", services);
if(cfg != null) {
accountID = cfg.get("accountID", null);
}
if(accountID != null) {
%>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', '<%= accountID %>']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'https://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script><%
}
}
%>
これによって、設定のプロパティに基づいたカスタムマークアップが出力されます。
http://localhost:4502/miscadmin#/etc/cloudservices
に移動し、新しいページを作成します。
Google Analytics
googleanalytics
CRXDE Liteに戻り、/etc/cloudservices/googleanalytics
の下で次のプロパティをjcr:content
に追加します。
componentReference
String
acs/analytics/components/googleanalytics
新しく作成したサービスページ(http://localhost:4502/etc/cloudservices/googleanalytics.html
)に移動し、+をクリックして、新しい設定を作成します。
/etc/cloudservices/googleanalytics
My First GA Config
「Google Analytics 設定」を選択し、「作成」をクリックします。
アカウント ID(例:AA-11111111-1
)を入力します。「OK」をクリックします。
ページに移動し、「クラウドサービス」タブで、新たに作成された設定をページプロパティに追加します。
このページにカスタムマークアップが追加されます。