Component builderを使い始めましょう
このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。
このトピックでは、Component builderでコンポーネントを作成する際のステップの概要を提供します。多くのステップについては、より詳細なドキュメントへのリンクを提供しています。このガイドはコンポーネント作成の流れを理解するための出発点として意図されており、リンク先のドキュメントでさらに詳しく読むことができます。
コンポーネントを一から始める代わりに、共有コンポーネントのコピーをインポート して、それを出発点として自分で作成することも可能です。
コンポーネントを一から構築するには:
-
ナビゲーションヘッダーでDesignをクリックしてください。その後、左側のサイドバーでComponent builderリンクをクリックしてください。
-
ComponentビルダーのComponentsタブでAdd componentをクリックします。
-
「 新しいコンポーネントを作成する 」ダイアログで、コンポーネントの名前を入力し、そのコンポーネントが属するコレクションを選択します。クリックSave。
-
編集を開始するにはコンポーネントをクリックしてください。
-
空のコンポーネントキャンバスはグリッドを含むセクションです。コンポーネントのレイアウト作業を始めるには、グリッドをクリックしてドラッグして1つ以上のコンテナを描いてください。これらのコンテナはグリッド上でドラッグすることで動かせ、いつでもサイズを変えることができます。
-
コンテナをクリックすると対応するコンテキストバーが開きます。コンテキストバーでは、コンテナが自動的にタイプBlockが割り当てられているのがわかります。各コンテナの種類を変更するには、Block名の近くの矢印をクリックし、Card、Image、Block quote、Component、HTML blockなどの別のブロック要素を選択してください。
-
コンテナ内で、Add elementをクリックして別のBlock elementやText element、コンテナ内のInline elementを追加できます。また、別のコンポーネントを自分のコンポーネントに ラップ することもできます。さまざまな 要素 について詳しくはこちらをご覧ください。
-
必要に応じて、レスポンシブコンポーネントを作成するために、Add versionやDuplicate versionを何度クリックするかクリックして、デバイスタイプごとにできるだけ多くのバージョンを追加できます。ブレークポイント設定
ツールを使って、各バージョンごとに使用するデバイスタイプを指定できます。 -
コンポーネントが完成したら、ページビルダーで使用できるようにステージングし、ウェブサイト上で公開して公開できます。また、コンポーネントの埋め込みコード(レスポンシブコンポーネントの場合は全バージョンも含む)も入手でき、他のページビルダーで使うことができます。