• Hello guys,

    I’m trying to use a method I found for changing attributes in the body through custom fields so that I have a different image for each page.

    So I have 2 custom fields, for example:
    background-color -> #aa4339
    background-image -> /images/ground01.png

    and on the page.php below <?php get_header(); ?> I’ve put:
    <style type=”text/css”>
    body {
    background-image: url(<?php bloginfo(‘template_url’); ?><?php echo get_post_meta($post->ID, ‘background-image’, true); ?>;
    background-color: <?php echo get_post_meta($post->ID, ‘background-color’, true); ?>;
    }
    </style>

    When I examine the source code it successfully returns:
    <style type=”text/css”>
    body {
    background-image: url(https://localhost/fragmentos/wp-content/themes/fragmentos/images/ground01.png;
    background-color: #aa4339;
    }
    </style>

    But still both the background image and the color fail to load.
    What do you think might be the problem?

    Thnx!

Viewing 6 replies - 1 through 6 (of 6 total)
  • Thread Starter maccoutinho

    (@maccoutinho)

    Crap, I was missing a ) in front of the image url.
    Well, I hope this method helps someone!

    Thread Starter maccoutinho

    (@maccoutinho)

    Well, since we’re at it, can someone help me add an if else statement to display a default image in case I don’t define the custom fields?

    Thanks!

    Thread Starter maccoutinho

    (@maccoutinho)

    Well, I searched a bit and got that too, just added this:

    <?php
    $values = get_post_custom_values(“background-image”); // set the img custom name
    if (isset($values[0])) { // if there’s a img in my custom field
    ?>
    <style type=”text/css”> body { background-image: url(<?php bloginfo(‘template_url’); ?><?php echo get_post_meta($post->ID, ‘background-image’, true); ?>); background-color: <?php echo get_post_meta($post->ID, ‘background-color’, true); ?>; } </style>
    <?php } // end if statement
    // if there’s no img do replace it with no-img
    else { ?>
    <style type=”text/css”> body { background-image: url(<?php bloginfo(‘template_url’); ?>/images/ground01.png);
    background-color:#aa4339; } </style>
    <?php } ?>

    Based it on:
    this post

    Thread Starter maccoutinho

    (@maccoutinho)

    Actually this last code doesn’t work, it always displays the default image. What am I doing wrong?

    Thread Starter maccoutinho

    (@maccoutinho)

    Fixed:

    <?php
    $number = get_post_meta($post->ID, ‘background-image’, true);
    if ( $number ) {
    ?>
    <style type=”text/css”> body { background-image: url(<?php bloginfo(‘template_url’); ?><?php echo get_post_meta($post->ID, ‘background-image’, true); ?>); background-color: <?php echo get_post_meta($post->ID, ‘background-color’, true); ?>; } </style>
    <?php } // end if statement
    // if there’s no img do replace it with no-img
    else { ?>
    <style type=”text/css”> body { background-image: url(<?php bloginfo(‘template_url’); ?>/images/ground01.png);
    background-color:#aa4339; } </style>
    <?php } ?>

    Thnx to this guy.

    JL

    (@johnlunceford)

    Hey Mac, thanks for sharing this. I’m not much of a coder but I’m doing my best to learn in order to get the visual details i want.

    Please confirm this…
    on the page.php
    below <?php get_header(); ?>

    put:
    <style type=”text/css”>
    body {
    background-image: url(<?php bloginfo(‘template_url’); ?><?php echo get_post_meta($post->ID, ‘background-image’, true); ?>;
    background-color: <?php echo get_post_meta($post->ID, ‘background-color’, true); ?>;
    }
    </style>

    When I examine the source code it successfully returns:
    <style type=”text/css”>
    body {
    background-image: url(https://localhost/fragmentos/wp-content/themes/fragmentos/images/ground01.png;
    background-color: #aa4339;
    }
    </style>

    define the custom fields in the individual pages
    example:
    background-color -> #aa4339
    background-image -> /images/ground01.png

    Could you just confirm where the last piece of PHP is located?

    Thanks!
    John

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Changing background image for each page’ is closed to new replies.