変更内容のテスト
[AEM Forms as a Cloud Service]{class="badge informative"}
**「コアコンポーネントを含む空白」**テンプレートに基づいてアダプティブフォームを作成。フォームに 3 つのボタンをドラッグ&ドロップし、「Corporate」、「Marketing」、「Default」というラベルを付けます。
次に示すように、ペイントブラシを選択して、企業ボタンとマーケティングボタンに適切なスタイルバリアントを割り当てます。
3 番目のボタンには、デフォルトのスタイルが適用されます。
テーマプロジェクトの作成
次の手順では、テーマプロジェクトを作成します。テーマプロジェクトのルートフォルダーに移動し、次のスクリーンショットに示すように、コマンド「npm run build」を実行します。
テーマプロジェクトが正常に作成されたら、変更をテストする準備が整います。
CSS を迅速かつ簡単にテストする方法
- テーマプロジェクトの dist フォルダーにある theme.css ファイルを開きます。ファイルの内容をすべて選択してコピーします。
- 前の手順で作成したフォームをプレビューします。
- いずれかのボタンを右クリックし、「Inspect」を選択して Developer Console を開きます。
- Developer Console で theme.css をクリックし、theme.css を開きます
- CTR-A を使用して theme.css のコンテンツ全体を選択して削除し、「削除」ボタンを押します。
- 前の手順で作成した theme.css のコンテンツをコピーして貼り付けます。
- ボタンは、次に示すように適切なスタイルで更新されます。
変更内容のプッシュ
変更内容に問題がなければ、フロントエンドパイプラインを使用して、変更内容をクラウドインスタンスにプッシュできます。
recommendation-more-help
4859a77c-7971-4ac9-8f5c-4260823c6f69