Hey,
I am trying to show a different custom header image for every category.
Here is what I currently use:
<!-- Start Custom Header Images - Shows Background Image Based on Category -->
<div id="header" <?php if ( in_category(3) ) { echo 'style="background: #fff url(/wp-content/themes/connections/img/header_99updates.gif) no-repeat bottom;"'; } else if (in_category (5) ) {echo 'style="background: #fff url(/wp-content/themes/connections/img/header_01updates.gif) no-repeat bottom;"'; } else if (in_category (7) ) {echo 'style="background: #fff url(/wp-content/themes/connections/img/header_03updates.gif) no-repeat bottom;"'; } else if (in_category (4) ) {echo 'style="background: #fff url(/wp-content/themes/connections/img/header_00updates.gif) no-repeat bottom;"'; } else if (in_category (6) ) {echo 'style="background: #fff url(/wp-content/themes/connections/img/header_02updates.gif) no-repeat bottom;"'; } else if (in_category (8) ) {echo 'style="background: #fff url(/wp-content/themes/connections/img/header_04updates.gif) no-repeat bottom;"'; } else if (in_category (9) ) {echo 'style="background: #fff url(/wp-content/themes/connections/img/header_05updates.gif) no-repeat bottom;"'; } else if (in_category (10) ) {echo 'style="background: #fff url(/wp-content/themes/connections/img/header_06updates.gif) no-repeat bottom;"'; } else if (in_category (2) ) {echo 'style="background: #fff url(/wp-content/themes/connections/img/header_98updates.gif) no-repeat bottom;"'; } else if (in_category (11) ) {echo 'style="background: #fff url(/wp-content/themes/connections/img/header_newsletter.gif) no-repeat bottom;"'; } else {echo 'style="background: #fff url(/wp-content/themes/connections/img/header_main.gif) no-repeat bottom;"'; } ?>>
<!-- End Custom Header Images -->
I am sure there must be a cleaner and better way. Any ideas?
Thanks a lot,
Will
My reply on your other thread covers the same solution:
http://wordpress.org/support/topic/92430#post-465894
Hey,
Thanks, but not sure how to use it this time?
That is how to show a different header for each category?
Sorry, not a php expert here, still learning.
I mean it would still be like using if else statement but using $cat instead... Still seems redundant. I am probably just miss-understanding...
Thanks again,
Will
You noted "I am sure there must be a cleaner and better way." That way would be to avoid multiple if tests through the use of the category ID in each of your header images (i.e. header_cat_1.gif). Then your PHP is pretty simple:
<div id="header" style="background: #fff url(/wp-content/themes/connections/img/header_cat_<?php echo $cat; ?>.gif) no-repeat bottom;">
Hi,
oh wow not sure why i did not think of that
thanks again,
Will
I would like to implement something similar, but not necessarily create a header image for each category.
div id="header" style="background: #fff url(/wp-content/themes/connections/img/header_cat_<?php echo $cat; ?>.gif) no-repeat bottom;"
Could someone suggest a modification to the code so that if there is no header cat gif is found it defaults to using header_cat_1.gif.
Jardry
Jardry, try this (just make sure the paths provided to the two $header_image vars are correct):
<?php
$header_image = '/wp-content/themes/connections/img/header_cat_' . $cat . '.gif';
if( !file_exists(ABSPATH . $header_image) ) {
$header_image = '/wp-content/themes/connections/img/header_cat_1.gif';
}
?>
<div id="header" style="background: #fff url(<?php echo $header_image; ?>) no-repeat bottom;">
Thanks for the code, I'll implement it when I do my next update and see how it goes.
Much appreciated.
Jardry
crikeymedia
Member
Posted 4 years ago #
I am yet to get into php code but could you not create pull the image from a database bsed on the page id... or append the page_id to select the filename... indexing.
Jardry