WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Different footer background on different category pages (5 posts)

  1. goshko
    Member
    Posted 3 years ago #

    hey there guys,

    i'm working on my new website, and was wondering if it is possible to have different background images for the footer on different category pages? the content of the footer will remain unchanged, just the background should be different. any ideas on how to accomplish that?

  2. David Gwyer
    Member
    Posted 3 years ago #

    You could try editing the footer.php theme file and change the footer CSS depending on the page category being viewed using the is_category function.

    See here for more details:

    http://codex.wordpress.org/Conditional_Tags#A_Category_Page

  3. alchymyth
    The Sweeper & Moderator
    Posted 3 years ago #

    you could use 'body_class()'
    http://codex.wordpress.org/Template_Tags/body_class
    to generate extra classes, which you might be able to use in the styles of the footer;

    or:

    you could use conditional statements to create embedded styles in hedader.php.

    http://codex.wordpress.org/Conditional_Tags

    is_category()
    in_category()

    just as an example for a possible structure - added to header.php, before </head> :

    <style type="text/css" media="screen">
    
    <?php if ( is_category('cat-name1') ) { ?>
    #footer { background: #111111 url("<?php bloginfo('stylesheet_directory'); ?>/images/cat1_img.jpg") center top no-repeat; }
    <?php } elseif( is_category('cat-name2') ) { ?>
    #footer { background: #222222 url("<?php bloginfo('stylesheet_directory'); ?>/images/cat2_img.jpg") center top no-repeat; }
    <?php else { ?>
    #footer { background: #333333 url("<?php bloginfo('stylesheet_directory'); ?>/images/default_img.jpg") center top no-repeat; }
    <?php } ?>
    </style>

    all depending on the html structure of your theme, and the css id or classes of your footer.

    if you use 'is_category()' it will only have effect in the category archives;
    if you use 'in_category()' it will have effect in most templates, but you need to consider the if/elseif/else more carefully.

  4. goshko
    Member
    Posted 3 years ago #

    i see, i think i'll be able to figure it from here, thanks a lot guys :)

  5. goshko
    Member
    Posted 3 years ago #

    here is a working variant of the code:

    <style type="text/css" media="screen">
    <?php if ( in_category('cat1') ) { ?>
    #footer { background: #fff url("<?php bloginfo('stylesheet_directory'); ?>/images/cat1_img.jpg") center top no-repeat; }
    <?php } elseif( in_category('cat2') ) { ?>
    #footer { background: #ccc url("<?php bloginfo('stylesheet_directory'); ?>/images/cat2_img.jpg") center top no-repeat; }
    <?php } else { ?>
    #footer { background: #ddd url("<?php bloginfo('stylesheet_directory'); ?>/images/cat3_img.jpg") center top no-repeat; }
    <?php } ?>
    </style>

Topic Closed

This topic has been closed to new replies.

About this Topic