Different body image backgrounds on different pages, posts and categories

Question

I am trying to implement the ability to choose a different body background image to different posts, pages and categories. I am using Advanced Custom Fields to add an image field to every post, page or category. Then I need a way to display the images chosen in this field as body background image.

This is my code so far. I think this approach might work but can't seem to be able to figure out what I am missing..

function my_theme_body_bg_image() {
    global $post;
    // set the handle of the main stylesheet - style.css
    $handle = 'main-styles';
    // set the custom background image field
    $bg_image = get_field('body_background_image');
    $css = "body { background-image: url('$bg_image'); }";
    wp_add_inline_style( $handle, $css );
}
add_action( 'wp_enqueue_scripts', 'my_theme_body_image_bg' );

Answer 1

You need to add the classes for the corresponding cases.

For pages/posts:

$css = "body.page-id-**post_id** { background-image: url('$bg_image'); }";

For categories:

$css = "body.category-**category_id** { background-image: url('$bg_image'); }";

You can retrieve post_id with $post->ID. For the category you need to check whether the page is_archive() and to append the corresponding ID or category name.