Page cover

ボタン

概要

Avonni ボタンコンポーネントは、ユーザーがクリックしたときにアクションを起動するように設計されています。高度にカスタマイズ可能で、ボタンコンポーネントはユーザー体験を向上させ、ウェブサイトとのやり取りをスムーズで直感的にします。フォーム送信、ナビゲーション、プロセスの開始、モーダルやポップアップのトリガーなど、さまざまなアクションに最適です。

チュートリアル

操作へのリンク

Salesforce Experience Cloud サイト向けの Avonni ボタンコンポーネントには「リンク先」インタラクション設定が用意されています。この機能により、ユーザーがボタンをクリックしたときの特定のアクションや動作を定義できます。

「リンク先」インタラクションの種類

  1. トーストを表示:

    • 機能: ボタンクリック時に短時間表示される通知(トースト)を発火します。

    • Experience Cloud における使用: 「操作が成功しました」や「正常に保存されました」のような即時のフィードバックや確認メッセージを提供するのに最適です。トーストメッセージは邪魔にならず数秒で消えるため、素早い通知に適しています。

  2. ナビゲート:

    • 機能: ユーザーを別のページやURLにリダイレクトします。

    • Experience Cloud における使用: ユーザーを一連のステップに案内したり、追加のリソースへ誘導したりして、サイトのナビゲーションやユーザージャーニーを向上させるために不可欠です。

  3. アラートモーダルを開く:

    • 機能: アラートメッセージを表示するモーダルウィンドウを開きます。

    • Experience Cloud における使用: 利用を続ける前にユーザーの確認が必要な重要な情報や警告(利用規約やプライバシー通知など)を表示するのに役立ちます。

  4. 確認を開く:

    • 機能: ユーザーに操作の確認を求める確認ダイアログを表示します。

    • Experience Cloud における使用: (レコードの削除など)重大な影響を伴う操作に最適で、ユーザーが情報に基づいた判断を行えるようにします。

  5. フローダイアログを開く:

    • 機能: Salesforce Flow Builder で作成されたスクリーンフローを起動します。

    • Experience Cloud における使用: この機能は、マルチステップのプロセスを案内したり、構造化されたフローを通じて情報を収集したりするのに最適です。顧客アンケート、データ入力フォーム、インタラクティブガイドなどの用途に利用できます。

Avonni ボタンコンポーネントの「リンク先」インタラクション設定を構成することで、Salesforce Experience Cloud サイト上でより動的でインタラクティブな体験を作成できます。これらのインタラクションは、即時のフィードバックの提供、サイト内のナビゲート、重要な情報の提示、ユーザー操作の確認、あるいはプロセスの案内を行うことで、ユーザージャーニーをよりスムーズかつ魅力的にします。

仕様

名前
説明
使用法

ラベル

ボタンに表示されるテキストを定義します。

ボタンの動作をユーザーに示す簡潔で明確なラベルを入力してください。

アイコン名

ボタンに表示するアイコンを選択します。

ボタンの動作を視覚的に表す適切なアイコンを選択し、ユーザーの理解を高めます。

アイコン位置

ボタン内でのアイコンの位置を決定します。

ボタンを視覚的にバランスさせ、ウェブページのデザイン方針に合わせた位置を選択してください。

バリアント

ボタンの事前定義されたスタイルバリアントを選択します。

ボタンの動作の文脈やウェブページ全体のデザイン言語に適したバリアントを選んでください。

水平方向の配置

コンテナ内でのボタンの水平方向の配置を定義します。

視覚的な調和を図り、ページレイアウトの要件を満たすためにボタンを配置してください。

ストレッチ

ボタンがコンテナに合わせて伸びるかどうかを決定します。

このオプションを有効にすると、ボタンが水平に拡張してコンテナ内の利用可能なスペースを埋めます。

無効化

ボタンの有効/無効状態を制御します。

特定のアクションが適用されない、または一時的に防止する必要がある場合に、ユーザーとのやり取りを防ぐためにボタンを無効にします。

最終更新

役に立ちましたか?