Editor X:プロギャラリーのベストプラクティス

読了時間:4分
Editor X は、代理店とフリーランサー向けの新しいプラットフォームである Wix Studio に移行します。Wix Studio について
プロギャラリーを使用すると、動画、画像、テキストをすべて 1つの美しいマルチメディアギャラリーに表示できます。この記事のガイドラインを読んで、Editor X でプロギャラリーを最大限に活用しましょう。さまざまなギャラリーのカスタマイズ方法やどの画面サイズでも見栄え良くする方法を紹介しています。

必要な設定を見つける

異なるギャラリー設定を調整できる主なエリアは 2つあります:
  • プロギャラリー設定パネル
  • 要素設定パネル

設定パネル

設定パネルでは、ギャラリーのデザインと機能を調整できます。画像に合ったレイアウトを選択したり、アイテムをクリックしたときの動作を設定したり、アニメーションを追加したりできます。
Editor X のプロギャラリー設定パネルのスクリーンショット。

要素設定パネル

要素設定パネルでは、ブレイクポイント間でのギャラリーのサイズ、配置、動作を調整できます。これらの設定は、ギャラリーのレスポンシブで、あらゆる画面サイズで適切に表示されるようにするのに役立ちます。
要素設定パネルで利用可能なプロギャラリーのレイアウト編集オプションのスクリーンショット

ギャラリーがすべての画面サイズに対応するようにするには、さまざまな方法があります。以下を読んで、デザインニーズに最適な方法を選択してください。

ギャラリーのサイズ、ドッキング、マージンを確認する

すべての画面サイズで同じギャラリーレイアウトを表示することができます。プロギャラリーのサイズ設定には、フルード測定単位(例:%、vh、vw)を使用することをおすすめします。これにより、訪問者の画面に合わせて自動的にサイズが変更されます。
ヒント:
以下の場合、ギャラリーの高さを調整することはできません:
  • ギャラリーが縦スクロールに設定されている場合。
  • ギャラリーが横向きで画像の比率が固定されている場合。

これらの設定は、ギャラリーの設定パネルにある「レイアウト」タブから変更できます。
プロギャラリーのフルードサイズを設定する方法を示した要素設定パネルのサイズセクションのスクリーンショット
要素設定パネルで、すべてのブレイクポイントでギャラリーのドッキングとマージンを確認します。これらの設定が小さい画面に収まらない場合、ギャラリーは部分的にしか表示されないか、まったく表示されない可能性があります。これらの設定は、フルード測定単位(例:%)を使用して、画面に対して相対的にすることができます。
ドッキングとマージンを確認できる要素設定パネルのドッキングのスクリーンショット
ギャラリーをセクション全体に引き延ばして、さまざまな画面サイズに自動的に調整することができます。これで、サイズ、ドッキング、マージンについて心配する必要はありません。
Editor X のプロギャラリーにあるストレッチアイコンのスクリーンショット

異なるレイアウトを使用する

プロギャラリーにはさまざまなレイアウトがあります。ギャラリーが常に訪問者の画面に収まるように、各ブレイクポイントのレイアウトを選択できます。
別の外観を選択できるプロギャラリー設定の「レイアウト」タブのスクリーンショット

ギャップと間隔の問題のトラブルシューティング

ギャラリー画像の上、下、または画像間の間隔が広すぎる場合は、以下の手順をお試しください。

お役に立ちましたか?

|