エクスペリエンスエディターのパフォーマンスを向上させるためにスプライトを使います

新しいスプライトを作成してください

Experience Editorのリボンで新しいまたはカスタムのスプライトアイコンを利用できるようにしたい場合、新しいスプライトファイルを作成し、そこに自分のスプライトアイコンコレクションを追加できます。

新しいスプライトを作成するには:

1. CoreデータベースでSpritesフォルダ(/sitecore/content/Applications/WebEdit/Sprites)を右クリックし、「 挿入 」をクリックし、その後「 スプライト」をクリックします。

   

2. 新しいスプライトについては、スプライト セクションで以下の2つのフィールドを指定します:

   • 画像URL(画像URL )– スプライト画像の出力パスを指定します。
   • StylesheetUrl – スプライトのスタイルシート出力パスを指定します。
   

   !注「スタイルシートURL To Included」フィールドはオプションです。スプライトスタイルシートファイルに含まれる基本的なスタイルシートファイルを定義するために使うことができます。

3. 新しいスプライトの下には、カスタムスプライトアイコンを追加できます。エクスペリエンスエディターの初期化中、Sitecoreはすべてのスプライトリソース(スプライト画像とスタイルシート)を再生成します。

スプライトにカスタムアイコンを追加

新しいスプライトを作成したら、そこに自分のスプライトアイコンを追加できます。

!注スプライトアイコンを追加する前に、まずアイコンをアップロードしてSitecoreで利用可能にする必要があります。

スプライトにカスタムアイコンを追加するには:

1. CoreデータベースでSpritesフォルダ(/sitecore/content/Applications/WebEdit/Sprites)に移動します。

2. 該当するスプライトアイテムかカスタムアイコンを追加したいフォルダを右クリックし、「 挿入 」をクリックしてから「 スプライトアイコン」をクリックします。

   

3. スプライトアイコンについては、以下を指定してください:

   • スプライトセクションのスタイルシートクラスフィールドで、CSSクラス名を指定します。

     

   • 外観セクションのアイコンフィールドで、アイコンへの経路を指定します。

     特定のアイコンへのパスを見つけるには、「 アイコンを開く」をクリックしてください。 「アイコン変更 」ダイアログボックスで、該当するアイコンに移動して 「OK」をクリックします。

     

既存のリボンコントロールにはスプライトアイコンを使います

エクスペリエンスエディターのリボンで画像の代わりにスプライトアイコンを読み込むには、既存のリボンコントロールのスプライトサポートを有効にすることができます。

スプライトのサポートを有効にし、既存のリボンコントロールにアイコンを割り当てるには:

1. Coreデータベースで /sitecore/content/Applications/WebEdit/Ribbons/WebEdit/Experience Editor/ に移動し、該当するリボンコントロールをクリックしてください。

2. コンテンツタブのスプライトセクションで:

   • 現在のリボンコントロールのスプライトサポートを有効にするには、「 有効」 チェックボックスを選択してください。この方法では、画像の代わりにスプライトアイコンが読み込まれます。
   • ス プライトアイコン フィールドで、現在のリボンコントロールに使いたいスプライトアイコンを指定します。
   

3. 変更を保存してください。

新しいスプライト互換リボンコントロールを作成する

新しいカスタムリボンコントロールを作成する際、スプライト互換テンプレートを基にリボンコントロールを基にしてスプライト対応にできます。

スプライト互換リボンアイテムを使用するには:

• リボンチャンク項目の下にスプライト対応のリボンアイテムを追加し、通常通りプレゼンテーションの詳細を設定します。

  すべてのスプライト互換リボンテンプレートは、CoreデータベースのRibbon Controlsフォルダ(/sitecore/templates/System/Experience Editor/Ribbon Controls)にあります: