wordpress custom-background theme support

1
votes

I'm using child theme of default theme in WP and I have changed background image (in wp-admin)... it's generated with wp_head(); function in header.php... output source code looks like this:

<style type="text/css" id="custom-background-css">
  body.custom-background { background-color: #fffffe; background-image: url('http://example.com/wp-content/uploads/header.jpg'); background-repeat: no-repeat; background-position: top center; background-attachment: fixed; }
</style>

I need to modify url of the image (some hook, functions.php modification or anything else) for some reason but I am not able to find how to do this. I've searched all theme files with no resault :(

anyone know, how to do it (of course, without modifying wp core files - just theme modification or plugin)

3
wordpresswordpress-theming

3 Answers

4
votes

To be honest, I'm not a fan of WordPress adding unadjustable functionality to any theme. This is how I solved it. I removed the custom-background class from the body tag. Hopefully it's still useful to someone.

function disable_custom_background_css($classes)
{
    $key = array_search('custom-background', $classes, true);
    if($key !== false)
        unset($classes[$key]); 
    return $classes;
}

And before calling body_class(), preferably in functions.php

add_filter('body_class', 'disable_custom_background_css');

This prevents the script in wp_head from adding this particular style to the body tag. Now you can decide how to implement a background image.

1
votes

The code in the WP tuts article didn't work for me, but I managed to make some modifications to get it working.

global $wp_version;

if ( ! function_exists( 'change_custom_background_cb' ) ) :

function change_custom_background_cb() {
    $background = get_background_image();
    $color = get_background_color();

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

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

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

        $repeat = get_theme_mod( 'background_repeat', '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', 'left' );

        if ( ! in_array( $position, array( 'center', 'right', 'left' ) ) )
            $position = 'left';

        $position = " background-position: top $position;";

        $attachment = get_theme_mod( 'background_attachment', 'scroll' );

        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">
.custom-background { <?php echo trim( $style ); ?> }
</style>
<?php
}
if ( version_compare( $wp_version, '3.4', '>=' ) ) {
    add_theme_support( 'custom-background', array( 'wp-head-callback' => 'change_custom_background_cb','default-color' => 'fff' ) );
}
else {
    add_custom_background('change_custom_background_cb');
}

endif;