Wix エディタ:ライトボックスを追加・設定する

読了時間:5分
ポップアップライトボックスを追加して、訪問者の注意を引き付け、重要なお知らせや情報を紹介しましょう。ポップアップメッセージにパーツを追加したり、いつ表示させるかを決定したり、訪問者がポップアップメッセージを閉じる方法を選択したりすることができます。
Wix ライブサイトでライトボックスが表示されている GIF。

ステップ 1 | ライトボックスを追加する

ライトボックスを追加して、インタラクティブかつ訪問者にとって有益なページ・ポップアップを作成しましょう。「ようこそ」や「お問い合わせ」など、さまざまなテンプレートやタイプからお選びいただけます。

ライトボックスを追加する方法:

  1. エディタ左側で「パーツを追加 をクリックします。
  2. インタラクティブ」をクリックします。
  3. ライトボックス」下でカテゴリーを選択します。
  4. ライトボックスをクリックまたはドラッグして、ページに追加します。
エディタの「パーツを追加」パネル。ライトボックスタブが開いています。

ステップ 2 | ライトボックスにパーツを追加する

ライトボックスにパーツを追加して、コンテンツと外観を構築します。ライトボックス内に収まるように、パーツはライトボックスよりも小さくしてください。テキストやボタンなどを追加して、ライトボックスに必要なものをすべて含めることができます。

ライトボックスにパーツを追加する方法:

  1. メニュー・ページ」パネルから該当するライトボックスを開きます。
  2. エディタ左側で「パーツを追加 をクリックします。
  3. オプションからパーツタイプを選択します。
  4. パーツをクリックしてライトボックス内の選択した場所にドラッグし、「ライトボックスに移動」メッセージが表示されたらドロップします。
注意:
ライトボックスを追加すると、ライトボックスモードに入ります。これにより、ライトボックスを設定および編集できます。通常のエディタに戻るには、トップバーの「モードを終了」をクリックしてください。
エディタ内の「パーツを追加」パネル。エディタはライトボックスモードになっていて、カーソルがテキストパーツにマウスオーバーしています。

ステップ 3 | ライトボックスの表示設定を行う

ポップアップメッセージをデザインしたら、ライトボックスの開き方を決定します。ページの読み込み時に自動的に表示されるように設定したり、訪問者がクリックする必要があるパーツにリンクするように設定することができます。

ライトボックスの表示設定を行う方法:

  1. メニュー・ページ」パネルから該当するライトボックスを開きます。
  2. ライトボックスをクリックします。
  3. 表示設定」クリックします。
  4. ライトボックスの自動表示」下のオプションをクリックします:
    • オン:ページが読み込まれるとライトボックスが自動で表示されます。
      • 表示するページ」をクリックし、ライトボックスを表示するページを選択するか、「訪問者が最初に開いたページ」チェックボックスを選択します。
      • 待機時間」スライダーをドラッグして、ページが読み込まれてからアニメーションが表示されるまでの時間を調整します。
        注意:このスライダーは、すべてのライトボックスに表示されるわけではありません。
    • オフ:サイト訪問者がページにアクセスしてもライトボックスは自動的には表示されません。代わりに、サイトのパーツからリンクすることができます。
  5. (オプション)ライトボックスを表示する期間を設定します。これは、期間限定の商品やサービスを表示する場合に役立ちます:
    • 日付:オプションを使用して、ライトボックスを表示する開始日と終了日を選択します。
    • 時間:ライトボックスを表示する開始時間と終了時間を選択します。
    • タイムゾーン:ドロップダウンからタイムゾーンを選択します。
    • スケジュールをクリア:設定したライトボックスの表示予定を削除します。
「ライトボックス設定」パネルで、待機時間のオプションにマウスオーバーしている様子を示したスクリーンショット。

ステップ 4 | 訪問者がライトボックスを閉じる方法を選択する

訪問者がメッセージを読んだ後にライトボックスを閉じる方法を選択します。ボックスを閉じる方法は複数選択することも、1つだけ選択することもできます。たとえば、訪問者がライトボックスの後ろにあるオーバーレイをクリックして閉じられるようにしながら、より明確な「閉じる」ボタンを追加することができます。

ライトボックスに「閉じる」ボタンまたは「X」アイコンを追加する方法:

  1. メニュー・ページ」パネルから該当するライトボックスを開きます。
  2. ライトボックスをクリックします。
  3. 設定」アイコン  をクリックします。
  4. ボックスを閉じる方法」下でオプションを選択します。 :
    • X アイコン:訪問者は X アイコンをクリックしてライトボックスを閉じます。
    • テキストボタン:訪問者は「閉じる」ボタンをクリックしてライトボックスを閉じます。
ライトボックス設定パネル。ライトボックスを閉じるオプションがハイライトされています。

訪問者がオーバーレイからライトボックスを閉じることができるようにする方法:

  1. メニュー・ページ」パネルから該当するライトボックスを開きます。
  2. エディタでオーバーレイ(ライトボックスの周りのスペース)をクリックします。
  3. オーバーレイ設定」をクリックします。
  4. クリックで閉じる」トグルをクリックします:
    • 有効化:サイト訪問者はオーバーレイをクリックしてライトボックスを閉じることができます。
    • 無効化:サイト訪問者はオーバーレイをクリックしてライトボックスを閉じることはできません。
オーバーレイ設定パネル。カーソルが「クリックで閉じる」トグルにマウスオーバーしています。
次のステップ:
ライトボックスのデザインと位置をカスタマイズして、サイトの告知をさらに編集します。ライトボックスをカスタマイズする方法はこちら

よくある質問

以下をクリックして、ライトボックスに関するよくある質問とその回答をご覧ください:

お役に立ちましたか?

|