ページのコンポーネント
ページを作成した後、コンポーネントをページに追加して、レイアウトを作成したり、静的コンテンツや動的コンテンツを追加したりすることができます。 この単純な設計方法では、HTML、CSS、言語の構造や構文に関する知識がなくても、これらの言語で記述された、対応するコードをページに追加できます。
セクションを追加するには、ページ内にある既存のセクションを選択し、プラス記号 (+) またはセクションの追加を選択して、利用できるセクション レイアウトのいずれかを選択します。
ヒント
セクションのレイアウトは、セクションの作成後も変更できます。
コンポーネントを追加するには、コンポーネントを配置したい空のセクションあるいは既存の要素を選択します。 プラス記号 (+) またはオーバーフロー ボタン (...) を使用して、すべての利用できるコンポーネントを表示し、挿入するコンポーネントを選択します。
コンポーネントには以下の 2 種類があります。
標準コンポーネントは、ページ レイアウトや静的コンテンツの作成に使用されます。
データに接続済みコンポーネントは、動的コンテンツや Dataverse データに基づいた対話型のコンテンツの表示に使用されます。
すべてのセクションおよびコンポーネントは、コンテキスト内を編集でき、キャンバスから直接すべてのセクションやコンポーネントを編集できます。 セクションまたはコンポーネントを選択すると、選択した要素のプロパティ (位置合わせ、スタイル、色、サイズなど) を調整できるコンテキスト メニューが表示されます。利用できるコンポーネントとプロパティの詳細については、Web ページのカスタマイズを参照してください。
ソース コード
多くの場合、デザイン スタジオ のコンポーネントとして使用できないその他の要素には要件があります。 ページには、より複雑なレイアウトや書式設定が必要な場合や、より多くの CSS や JavaScript を呼び出す場合があります。 これらの要件は、Web 用 Visual Studio Code エディターを使用することで作成でき、作成者やプロの開発者によるページのソース コードと、関連した CSS および JavaScript の確認と変更ができます。
ページのソース コードを確認するには、コマンド バーにあるコードの編集ボタンを選択します。
コードの編集を選択すると、Web 用 Visual Studio Code にリダイレクトされ、ページ HTML、CSS、JavaScriptに対して編集を行うことができます。 ソース コードが保存されると、変更が同期され、キャンバスに表示されます。
警告
ソース コードに間違った構文を入力すると、ページのレイアウトが破損する可能性があります。 大きな変更を行う前に、元のコードのコピーを作成します。