Wix モバイルアプリ:アプリのヘッダーをカスタマイズする

読了時間:5分
モバイルアプリのヘッダーは、各アプリ画面の上部に表示されます。このヘッダーはカスタマイズして、ビジネスロゴ、招待ボタン、その他のアクションボタン(例:「今すぐ予約」ボタンなど)を必要に応じて表示・非表示にすることができます。
この記事では、以下の項目について説明します:

Spaces by Wix アプリとマイアプリ by Wix の違い

使用するアプリ(「Spaces by Wix」または「マイアプリ by Wix」)によって、カスタマイズできるオプションは異なります。

Spaces by Wix アプリ

Spaces by Wix アプリでは、ヘッダーは大きなストリップとして表示され、そこに詳細情報が表示されます。このヘッダー内の情報はカスタマイズすることができます。
Spaces by Wix アプリでヘッダーがどのように表示されるかの例

マイアプリ by Wix

マイアプリ by Wix では、ヘッダーは「ディテール」または「ミニマル」から種類を選択することができます。また、アプリのメンバーがあなたとチャットできるチャットアイコンを表示または非表示にしたり、「ミニマル」を選択した場合はヘッダーを透明にすることができます。
マイアプリ by Wix で選択できる「ディテール」と「ミニマル」のヘッダーの比較画像。

アプリのヘッダーをカスタマイズする

アプリのヘッダーをブランドに合わせてカスタマイズし、メンバーがより便利にアプリを利用できるようにします。
ダッシュボード
Wix Owner アプリ
  1. サイトダッシュボードの「モバイルアプリ」にアクセスして、「Spaces by Wix」または「マイアプリ by Wix」からカスタマイズするアプリを選択します。
  2. モバイルアプリを編集」をクリックします。
  3. アプリエディタで「ヘッダー」セクションを選択し、「ヘッダーを編集」パネルを開きます。
ヘッダーを選択する様子を示したスクリーンショット。
  1. チャットアイコンを表示」トグルを有効または無効にして、ヘッダー上部のチャットアイコンを表示または非表示にします。
  2. ヘッダーの種類を選択します:
    • ディテール:ヘッダーが大きなストリップとして表示され、そこに詳細情報が表示されます。手順 6 に進んで表示する内容をカスタマイズします。
    • ミニマル:ヘッダーが細いストリップとして表示され、そこにプロフィールアイコン、通知アイコン、チャットアイコン(手順 4 で有効にした場合)が表示されます。現在、「ミニマル」を選択した場合に利用できるカスタマイズオプションはありませんが、左側の「デザイン」パネルからヘッダーのスタイルを透明に変更することができます。
注意:
「ミニマル」のヘッダーは、マイアプリにのみ使用できます。
  1. ヘッダーに表示する情報をカスタマイズします:
    • タイトル:カバー写真の下に表示されるアプリのタイトルを入力または編集します。ヘッダーの種類で「ディテール」を選択した場合、タイトルは必ず入力する必要があります。
    • サブタイトル:タイトルの下に表示されるサブタイトルを任意で入力します。
    • ロゴを表示:トグルを有効または無効にして、ビジネスロゴを表示または非表示にします。有効にした場合は、「画像を追加」をクリックして、メディアマネージャーからファイルを選択します。
      ヒント:画像は正確に収まるようクロップすることができます。
    • 基本情報を表示:トグルを有効または無効にして、ビジネスの基本情報画面にリダイレクトする「基本情報」リンクを表示または非表示にします。
注意:
アプリ情報は Wix Owner アプリからも編集することができます。
  1. アプリのメンバーについて表示する内容をカスタマイズします:
    • メンバー数を表示:トグルを有効または無効にして、メンバー数を表示または非表示にします。有効にした場合は、「メンバープロフィールを表示」トグルを有効または無効にして、メンバープロフィールのアバターを表示または非表示にします。
  2. ヘッダーに表示するアクションボタンをカスタマイズします:
    • 招待ボタンを表示:トグルを有効または無効にして、メンバーがアプリに他のユーザーを招待できる招待ボタンを表示または非表示にします。
    • カスタムボタンを表示:トグルを有効または無効にして、カスタムボタン(例:「今すぐ予約」ボタンなど)を表示または非表示にします。有効にした場合は、ボタンの動作を選択して、ボタンテキストを編集します。
  3. 右上の「保存して公開する」をクリックします。

お役に立ちましたか?

|