WordPressのカスタマイザーでカスタム背景画像の設定を出来るようにする

WordPressのカスタマイザーでカスタム背景画像の設定を出来るようにする
このエントリーをはてなブックマークに追加
PR

WordPressの標準機能としてある、テーマのカスタム機能ですが、そこで背景の設定で背景画像を指定できるようにする方法です。

 

 

テーマカスタマイザーで背景画像を指定出来るようにする

add_theme_support( 'custom-background' );

functions.phpのこの一行を追加することで、Wordpressの標準機能で背景画像の設定ができるようになります、背景画像のアップロードからタイル表示とかの設定もできるようになる。

※ WordPressバージョン 3.4以降でのみ利用可能となっています。

 

デフォルト値として、引数を使って指定することも可能となっています。

 

引数を使って、カスタム背景画像のデフォルト値を決める

$defaults = array(
	'default-color'          => '',
	'default-image'          => '',
	'default-repeat'         => '',
	'default-position-x'     => '',
	'default-attachment'     => '',
	'wp-head-callback'       => '_custom_background_cb',
	'admin-head-callback'    => '',
	'admin-preview-callback' => ''
);
add_theme_support( 'custom-background', $defaults );

デフォルト値ではこれらの項目が設定できます。

これで設定した背景画像のCSSがHTMLに出力されます。ただ、そのままだとCSSが出力されているだけなので、CSSが当たるようにしなければなりません。

 

bodyにCSSを当てる

<body class"custom-background">

bodyにCSSを当てる場合には bodyタグにclass custom-background を指定します。自動で出力されるCSSは custom-background が指定されていますので、これを何かしらの要素に指定することでカスタム背景画像で設定したものが表示されるようになります。

PR

COMMENT

コメントを残す

PR

9ineBBの管理人が運営するサイト

WDG WEB DESIGN GALLERY ウェブデザインギャラリー CC0 PHOTO 無料で使える高画質な写真をダウンロード、クレジット表記、リンク不要

9ineBBの最新情報をチェック・購読

Twitter Facebook Google+ Feedly RSS

どこをクリックしてもこの表示を消せます
(3日後以降に再度表示されます)