WordPress.org

Support

Support » How-To and Troubleshooting » [Resolved] Different footer background on different category pages

[Resolved] Different footer background on different category pages

  • 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?

Viewing 4 replies - 1 through 4 (of 4 total)
  • 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

    Moderator Michael

    @alchymyth

    Forum Moderator

    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.

    i see, i think i’ll be able to figure it from here, thanks a lot guys 🙂

    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>

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘[Resolved] Different footer background on different category pages’ is closed to new replies.