> ## Documentation Index
> Fetch the complete documentation index at: https://domoinc-openapi-sync-dataflows.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Drag-and-Drop App

export const InlineImage = ({src, alt = '', height = '1.6em'}) => {
  return <img noZoom src={src} alt={alt} style={{
    display: 'inline',
    verticalAlign: 'start',
    height: height,
    margin: '0'
  }} />;
};

## はじめに

ドラッグ&ドロップで、Appstoreの力をダッシュボードに集めます。ダッシュボードエディターからDDX Bricksを追加できるようになったため、Appstoreからダッシュボードに移動する必要がなくなりました。ほかのダッシュボードコンテンツとコンテキストを保持したままで、Appstoreからカードを追加することができます。DDX Bricksについて詳しくは、「 [DDX Bricks](/s/article/4423762260375) 」を参照してください。

## Drag-and-Drop Appを追加する

ダッシュボード編集モードが開いているときにダッシュボードビューの右側に表示される <InlineImage src="/images/kb/ja/ka05w00000126Jj-00N5w00000Ri7BU-0EM5w000005wKkw.png" /> アイコンをクリックし、ページ上の目的の場所にドラッグすると、ダッシュボードにDrag-and-Drop Appを追加できます。次に目的のDDX Bricksを選択します。選択したDDX Bricksは、ページ内のこの場所に追加されます。

**Drag-and-Drop Appを追加するには、**

1. Drag-and-Drop Appを追加したいダッシュボードで、ページの右上にある
   <InlineImage src="/images/kb/ja/ka05w00000126Jj-00N5w00000Ri7BU-0EM5w000005wKl6.png" /> メニューの **［ダッシュボードを編集］** を選択します。

   <Frame>
     <img alt="Edit_Dashboard.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/STh97d86twEaUU5_/images/kb/ka05w00000125NC-00N5w00000Ri7BU-0EM5w000005vOEm.png?fit=max&auto=format&n=STh97d86twEaUU5_&q=85&s=0a253a9b3878e9f4f5572ecf84d10f4b" width="263" height="417" data-path="images/kb/ka05w00000125NC-00N5w00000Ri7BU-0EM5w000005vOEm.png" />
   </Frame>
2. ページの右側にあるツールバーの
   <InlineImage src="/images/kb/ja/ka05w00000126Jj-00N5w00000Ri7BU-0EM5w000005wKkw-1.png" /> アイコンをクリックし、新しいレイアウトを適用するページ上の場所にドラッグします。

   Appアイコンを境界線の上にドラッグすると、ハイライト表示されてAppをそこに配置できることが示されます。以下の例では、「グループ1」レイアウトのすぐ下の行にアイコンをドラッグしています。

   <Frame>
     <img alt="Add_App.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/STh97d86twEaUU5_/images/kb/ka05w00000126Jf-00N5w00000Ri7BU-0EM5w000005vOEs.png?fit=max&auto=format&n=STh97d86twEaUU5_&q=85&s=aad15e1573e83fea70fbcf5637291e7e" width="2613" height="1455" data-path="images/kb/ka05w00000126Jf-00N5w00000Ri7BU-0EM5w000005vOEs.png" />
   </Frame>

   <InlineImage src="/images/kb/ja/ka05w00000126Jj-00N5w00000Ri7BU-0EM5w000005wKkw-2.png" /> アイコンを境界にドロップすると、 **［Select an App］** ダイアログが開きます。
3. ダッシュボードに追加するDDX Bricksを検索します。
4. リストからAppを選択し、 **［Get］** をクリックします。

   ポップアップウィンドウが表示され、Appが作成されていることを知ることができます。

   <Frame>
     <img alt="Creating_App_Message.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/STh97d86twEaUU5_/images/kb/ka05w00000126Jf-00N5w00000Ri7BU-0EM5w000005vOEq.png?fit=max&auto=format&n=STh97d86twEaUU5_&q=85&s=4f4bca383c29e38eaf1e6dbb1e6ee44f" width="500" height="296" data-path="images/kb/ka05w00000126Jf-00N5w00000Ri7BU-0EM5w000005vOEq.png" />
   </Frame>
5. Appがダッシュボードに挿入されました。
6. 右上の **［Save］** ボタンをクリックしてダッシュボードを保存します。
7. その上にマウスを移動し、ドロップダウンメニューから **［Edit Card］** を選択すると、Appを編集およびカスタマイズできます。

DDX Bricksの編集について詳しくは、「 [DDX Bricks](/s/article/4423762260375) 」を参照してください。

日本語
