WordPress.org

Ready to get started?Download WordPress

Forums

this is driving me crazy, different backgrounds on different pages going nowhere (4 posts)

  1. presseroo
    Member
    Posted 3 years ago #

    This is about the 3. extensive day i spent on reading and trying to get this different background images on different wrodpress pages working, at the point of loosing my mind over it so i decided to try and hope for some miracle help from here.

    I read about
    http://codex.wordpress.org/Conditional_Tags
    but i have no clue how to implement this.
    A:
    into the (which) php file???
    B:
    into style.css ???

    I currently use
    #header {
    width: 100%;
    height: 480px;
    background: url("images/astro-zodiac-on-our-solar-system.jpg") top left no-repeat;
    }
    in style.css to display the same header image on all pages (do not use blog entries, only pages).

    Some sites suggested i would only have to put in additional CSS code for each additional page id i want to have a different header background image on - but somehow nothing i tried worked.

    There was also the suggestion of altering a php file (header.php??) with these
    Conditional_Tags
    but i got lost in this too.

    Any concrete help available to solve this obviousely dueable issue also for me??

  2. alchymyth
    Forum Moderator
    Posted 3 years ago #

    most common implementation of the 'conditional tag' method is using embedded styles in header.php.

    somewhere before the </haed> tag, add something like this to header.php:

    <?php $page_bg = '';
    if( is_page('page1') ) :
    $page_bg = 'page1_background_image.jpg';
    elseif( is_page('page2') ) :
    $page_bg = 'page2_background_image.jpg';
    elseif( is_page('page3') ) :
    $page_bg = 'page3_background_image.jpg';
    elseif( is_page('page4') ) :
    $page_bg = 'page4_background_image.jpg';
    //extend as much as you like;
    endif;
    if( $page_bg != '' ) : ?>
    <style type="text/css" media="screen">
    #header { background-image: url(<?php bloginfo('template_url'); ?>/images/<?php echo $page_bg; ?>); }
    </style>
    <?php endif; ?>

    a totally different approach is in this article , a semi-automated twist on (background) images for pages or posts

  3. presseroo
    Member
    Posted 3 years ago #

    Thanks alchymyth,
    it's plenty of hours later, and i can say i found the most intelligent and logical solution that works cross browser in WP 3+ - and took my sweat time to post the entire sermon here:
    http://wordpress.org/support/topic/the-working-simplicity-on-different-background-images-for-different-pages?replies=0

    Finally also for the medium coder no luxury anymore to have any page or post in a different look!

  4. alchymyth
    Forum Moderator
    Posted 3 years ago #

    well done.

    i keep forgetting the great possibilities of this 'body_class()'

Topic Closed

This topic has been closed to new replies.

About this Topic