Jupiter 4に背景画像を追加するWordPressテーマヘッダー

Question

私はJupiter 4テーマを使用しているサイトで作業しています。ダッシュボードにはヘッダレイアウトを設定するオプションがありますが、ヘッダに背景イメージを追加するものはありません。

スタイルシートはthemes/jupiter/stylesheet/css/styles.cssにあります。その中で、background-image: url('/wp-content/uploads/2016/04/header-miami-beach-sign.png');を#mk-headerで始まる異なるid定義に入れてみましたが、画像は表示されません。ヘッダーの背景は単色の白色です。

私は これをオンにしようとしている

：に

この：

Answer 1

木星4テーマでは、すべてが木星のバックエンドにある「テーマオプション」：

あなたはツールバーを無効にすることができますし、（必要であれば以上）200pxのに140pxの間のヘッダの高さを設定します。ヘッダー "：「で

• まず、あなたが設定解除（またはリセット）することができ、白の背景（透明）にスタイリングタブ（またはメニュー）"

• その後追加に行くスタイリングのために

  。 （ヘッダエリアを選択する）「背景」セクションで、あなたはそこにあなたの背景画像を設定することができます。スタイル

  を重複したり追加する

必要はありません

いけない木星のテーマは、あなたの背景画像に関する応答であることを忘れて...プレミアムテーマの問題を解決する

最も正確な方法は、木星のサポートスレッド上で検索したり、このサポートのスレッドで尋ね、ドキュメントを読んでいます。異なる画像を設定するには

----（更新）----

は、あなたが（これは単なる一例です）CSSを使用する必要がありますサイズ：

.mk-header-bg.mk-background-stretch { 
    background: transparent url('/myImage-hd.jpg') no-repeat !important; 
} 
@media only screen and (max-width: 1024px) { 
    .mk-header-bg.mk-background-stretch { 
     background: transparent url('/myImage-big.jpg') no-repeat !important; 
    } 
} 
@media only screen and (max-width: 768px) { 
    .mk-header-bg.mk-background-stretch { 
     background: transparent url('/myImage-medium.jpg') no-repeat !important; 
    } 
} 
@media only screen and (max-width: 588px) { 
    .mk-header-bg.mk-background-stretch { 
     background: transparent url('/myImage-medium-small.jpg') no-repeat !important; 
    } 
} 
@media only screen and (max-width: 400px) { 
    .mk-header-bg.mk-background-stretch { 
     background: transparent url('/myImage-small.jpg') no-repeat !important; 
    } 
} 
@media only screen and (max-width: 300px) { 
    .mk-header-bg.mk-background-stretch { 
     background: transparent url('/myImage-very-small.jpg') no-repeat !important; 
    } 
} 

Answer 2

あなたは、オーバーレイ要素から現在の背景を削除する必要があります。その後、ヘッダーに背景を追加すると、それが表示されます。

.mk-header-bg.mk-background-stretch, 
.mk-header-toolbar { 
    background: none; 
} 
.mk-header-holder { 
    background-image: url('/myImage.jpg'); 
}