概要: tijaji

ニックネーム:tijaji

tijaji の最近の投稿

tijaji による最近のコメント

2018年6月14日

質問フォーム

hanaさん、こんにちは!

ありがとうございます。
現在のところテーマの設定としては、PCとスマホでヘッダー画像を変える機能はありません。
今後のバージョンアップ時の追加機能として、検討させていただきます。

取り急ぎ対策としてCSSで変更が可能です。

まず通常の背景を設定します。

カスタマイザーで「ヘッダーイメージ設定」→「ヘッダーイメージタイプ」で「メディア(画像、または動画)」にチェックをし、
「ヘッダーイメージ設定」→「ヘッダーメディア」→「ヘッダー画像」より画像を設定して下さい。

次に、管理画面 → 「外観」→「カスタマイズ」→「追加CSS」に以下をコピペしてみてください。

@media screen and (max-width: 480px) {

	.wp-custom-header img{
		display:none;
	}
	.wp-custom-header{
		padding:0 0 31.2%;
		background:url(http://tijaji.jp/demo/wp-content/uploads/2008/06/dsc03149.jpg);
		background-size:100% 100%;
		box-shadow: 0px 0px 4px #ccc;
	}

}

“@media screen and (max-width: 480px) {“ で表示の横幅の最大がが480pxだったら、つまりスマホの時という指定になります。

上記 http://tijaji.jp/demo/wp-content/uploads/2008/06/dsc03149.jpg の箇所は任意の画像のURLに変更してください。

背景画像の中央寄せや縦横比などは background-○○○プロパティで調整可能です。

詳しくはhttps://dekiru.net/article/13167/の記事が分かりやすいと思います。

これでPCとスマホで別の画像が表示されるようになると思います。