記述ミスってました。
body.home {
background:url(http://xn--zck8ci4084bojnbs1d.com/picture/sumaho.jpg) repeat;
background-attachment: fixed:
background-position: center top;
text-rendering: optimizeLegibility;
}
body.page-id-8 {
background:url(http://xn--zck8ci4084bojnbs1d.com/wp-content/uploads/digipress/magjam/background/pr.jpg) repeat;
background-attachment: scroll;
background-position: center top;
text-rendering: optimizeLegibility;
テーマ次第にはなりますが、body だとサイト全体の背景画像、背景色になるので、固定ページのコンテンツの class を指定すると良いでしょう。
大抵において、.container が多いかもしれません。
テーマ「Twenty Sixteen」の仕組みが勉強になるかもしれません。
テーマ「Twenty Sixteen」では .site-inner になっていました。
맹조さん、回答ありがとうございます。
早速.containerでやろうと思ったのですが、うまくいきません。
よろしければ、サイトを見ていただけますでしょうか?
http://xn--zck8ci4084bojnbs1d.com/
画面の白紙の部分にページごと違う背景を指定したいです。
要素を確認したところコンテナではないような気もしてきました。。
どのように、記述すれば良いでしょうか。。
20時間ほど解決策を探しましたが、なにぶん初心者なものでわからずじまいです。
よろしくお願いしますm(_ _)m
もし custom-background を利用しているテーマでしたら、
bodyの背景が上書きされる場合があります。
要素の確認では .main-wrap のようですね。でも、visual-custom.css が関わっているみたいですね。
テーマのオプションで変更される仕組みじゃないでしょうか。
맹조さん、はいテーマのオプションで背景は変更できるのですが、全ページの背景1つのみなんです。
.main-wrapでいろいろ指定してみたのですが、やはりうまくいきません。
visual-custom.cssですか・・・調べてみます。
sysbirdさん、はい読み込んで入るのですが上書きされているみたいです。
visual-custom.cssを見ると
.main-wrap:not(.mb-theme){color:#383838;background:#ffffff}.main-wrap a,.main-wrap a:visited,.loop-article a:hover {color:#383838;}.main-wrap a:hover {color:#29abe2;}
このような記述になっていました。
いろいろいじっていたら、指定した2番目以降の固定ページ背景が前に出てくるようにはなったんですが、1番目の背景がすべてのページに出てきてしまいます。その下に指定した背景が出る感じです。
.main-wrap:not(.mb-theme){
background:url .home( http://xn--zck8ci4084bojnbs1d.com/wp-content/uploads/digipress/magjam/background/背景1.jpg) repeat;
background-attachment: fixed:
background-position: center top;
text-rendering: optimizeLegibility;
background-repeat: no-repeat;!important;
background-attachment: fixed:}
このように記述しました。
これを.home .pege-idごとに振り分けるにはどうしたらいいですか?
それとも、そもそもの考え方が間違っていますか?
よろしくお願いします。
記述でたらめでした
.main-wrap:not(.mb-theme){
background:url( http://xn--zck8ci4084bojnbs1d.com/wp-content/uploads/digipress/magjam/background/背景1.jpg) repeat;
background-attachment: fixed:
background-position: center top;
text-rendering: optimizeLegibility;
background-repeat: no-repeat;!important;
background-attachment: fixed:}
テーマのオプションで背景を変更しているのでしたら、それが優先されることが多いです。
お使いのテーマが有償のようなので、開発元に問い合わせてみてはいかがでしょうか。
.page-id-8 .main-wrap …
.page-id-10 .main-wrap という感じでどうでしょう。
デザインのパターンが固定しているものなら、固定ページそれぞれにテンプレートを振り分けるのもスマートでいいんじゃないでしょうか。
sysbirdさん
開発元のデジプレスにも質問したのですが、この手の質問には回答してくれないようです。
맹조さん
.page-id-8 .main-wrap
このクラスを指定すると呼び出してくれないんです。。
ですので맹조さんが言っていたvisual-custom.cssに記述されている
.main-wrap:not(.mb-theme)
このクラスを指定すると呼び出してくれます。
ですが、
.home.main-wrap:not(.mb-theme)
.page-id-8.main-wrap:not(.mb-theme)
のように指定すると呼び出してくれず真っ白になってしまいます。
.home.main-wrap:not(.mb-theme){
background:url(http://xn--zck8ci4084bojnbs1d.com/wp-content/uploads/digipress/magjam/background/スマホ部背景1.jpg) repeat;
background-attachment: scroll;
background-position: center top;
text-rendering: optimizeLegibility;
}
.page-id-10.main-wrap:not(.mb-theme){
background:url(http://xn--zck8ci4084bojnbs1d.com/wp-content/uploads/digipress/magjam/background/アプリ部背景1.jpg) repeat;
background-attachment: scroll;
background-position: center top;
text-rendering: optimizeLegibility;
}
このように記述すればいけると思ったのですが真っ白になってしまいます。。
これは、素人にはかなり難しいものでしょうか?
>固定ページそれぞれにテンプレートを振り分ける
はい、背景だけ変えたいのでそれ以外のデザインは全く同じでも問題ないです。
page.phpを複製してpage-id-8.phpという固定ページファイルを作ってやってみたのですが、どこで背景を呼び出しているのかがわからず背景ファイルを変える記述をどこで書いていいのかがわかりません。。
[モデレータによる編集: 長すぎるコードの引用がありましたので削除しました(コードの投稿)。長いコードを引用する場合にはコードそのものを直接引用することは避け、pastebin.com や Gist のようなペーストビンサービスを利用してください。]
どこを変えれば良いでしょうか?
よろしければ教えていただきたいです。
長くてすみません。。
有料テーマの場合は、どこで背景を呼び出しているのかなどはテーマを買わないとわかりませんので、フォーラムでの回答は得られづらいでしょう。
サポートのあるテーマか、公式ディレクトリのテーマを選んでみては。
みなさん回答さりがとうございました。
勉強します。