wake-up-neo.com

Bearbeiten des benutzerdefinierten Hintergrund-CSS

Ich habe die Funktion add_theme_support( 'custom-background'); zu meinem functions.php hinzugefügt, aber die zum wp_head hinzugefügte css ist nicht so, wie ich es möchte.

<style type="text/css" id="custom-background-css">
body.custom-background { background-image: url('http://localhost/wordpress/wp-content/uploads/2016/05/bg_green_dark.jpg'); background-repeat: no-repeat; background-position: top center; background-attachment: fixed; }
</style>

Ich habe eine div als Hintergrund.

<div id="bg"></div>

Und ich möchte custom-background zur div anstelle des Körpers hinzufügen.

Gibt es eine Möglichkeit, das zu tun?

theme-developmentthemescsstheme-customizeradd-theme-support
3
J. Doe

Ja das ist möglich Nehmen Sie ein schauen Sie sich den Codex an und Sie werden sehen, dass Sie mit add_theme_support( 'custom-background') Argumente übergeben können. Eine davon ist die Rückruffunktion, die die Tags <style> generiert: _custom_background_cb. Sie können Ihre eigene Funktion als Argument an add_theme_support übergeben.

Hier ist der Code der ursprünglichen Funktion (abgerufen aus WP 4.5, bitte überprüfen Sie, ob Sie dies später lesen):

function _custom_background_cb() {
    // $background is the saved custom image, or the default image.
    $background = set_url_scheme( get_background_image() );

    // $color is the saved custom color.
    // A default has to be specified in style.css. It will not be printed here.
    $color = get_background_color();

    if ( $color === get_theme_support( 'custom-background', 'default-color' ) ) {
        $color = false;
    }

    if ( ! $background && ! $color )
        return;

    $style = $color ? "background-color: #$color;" : '';

    if ( $background ) {
        $image = " background-image: url('$background');";

        $repeat = get_theme_mod( 'background_repeat', get_theme_support( 'custom-background', 'default-repeat' ) );
        if ( ! in_array( $repeat, array( 'no-repeat', 'repeat-x', 'repeat-y', 'repeat' ) ) )
            $repeat = 'repeat';
        $repeat = " background-repeat: $repeat;";

        $position = get_theme_mod( 'background_position_x', get_theme_support( 'custom-background', 'default-position-x' ) );
        if ( ! in_array( $position, array( 'center', 'right', 'left' ) ) )
            $position = 'left';
        $position = " background-position: top $position;";

        $attachment = get_theme_mod( 'background_attachment', get_theme_support( 'custom-background', 'default-attachment' ) );
        if ( ! in_array( $attachment, array( 'fixed', 'scroll' ) ) )
            $attachment = 'scroll';
        $attachment = " background-attachment: $attachment;";

        $style .= $image . $repeat . $position . $attachment;
    }
?>
<style type="text/css" id="custom-background-css">
body.custom-background { <?php echo trim( $style ); ?> }
</style>
<?php
}

Kopieren Sie dies, benennen Sie es my_callback_function (oder so) um, ändern Sie die letzten Zeilen, in denen das CSS gedruckt wird, und übergeben Sie es als Rückruf wie folgt:

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