背景画像の削除と設定方法

 

Gush2 では、PC表示(1024px 以上)のときにヘッダー・ボディー・フッターに背景画像を出力しています。

指定箇所と、オリジナル画像に変更する方法を解説します。

背景画像出力部分(CSS)

style.css の「ここからPC表示設定」以下に下記の記述があります。

背景画像が不要の場合は、該当部分(background)をコメントアウトするか削除してください。

この画像は Subtle Patterns でダウンロードしたものです。この場を借りて御礼申し上げます。

背景カスタマイズ方法

スマホやタブレットでも背景画像を出力したい場合

スマホやタブレットで閲覧したときに少しでも速く表示できるよう、背景画像はPCでのみ設定しています。

どの端末で閲覧しても背景画像を表示したい場合、background の記述箇所を変更してください。

CSSの構成はこちらをご覧ください

※管理画面の「カスタム背景」を利用する場合は、上記のCSSで指定してある部分を削除する必要があります。

背景画像変更方法

背景画像をCSSから変更する場合、画像の場所を再指定してください。

body 部分を変更するなら、このようになります。

アップロード方法は2通りあります。

  • FTPソフトでテーマファイル内の「images」に直接アップロードする
  • 管理画面の「メディア」からアップロードする

例として、background.png という画像を用意して指定してみます。

FTPで直接アップロードする方法

テーマファイル内の「images」ディレクトリに画像をアップロードします。

FFFTP

FFFTP使用イメージ

CSSは相対パスで指定します。

管理画面からアップロードする方法

管理画面の「メディア」から「新規追加」で画像をアップロードします。

画像を選択すると、「添付ファイルの詳細」画面に移るので、URLをコピーします。

メディアアップロード

CSSはコピーしたURLをそのまま貼り付けて、絶対パスで指定します。

さいごに

背景画像が濃すぎると見づらくなってしまうので、薄いテクスチャ系画像がおすすめです。

素人でもブログをちょっとだけオシャレにできるデザインテクニック」も合わせてご覧ください。

2013年10月より、おもにWordPress初心者を対象とした指南書がメインのNaifixを開設。2014年3月にカスタマイズ前提のWPテーマ「Gush」を公開。
  • このエントリーをはてなブックマークに追加
  • Pocket

コメント一覧

  1. […] GUSH2の説明書に詳しく書かれていますので、こちらをどうぞ。 背景画像の削除と設定方法 […]

  2. […] 背景として利用した画像は、本家で紹介されていたSubtle Patternsを利用しました。 […]

この記事へのコメントはこちら

メールアドレスは公開されませんのでご安心ください。
また、* が付いている欄は必須項目となりますので、必ずご記入をお願いします。

内容に問題なければ、下記の「コメント送信」ボタンを押してください。