MENU

料金プラン

機能一覧

デモ

ご利用の流れ

お役立ちコラム



*イベントカレンダー予約フォームのカスタマイズ

イベントカレンダー予約フォームのカスタマイズ方法

イベントカレンダーフォームは、イベントをインタラクティブなカレンダーレイアウトで表示し、お客様が日付をブラウズしたり、イベント詳細を開いたり、ガイドに沿ったフローで予約を完了したりできるようにします。

これはAmeliaの他のフォームと同じデザイン構造に従っており、全体的なスタイリングのための基本設定タブと、各ステップ固有のコントロールのための詳細設定タブがあります。お客様がイベントを選択すると、予約は繰り返し予約フォーム(ステップバイステップフォーム)で使用されるのと同じ一連のステップを経て進むため、基本の色やボタンのスタイルを更新することで、イベント体験全体の一貫性が確保されます。

例えば、カレンダーのハイライトカラーやイベントカードのレイアウトを調整することで、お客様が興味のあるイベントを素早く見つけられるようになります。

イベントカレンダーのカスタマイズはどこから行いますか?

Amelia → カスタマイズ を開き、フォームタイプのリストからイベントカレンダーを選択します。右側にライブプレビューが表示され、左側には基本設定タブと詳細設定タブが含まれています。

ステップのドロップダウンを使用すると、イベントカレンダー、イベント情報、同行者ありポップアップ、お客様情報、支払い、完了 の各画面を切り替えることができます。各ステップには独自のレイアウトと要素が含まれているため、選択したステップに応じてデザインオプションが変わります。

基本設定タブでは何を設定できますか?

基本設定タブでは、色、ボタン、フォント、レイアウト、サイドバーの表示など、イベントカレンダーのフロー全体のグローバルなスタイリングを制御します。

全体的な変更は、個別に設定することなくすべてのステップに適用されます。カレンダーレイアウトには独自の視覚要素があるため、グローバルカラーは基本の外観を定義するのに役立ち、予約プロセスの後半のステップが選択したテーマと一致するようにします。

関連性がある場合はリストレイアウトとグリッドレイアウトの切り替えが可能で、サイドバーを非表示にすることで、よりコンパクトなイベント表示のためにデザインを簡素化できます。

Global Basic settings for Event calendar booking form in Amelia

詳細設定タブでは何を設定できますか?

詳細設定タブでは、イベント予約プロセスの各ステップを微調整できます。これには、項目の動作や表示を制御するためのオプション、テキスト要素の名前を変更するためのラベル、および選択したステップの特定の領域をカスタマイズするための色が含まれます。

イベントカレンダーフォームには閲覧ステップと予約ステップの両方が含まれているため、コントロールはステップごとに異なります。カレンダーステップには、日付のハイライトカラー、非アクティブな日付、イベントマーカーの設定が含まれます。一方、予約ステップには、入力項目のラベル、ドロップダウンのスタイリング、およびボタンのカスタマイズが含まれます。

各ステップを個別に設定できるため、閲覧と予約の体験を詳細に調整できます。

イベントカレンダーフォームではどのようなステップが利用できますか?

  • イベントカレンダー – イベントのインジケーター、アクティブな日付、ホバー状態を表示するメインのカレンダーインターフェースを表示します。
  • イベント情報 – 説明、スケジュール、スタッフ、定員などの詳細なイベント情報を表示します。
  • 同行者ありポップアップ – イベントで複数の参加者が許可されている場合に使用されます。このポップアップには数量セレクターと参加者コントロールが含まれます。
  • お客様情報 – 繰り返し予約フォーム(ステップバイステップフォーム)と同じ構造を使用して参加者の詳細を収集します。
  • 支払い – 支払い方法の選択、価格の概要、チェックアウト要素が含まれます。
  • 完了 – イベント予約が成功した後に表示される最終的な確認画面です。

各ステップには独自のデザインコントロールが含まれているため、ラベル、項目の動作、または色の調整は、現在選択されているステージにのみ適用されます。

イベントカレンダーフォームをカスタマイズする際の注意点は何ですか?

  • イベントの日付が識別しやすいように、カレンダーのハイライトカラーには十分なコントラストを持たせてください。
  • 長い説明文や画像には間隔の調整が必要な場合があるため、イベント情報のステップを注意深く確認してください。
  • 詳細設定タブのラベルを使用して、イベントの詳細、参加者への指示、またはポップアップのタイトルを明確にします。
  • 数量コントロールが小さな画面では異なって表示される可能性があるため、モバイルで「同行者あり」ポップアップをテストしてください。
  • イベントの閲覧から予約への移行が自然に感じられるよう、配色を繰り返し予約フォーム(ステップバイステップフォーム)に合わせてください。
  • カレンダーの色や更新されたラベルが正しく表示されるように、変更を公開した後はウェブサイトのキャッシュをクリアしてください。