という名前の ClientLibraryFolder を作成します。 clientlibs
サイトのページをレンダリングするために使用される JavaScript(JS) およびカスケーディングスタイルシート (CSS) を含む
The categories
このクライアントライブラリに与えられるプロパティ値は、コンテンツページからこの clientlib を直接含めたり、他の clientlib に埋め込んだりするために使用される識別子です。
使用 CRXDE Lite、展開 /etc/designs
右クリック an-scf-sandbox
を選択し、 Create Node
clientlibs
cq:ClientLibraryFolder
クリック OK
Adobe Analytics の プロパティ 新しい clientlibs
ノードに、 カテゴリ プロパティ:
注意: categories 値の前に「apps」を付けます。 は、「所有アプリケーション」が/libs ではなく/apps フォルダー内にあることを識別する規則です。 重要:プレースホルダーを追加 js.tx
t および css.txt
ファイル。 (正式には cq:ClientLibraryFolder ではありません。)
/etc/designs/an-scf-sandbox/clientlibs
css.txt
js.txt
css.txt と js.txt の最初の行は、以下のファイルのリストを検索する基本の場所を示します。
css.txt の内容を次のように設定してみてください。
#base=.
style.css
次に、clientlibs の下に style.css という名前のファイルを作成し、コンテンツを
body {
background-color: #b0c4de;
}
Adobe Analytics の プロパティ タブ clientlibs
ノードで、複数値の String プロパティを入力します。 埋め込み. これにより、必要な SCF コンポーネントのクライアント側ライブラリ (clientlibs). このチュートリアルでは、コミュニティコンポーネントに必要なクライアントライブラリの多くが追加されています。
各ページにダウンロードされる clientlib の利便性とサイズ/速度に関する考慮事項があるので、実稼動サイトで使用する方法にはこの方法が望ましい場合とそうでない場合があります。
1 つのページで 1 つの機能のみを使用する場合、その機能の完全な clientlib をそのページに直接組み込むことができます(例: )。
% ui:includeClientLib categories=cq.social.hbs.forum" %
この場合は、すべてを含め、作成者の clientlib であるより基本的な SCF クライアントライブラリをお勧めします。
名前:embed
型:String
Click Multi
値:cq.social.scf
ダイアログが表示され、 +
各エントリの後に、次の clientlib カテゴリを追加します。
cq.ckeditor
cq.social.author.hbs.comments
cq.social.author.hbs.forum
cq.social.author.hbs.rating
cq.social.author.hbs.reviews
cq.social.author.hbs.voting
クリック すべて保存
このように /etc/designs/an-scf-sandbox/clientlibs
がリポジトリに表示されます。
を含めずに、 apps.an-scf-sandbox
必要な JavaScript および CSS スタイルを使用できないので、ページの ClientLibraryFolder カテゴリ、SCF コンポーネントは機能しないか、スタイル設定されていません。
例えば、clientlibs を含めないと、SCF コメントコンポーネントはスタイル設定されていない状態で表示されます。
apps.an-scf-sandbox clientlibs を含めると、 SCF コメントコンポーネントは次のスタイルで表示されます。
include ステートメントは、 head
のセクション html
スクリプト。 デフォルト foundation head.jsp
には、オーバーレイ可能なスクリプトが含まれています。 headlibs.jsp
.
headlibs.jsp をコピーし、clientlibs を含めます。
使用 CRXDE Liteを選択します。 /libs/foundation/components/page/headlibs.jsp
右クリックして「 」を選択します。 コピー (または、ツールバーから「コピー」を選択します)。
/apps/an-scf-sandbox/components/playpage
を選択します。
右クリックして「 」を選択します。 貼り付け (または、ツールバーから「貼り付け」を選択します)。
ダブルクリック headlibs.jsp
開けるように
ファイルの末尾に次の行を追加します。
<ui:includeClientLib categories="apps.an-scf-sandbox"/>
クリック すべて保存
<%@ page session="false" %><%
%><%@include file="/libs/foundation/global.jsp" %><%
%><ui:includeClientLib categories="cq.foundation-main"/><%
%>
<cq:include script="/libs/cq/cloudserviceconfigs/components/servicelibs/servicelibs.jsp"/>
<% currentDesign.writeCssIncludes(pageContext); %>
<ui:includeClientLib categories="apps.an-scf-sandbox"/>
ブラウザーに Web サイトを読み込み、背景が青の影でないかどうかを確認します。
https://localhost:4502/content/an-scf-sandbox/en/play.html
この時点で、最小限のサンドボックスが存在します。 再生中にリポジトリが破損し、再起動したい場合は、サーバーをオフにできるように、パッケージとして保存する価値がある場合があります。 次に、フォルダー crx-quickstart/の名前を変更または削除し、サーバーをオンにし、この保存済みパッケージをアップロードしてインストールします。これらの最も基本的な手順を繰り返す必要はありません。
このパッケージは、 サンプルページの作成 飛び込んで遊び始めるのを待ちきれない人向けのチュートリアル!
パッケージを作成するには:
CRXDE Liteで、 パッケージアイコン
クリック パッケージを作成
leave as default
クリック 編集
選択 フィルター タブ
/apps/an-scf-sandbox
/etc/designs/an-scf-sandbox
/content/an-scf-sandbox**
「保存」をクリックします。
クリック ビルド
これで、以下を選択できます。 ダウンロード ディスクに保存し パッケージをアップロード 別の場所に移動し、「 その他/レプリケート :サンドボックスを localhost パブリッシュインスタンスにプッシュして、サンドボックスの領域を拡張します。