Wix Harmony エディタ：セクションの背景をカスタマイズする
この記事内
- セクションの背景を変更する
- セクションの背景をアニメーション化する
セクションの背景はページの雰囲気を設定し、訪問者の視線を誘導したり、スクロールする際の訪問者の体験を向上させることができます。サイトのブランドに合わせて細部まで調整したセクションをデザインしましょう。ライブラリから単色、画像、動画を選択し、奥行きを与えるためのエフェクトを適用することができます。
参考：
さまざまな既製のレスポンシブ対応セクションから選択して、デザインにかかる時間を節約しましょう。
新しいセクションを追加する際は、すべてのセクションを表示して、必要なテンプレートを選択することができます。
セクションの背景を変更する
セクションの背景を変えて、ページのデザインと操作性をすばやく変更します。スタイルに合わせて色、画像、動画を選択して、注目を集めましょう。
セクションの背景を変更する方法：
- エディタに移動します。
- 該当するセクションを選択します。
- 「背景を変更」をクリックします。
- 背景の種類を選択し、必要に応じてカスタマイズします：
色
をクリックします。
をクリックし、ページから特定の色を取得します。グラデーション
をクリックします。
、「ラジアル」
、「コニック」
、または「フルード」
を選択します。画像
をクリックします。
をクリックします。
をクリックし、画像のスケーリング方法 （「フィット」または「タイル」）を選択して、アクセシブル名（
をクリックすると、背景画像を完全に削除することができます。
をクリックすると、動画
をクリックします。
をクリックし、動画の背景をプレビューします。セクションの背景をアニメーション化する
スクロールアニメーションの背景を追加して、セクションに動きを与えましょう。訪問者がページを上下に移動する際、アニメーションは動的で魅力的なエフェクトを生成します。「パララックス」、「3D」、「ズーム」などのオプションを試して、スタイルに合わせて設定を調整してください。
セクションの背景をアニメーション化する方法：
- エディタに移動します。
- 該当するセクションを選択します。
- 「アニメーション」アイコン
をクリックします。 - アニメーションを選択します。
- （オプション）「カスタマイズ」をクリックして、アニメーション設定を微調整します：
- スクロール時のプレビュー：「プレビュー」アイコン
をクリックし、訪問者がスクロールした際にアニメーションがどのように再生されるかをプレビューします。 - ズーム：スライダーをドラッグして、どの程度ズームインまたはズームアウトするかを調整します。
- 方向：利用可能なオプションを使用してアニメーションの方向を調整します（例：時計回りや反時計回り、イン / アウトなど）
- 速度：スライダーをドラッグして、アニメーションの動きを調整します。
- スケーリング：スライダーをドラッグして、背景がどの程度フェードバックするかを決定します。
- 角度：アニメーションの回転角度を設定します。
- ストレッチ：アニメーションの奥行きと 3D 感を設定します。
- アニメーションタイプ：アニメーションがフェードインまたはフェードアウトするかを選択します。
- スクロール時のプレビュー：「プレビュー」アイコン
注意：
- 利用可能なアニメーションは、セクションションに追加する背景の種類（色、画像、動画）によって異なります。
- カスタマイズ設定は、選択したアニメーションによって異なります。