WordPress.org

Ready to get started?Download WordPress

Forums

Can I use "is_page_template" to create different background images? (4 posts)

  1. jhearing
    Member
    Posted 3 years ago #

    I'm helping my mom put up a blog/website for her garden club.
    http://www.newarkohiogardenclub.org
    There are 3 background images they would like available for different pages of the website portion to be added later as it develops. I am trying to create 3 page templates so that they can choose any of the backgrounds from the admin add a page panel.

    I found this thread and used the code as a basis to try and incorporate the is_page_template tags.
    http://wordpress.org/support/topic/329144?replies=22

    <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
    <?php if (is_page_template ('page_maroon.php') ):
    // page 1 ?>
    <style type="text/css">
    body {background-color:#000;background-image:url(/images/bg_maroon.jpg);background-repeat:no-repeat;}
    </style>
    <?php elseif (is_page_template ('page_green.php') ):
    // page 2?>
    <style type="text/css">
    body {background-color:#000;background-image:url(/images/bg_green.jpg);background-repeat:no-repeat;}
    </style>
    <?php endif; // end the if, no images for other other categories ?>

    I tried adding the code to the header.php and the page.php, but neither worked. I get an error message that refers me to a line # that doesn't exist in my file. I do not have a lot of CSS experience, so I'm not sure if the code is the problem or if I put it in the wrong place, etc.
    All help appreciated. Thanks.

  2. jrav001
    Member
    Posted 3 years ago #

    The position in your header would be important because in order to override the styles in your default stylesheet, the above code must come after the call to style.css

  3. jhearing
    Member
    Posted 3 years ago #

    I am still getting error messages--is this correct?

    Here is the code (header.php) from line 1 up to the style.

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>
    <head profile="http://gmpg.org/xfn/11">
    <meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
    <title>
    <?php wp_title('«', true, 'right'); ?>
    <?php bloginfo('name'); ?>
    </title>
    <link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
    <link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
    <link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/css/MenuMatic.css" type="text/css" media="screen" />
    <!--[if lte IE 6]>
    <link rel="stylesheet" type="text/css" href="ie6.css" />
    <![endif]-->
    <!--PNGFIX JS-->
    <script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/iepngfix_tilebg.js"></script>

    This is the code from the style through my wrapper.

    <style type="text/css">
    img, div { behavior: url(<?php bloginfo('template_directory'); ?>/iepngfix.htc) }
    </style>
    <?php if ( is_singular() ) wp_enqueue_script( 'comment-reply' ); ?>
    <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
    <?php if (is_page_template ('page_maroon.php') ):
    // page 1 ?>
    <style type="text/css">
    body {background-color:#000;background-image:url(/images/bg_maroon.jpg);background-repeat:no-repeat;}
    </style>
    <?php elseif (is_page_template ('page_green.php') ):
    // page 2?>
    <style type="text/css">
    body {background-color:#000;background-image:url(/images/bg_green.jpg);background-repeat:no-repeat;}
    </style>
    <?php endif; // end the if, no images for other other categories ?>
    <?php wp_head(); ?>
    </head>
    <body class="bodyBg2435">
    <div id="wrapper"><!-- main wrapper -->

  4. jhearing
    Member
    Posted 3 years ago #

    Found a solution that worked for me -- hope it might help someone else.
    I found this blog on creating custom templates:
    http://wptheming.com/2010/03/custom-page-templates-thematic/

    I then followed a thread called "Dynamic body classes" to this blog article: http://wptheming.com/2009/12/dynamic-body-classes-wordpress-styling/

    I followed the "Not Using Thematic?" section in this article and downloaded the theme, then copied the theme's funtion.php file into mine. (follow the directions in the article)

    I created the templates I desired, one for each background image I wished to use.

    <?php
    /*
    Template Name: Full Page
    */
    ?>

    Then I added these lines to my stylesheet for each of my template names and changed the photo references:

    }

    .page-template-page_maroon-php {
    margin: 0px;
    padding: 0px;
    background: url(images/bg_maroon.jpg) center no-repeat #c7869e;
    font: normal 12px Arial, Helvetica, sans-serif;
    color: #c7869e;
    }

    Lastly, I entered this text (after head tag) into my header.php file to call in each template and background:

    <body class="<?php thematic_body_class() ?>">
    <?php if (is_page_template('page_maroon.php')){
    echo "";}
    elseif (is_page_template('page_green.php')){
    echo "";}
    elseif (is_page_template('page_gray.php')){
    echo "";}
    elseif (is_page_template('page_black.php')){
    echo "";}
    else{
    echo "body";
    }?>

Topic Closed

This topic has been closed to new replies.

About this Topic