メインコンテンツにスキップ

ページ背景を編集する

ページコンテンツの背後に表示される色や画像をカスタマイズして、独自のビジュアルスタイリングを作成します。

対応者:Brian
今日アップデートされました

ページ背景を編集する

ページコンテンツの背後に表示される色や画像をカスタマイズして、独自のビジュアルスタイリングを作成します。

ページ背景は、コンテンツの背後に表示されるものです。単色、画像、または背景画像の表示方法を工夫してクリエイティブに設定できます。これにより、各ページに独自の見た目を与えられます。

カスタマイズできる項目

背景色: すべての背後に表示される単色です。

背景画像: コンテンツの背後に表示される写真やパターンです。

画像サイズ: 背景画像のスケーリング方法(カバー、コンテイン、元のサイズなど)。

画像位置: 画像の配置位置(上、中央、下など)。

ページ背景を編集する方法

  1. メインナビゲーションからウェブサイトに移動します

  2. ページセクションを探します

  3. 編集したいページをクリックします

  4. 背景設定を探します(デザインやスタイリングの下にある場合もあります)

  5. 画像をアップロードするか、色を選択し、サイズと位置の設定を調整します

  6. 変更を保存をクリックします

背景画像のアップロード

背景画像をアップロードする際は、次の手順で行います。

  1. 背景画像フィールドをクリックします

  2. コンピュータからファイルを選択します

  3. アップロードします

  4. 表示方法を設定します(以下をご覧ください)

  5. 保存します

画像がページコンテンツの背後に表示されます。

背景画像のサイズオプション

カバー: 画像がページ全体を覆うようにスケーリングされます。画像の一部が切り取られる場合があります。

コンテイン: 画像全体が表示されます。空白スペースが残る場合があります。

元のサイズ: 画像が実際の寸法で表示されます。小さい場合は繰り返し表示される場合があります。

ストレッチ: 画像がスペースを埋めるよう引き伸ばされます(画像が歪む場合があります)。

最適な選択は、画像と求める効果によって異なります。

背景画像の位置オプション

上: 画像がページ上部に配置されます。

中央: 画像が垂直および水平方向に中央配置されます。

下: 画像が下部に配置されます。

左/右: 画像が左または右側に配置されます。

カスタム: テーマによっては正確な位置を指定できます。

位置は、画像がページより大きい場合や、スペース全体を覆わない場合に最も重要になります。

背景画像のヒント

控えめに保ちましょう。 ごちゃごちゃした背景はコンテンツを読みにくくします。

パターンを使用しましょう。 繰り返しパターンは上手くタイル表示され、コンテンツから注意をそらしません。

コントラストを確認しましょう。 背景に対してテキストが読みやすいか確認します。

モバイルでテストしましょう。 背景はスマートフォンで異なって見えます。

ファイルサイズを最適化しましょう。 大きな背景画像はサイトを遅くします。圧縮してください。

背景色

背景画像を使用しない場合、または画像の背後に色を配置したい場合は、次の手順で行います。

  1. 背景色フィールドを探します

  2. カラーピッカーをクリックします

  3. 色を選択します

  4. 保存します

単色はシンプルで読み込みが速く、コンテンツから注意をそらしません。

背景画像の削除

単色または透明な背景に戻すには、次の手順で行います。

  1. ページ設定を編集します

  2. 背景画像フィールドを探します

  3. 削除またはクリアをクリックします

  4. 背景色を選択します(またはデフォルトのままにします)

  5. 変更を保存をクリックします

ページごとに異なる背景

各ページに独自の背景を設定できます。ホームページには写真、旅行ページには単色、イベントページには控えめなパターンなどを設定できます。

または、一貫性のためにすべて同じにすることもできます。お好みでお選びください。

背景とヘッダー画像の違い

背景: ページコンテンツ全体の背後に表示されます。

ヘッダー画像: ページ上部のみに表示されます。

これらは別の要素です。片方だけ、両方、またはどちらも使わないこともできます。

テーマとの互換性

背景の表示方法はテーマによって異なります。すべてのサイズと位置オプションをサポートするテーマもあれば、制限があるテーマもあります。テーマで何が動作するか試してみてください。

固定背景とスクロール背景

テーマによっては、コンテンツがスクロールしても背景を固定したままにできます(パララックス効果)。コンテンツと一緒に背景がスクロールするテーマもあります。テーマのオプションをご確認ください。

ページ背景をカスタマイズすることで、結婚式ウェブサイトの各ページに独自の見た目を作り出せます。

こちらの回答で解決しましたか?