1

次のように、WordPress テーマのカスタム背景を有効にしました。

add_theme_support('custom-background', array(
    'default-color' => 'FFF',
    'default-image' => get_template_directory_uri() . '/img/bg.jpg'
));

背景サイズを変更したいので、ボディのクラス「.custom-background」を取得します。

body.custom-background {
    background-attachment: fixed!important;
    background-position: center center!important;
    background-repeat: no-repeat!important;
    background-size: cover!important;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    position: absolute;
}

絶対位置に配置した唯一の理由は、同じ背景プロパティを持つが、幅が 1000px で中央マージン (0 auto) の別の背景を追加して、このセクションを css-filters でぼかしたいからです。

body.custom-background:before {
    content: "";
    background-image: url(""); //here he should takes the custom background-image (of body.custom-background)
    background-attachment: fixed!important;
    background-position: center center!important;
    background-repeat: no-repeat!important;
    background-size: cover!important;
    height: 100%;
    right: 0;
    left: 0;
    margin: 0 auto;
    width: 1000px;
    position: fixed;
    z-index: -1;
    filter: blur(10px);
}

しかし、もちろん wp はどれが background-image であるかを知りません... それで、どうすればこの問題を解決できますか? 彼はカスタム background-image を :before セレクターにもう一度持っていきますか?

私の言いたいことを理解していただければ幸いです。

4

1 に答える 1

0

次のコードを header.php に記述できます。 

<?php $background = set_url_scheme( get_background_image() ); ?>  
<style>  
  body.custom-background:before {  
  content: "";  
  background-image: url("<?php print $background; ?>");  
  background-attachment: fixed!important;  
  background-position: center center!important;  
  background-repeat: no-repeat!important;  
  background-size: cover!important;  
  height: 100%;  
  right: 0;  
  left: 0;  
  margin: 0 auto;  
  width: 1000px;  
  position: fixed;  
  z-index: -1;  
  filter: blur(10px);  
 }  
</style>

これは動作します...

于 2014-12-12T20:35:40.580 に答える