Wix Studio エディタ:レスポンシブの問題のトラブルシューティング
読了時間:6分
ブレイクポイント全体でクライアントのサイトの外観に問題が発生した場合、Wix Studio エディタは、異なる画面サイズでの要素の重複、配置問題、ずれなど、一般的なレスポンシブ性の課題に対応するツールを提供します。適切に調整すれば、どのデバイスでも快適に閲覧できる洗練されたプロフェッショナルなサイトを作成することができます。
特定のブレイクポイントで小さく表示されるテキスト
小さな画面でクライアントのサイトを表示すると、テキストが必要以上に小さく表示されますか?比例してスケーリングするレスポンシブ動作と最小最大設定を使用すると、どの画面サイズでもテキストが常にきちんと表示されるようになります。
テキストを選択し、「要素設定パネル」を開きます。まず、「レスポンシブ動作」を「比例してスケーリング」に設定します。次に、「デザイン」下の「最大-最小」をクリックして、最小フォントサイズと最大フォントサイズを設定します。
![Wix Studio エディタの要素設定パネル横のテキスト要素で、レスポンシブ動作がハイライトされ、「最大-最小」をクリックしている様子を示したスクリーンショット。](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2024/12/30/530975bc-5753-422c-9825-06ab865b6de9/3c970bac-91cc-440f-8d65-f41a5a975619.png)
ヒント:
最大・最小の設定は、自動的に小さなブレイクポイントに適用されるため、デスクトップ以外のブレイクポイントで変更を加える必要はありません。
ブレイクポイント全体で要素の配置に問題がある
クライアントのサイトの要素が、異なる画面サイズで位置を変更する場合、ドッキングと余白の設定が原因である可能性があります。以下の手順に従って、問題を解決し、要素が任意の位置にとどまるようにしてください。
要素のドッキングを確認する
要素の余白を調整する
(固定動作セクション)要素の余白をピクセル単位に切り替える
複数の要素が動く場合:
すべて同じ親コンテナにある場合(例:セクション、セルなど)、スタックして、一貫したスペースと配置を保証します。
ブレイクポイント全体で要素の位置がずれている
画面サイズが変更された際にセクション上の要素がずれる場合やレイアウトが変わる場合、多くの場合、一貫性のないドッキングや余白の設定が原因です。
以下の手順に従って問題の特定・修正を行い、すべての画面サイズで要素が正しく配置されるようにしてください。
要素が同じ側にドッキングされていることを確認する
マージン単位を標準化する
要素間の関係を確認する
ブレイクポイント全体で要素が重複する
要素を配置する際、エディタでは適切な間隔で要素が配置されていても、異なるビューポートでライブサイトを確認すると重複している場合があります。重複は通常、要素の配置方法やレスポンシブ動作が原因で発生します。
クライアントのサイトの要素が異なる画面サイズで重複する場合は、以下の手順に従って問題を特定して修正してください。
要素の配置とドッキングを確認する
要素のレスポンシブ動作を調整する
要素間の関係を確認する