現在表示中:

Web サイト用に、また AEM で、デザインの作成が必要になります。その場合はデザイナーを使用します。

注意:

Web アクセシビリティについて詳しくは、AEM と Web アクセシビリティのガイドラインを参照してください。

デザイナーの使用

デザインは、「ツール」タブの デザインセクションで定義できます。

screen_shot_2012-02-01at30237pm

ここで、デザインの格納に必要な構造を作成し、必要なカスケーディングスタイルシート(CSS)および画像をアップロードできます。

デザインは /etc/designs の下に格納されます。Web サイトで使用するデザインのパスは、jcr:content ノードの cq:designPath プロパティを使用して指定します。

chlimage_1

注意:

デザインモードのページ上でおこなわれたすべての変更は、サイトのデザインノードの下に保持され、同じデザインを持つすべてのページに自動的に適用されます。

必要なもの

デザインを実現するには、以下が必要です。

CSS

カスケーディングスタイルシートは、ページの特定の領域の書式を定義します。

画像

背景、ボタンなどの機能に使用するすべての画像。

Web サイトをデザインする際の考慮事項

Web サイトを開発する際は、画像や CSS ファイルを /etc/design/<project> の下に格納し、次のスニペットで記述されているように、現在のデザインに基づいてリソースを参照できるようにすることを強くお勧めします。

<%= currentDesign.getPath() + "/static/img/icon.gif %>

前述の例には、次のようなメリットがあります。

  • 別々のデザインパスを使用しているサイトごとに、コンポーネントのルックアンドフィールを変化させることができます。
  • design/v1 から design/v2 のように、デザインパスをサイトのルートにある別のノードに変更することにより、Web サイトのデザインを簡単に変更できます。
  • ブラウザーから見える外部 URL は /etc/designs/content のみなので、/apps ツリーの下に何があるかに興味を抱く外部ユーザーから保護することができます。前述の URL のメリットは、システム管理者がより高いセキュリティを設定する際にも役立ちます。アセットを公開する範囲を、少数の場所に制限しているからです。

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

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