---
title: "レンダリングを追加、編集、削除する"
slug: "add-edit-and-delete-a-rendering"
abstract: "SXAにはページデザインを簡単にするための事前定義レンダリングライブラリが付属しています。"
---
# レンダリングを追加、編集、削除する

エクスペリエンスエディターでは、あらかじめ定義されたレンダリングが付属しているツールボックスを使ってページデザインを簡単にできます。ツールボックスからレンダリングをページにドラッグしてページを作ることができます。

## レンダリングを追加

エクスペリエンスエディターでは、ツールボックスからレンダリングをドラッグしてページに追加できます。

ページにレンダリングを追加するには:

1.  ツールボックスを開き、該当するレンダリングを探してください。レンダリングをクリックしてドラッグし始めると、レンダリングをドロップできるプレースホルダーが青色で点灯します。
    
    ![Drag the rendering to the page](https://doc.sitecore.com/api/markdown-image/xp/ja/users/sxa/93/sitecore-experience-accelerator/images/DE470D12D5D346B68DAE9C147E018C24.png)
    
    または、タッチパネルを使って指でレンダリングをページにドラッグするか、**HOME**タブの**レンダリング**アイコンをクリックしてください。
    
    > !注特定のレンダリングをページにドラッグできない場合は、[プレースホルダーの制限](https://doc.sitecore.com/xp/en/developers/sxa/100/sitecore-experience-accelerator/en/set-placeholder-restrictions.html)が原因かもしれません。
    
2.  レンダリングをページに表示するにはクリックしてください。
    
3.  選択したレンダリングによっては、[コンテンツアイテムを選択する](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/select,-modify,-and-create-a-data-source.html "Select, modify, and create a data source")必要がある場合があります。「 **関連するコンテンツを選択する** 」ダイアログボックスで、希望するコンテンツアイテムを選択し、**OK**をクリックします。
    
    レンダリングがページに表示されたら、ツールボックスに戻らずに別のプレースホルダーに移動できます。フローティングツールバーの**「移動**![9A39A7031726467584F9937A171F4E64.png](https://doc.sitecore.com/api/markdown-image/xp/ja/users/sxa/93/sitecore-experience-accelerator/images/9A39A7031726467584F9937A171F4E64.png)」をクリックして、レンダリングを別のプレースホルダーに移動させます。
    

## レンダリングを編集する

編集可能なレンダリングもあれば、編集できないものもあります。レンダリングを編集できると、浮かぶツールバーが表示されます。

レンダリングを編集するには:

1.  **編集したいレンダリングをクリックし、浮遊ツールバーで「コンポーネントの編集**」をクリックしてくださいレンダリングがテキストであれば、ページ上で直接編集できます。また、フローティングツールバーから「編集スタイル」アイコンもクリックできます。
    
2.  **コントロールプロパティ**ダイアログで、表示したいレンダリング動作やスタイルを指定します。利用可能なオプションはレンダリングの種類によって異なります。すべてのレンダリングでスタイル設定を変更できます。例えば、タイトルの段落スタイルを変更したり、プレビューアイコンの寸法を変えたりできます。
    
    > !注プレースホルダーとデータソースのプロパティは変更しないでください。これらのプロパティを変更するとレンダリングが消えたり、他の予期せぬ動作を引き起こす可能性があります。
    
3.  スタイルを変更するには、**コントロールプロパティ** のダイアログでス **タイリング** セクションに行き、希望するスタイルを選択してください。
    
4.  レンダリングに割り当てられたデータソースを公開するには **「公開** 」をクリックしてください。サイトは公開されません。
    

## レンダリングを削除する

時には、ページからレンダリングを削除したい場合もあります。例えば、プロモーションオファーが無効になった場合などです。

ページからレンダリングを削除するには:

-   削除したいレンダリングをクリックし、フローティングツールバーで「**![5B2701EDEF084E7FB4C11CD3B9D5E3AA.png](https://doc.sitecore.com/api/markdown-image/xp/ja/users/sxa/93/sitecore-experience-accelerator/images/5B2701EDEF084E7FB4C11CD3B9D5E3AA.png)Remove」をクリックします。**
    
    > !注列や行分割器が多い複雑なページレイアウトを作成し、ネストされたレンダリングを削除しようとすると、「どのレンダリングを削除したいか」というメッセージが表示されるかもしれません。「削除」をクリックすると削除されるセクションがハイライト表示されます。「OK」をクリックすると、リストに載っているすべてのコンポーネントが削除されます。