Wix プロギャラリー:ギャラリーに矢印ボタンを追加する

読了時間:5分
プロギャラリーに矢印ボタンを表示することで、訪問者が自分のペースでギャラリーの詳細を閲覧できるようにします。特定のプロギャラリーのレイアウトでは、矢印ボタンをギャラリーの内外に表示し、さらにカスタマイズすることができます。
矢印の色を変更して、サイトの他の部分のデザインを引き立たせることができます。
ライブサイトでスライドギャラリーを示した GIF。
注意:
ギャラリーで拡大表示を有効にしている場合、矢印ボタンが自動的に表示されます。

矢印ボタンを追加・カスタマイズする

矢印ボタンはサムネイル、スライダー、スライドショー、カラムレイアウトで有効にできます。設定パネルの「デザイン」タブから、矢印の位置、色、サイズをカスタマイズします。
Wix エディタ
Wix Studio エディタ
  1. エディタにアクセスします
  2. ページ上のプロギャラリーをクリックします。
  3. 設定」をクリックします。
  4. 左側の「デザイン」タブをクリックします。
  5. 矢印ボタン」をクリックします。
  6. 矢印ボタンを表示」トグルを有効にします。
  7. オプションを使用して矢印をカスタマイズします:
    • 矢印のスタイル:矢印のデザインをクリックして選択するか、「追加」アイコン  をクリックして独自のアイコンをアップロードします。
    • 矢印の背景:ドロップダウンをクリックして、影、ボックス、または背景なしを選択します。
      • :矢印の周りにわずかな影を追加します。
      • ボックス:矢印の周りにボックスを追加します。カラーボックスをクリックしてボックスの色を変更し、該当するスライダーをドラッグして不透明度を調整し、角を丸くします。
      • なし:矢印に背景は追加されません。
    • 矢印のサイズ :スライダーをドラッグして、矢印ボタンのサイズを大きくしたり小さくしたりします。
    • 矢印の色:カラーボックスをクリックして、矢印ボタンの色を選択します。サイトカラーから選択するか、独自の色を選択します。
    • 矢印の位置:該当するチェックボックスを選択して、ギャラリー上または外に矢印を表示します。注意:ギャラリーに矢印を表示すると、ギャラリーアイテムの一部が隠れることがあります。
    • 中央の矢印の方向:矢印をギャラリー本体、ギャラリー画像、またはテキストの中央に配置します。
      注意:このオプションを表示するには、「デザイン」タブの「テキスト」でテキストの表示位置にギャラリー「下部」が選択されている必要があります。このオプションは、現在「サムネイル」と「スライダー」レイアウトではご利用いただけません。
    • 横方向の余白:スライダーをドラッグして、矢印とギャラリーの枠線の間隔を調整します。
「矢印ボタン」のカスタマイズオプションのスクリーンショット。
ヒント:
レイアウト」タブでスクロールの方向を「」に設定することで、グリッドレイアウトとコラージュレイアウトで矢印を有効にすることもできます。
「スクロールの方向」オプションのスクリーンショット。

拡大表示で矢印ボタンをカスタマイズする

ギャラリーの拡大表示を有効にすると、矢印は自動的に表示されます。拡大表示内の「デザイン設定」タブからこれらの矢印の色をカスタマイズしましょう。

拡大表示で矢印ボタンをカスタマイズする方法:

Wix エディタ
Wix Studio エディタ
  1. エディタにアクセスします
  2. ページ上のプロギャラリーをクリックします。
  3. 設定」をクリックします。
  4. 左側の「デザイン」タブをクリックします。
  5. 拡大表示」をクリックします。
  6. 拡大表示をカスタマイズ」をクリックします。
  7. 拡大表示ポップアップの右側にある「デザイン設定」までスクロールダウンします。
  8. アイコンの色」横のカラーボックスをクリックし、サイトカラーから選択するか、独自の色を選択します。
  9. 完了」をクリックします。
拡大表示で矢印ボタンのデザインオプションが表示されたスクリーンショット。
注意:
拡大表示での矢印ボタンはデスクトップにのみ表示され、モバイルには表示されません。サイト訪問者がモバイルでギャラリー内を移動するには、左または右にスワイプする必要があります。