Viewing 30 posts - 1 through 30 (of 30 total)
  • Author
    Posts
  • #5435

    I want to create a custom look for one of my categories that is different to other categories.

    I’ve copied the index.php file and called it category-6.php where 6 is the ID of the category I want to style differently.

    I’ve then copied the header.php and called it headeryoungstyle.php

    I’ve copied the bg.png file and changed the colors to my preferences and called it bgyoungstyle.png

    Now i’m a little lost. I want my new category-6.php to call my new headeryoungstyle.php and I want headeryoungstyle.php to use my new bgyoungstyle.png – how should I complete these steps?

    Thanks,

    Kevin

    #50235

    Hey,

    1) you can change the get_header() function in category-6.php so that it calls a specific header template. This codex page: http://codex.wordpress.org/Function_Reference/get_header tells you how to use the template name parameter.

    2) You can modify “header-{name}.php” and include/harcode the image or you can use a specific css class to call a different background image :)

    #50236

    Cool – got me category file calling my new header now.

    Just need to include my new bgyoungstyle.png file now – i’ll have a try!

    K

    #50237

    OK – i’m in my new headeryoungstyle.php and have included my new background in the following code:

    where in the header file should i place it?

    Thanks

    #50238

    If bgyoungstyle.png should replace bg.png on this category page you can use following css code in style1/2/3/4.css:

    body.category-6{
    background: url("../images/skin1/bgyoungstyle.png") repeat-x scroll 0 0 #FFFFFF;
    }

    I assume you’re using this template for the category with the id “6″. You can change the background value (image path, color,etc.)

    #50239

    More progress – I’ve copied the style1 file and called it style5 and have then changed the background image to my new background:

    body{

    background: #fff url(../images/skin1/bgyoungstyle.png) repeat-x 0 0;

    color:#666;

    }

    I’ve also commented out the old code that includes the style sheet in my new headeryoungstyle.php and have added :

    <link rel=”stylesheet” type=”text/css” href=”/author/wp-content/themes/newscast/css/style5.css” type=”text/css” media=”screen” />

    to my new headeryoungstyle.php

    but still the category is not showing the new background? Where did I go wrong?

    Thanks

    Kev

    #50240

    Just used your code and it works! If I could buy you a pint I would!!!

    Cheers Dude!

    K

    #50241

    Glad that I could help you :)

    #50242

    One more quick thing. I also want to style the individual posts of the category so I made two copies single.php – single1.php and single2.php. I then deleted all the code from single.php and added:

    <?php

    $post = $wp_query->post;

    if ( in_category(’6′) ) {

    include(TEMPLATEPATH . ‘/single2.php’);

    } else {

    include(TEMPLATEPATH . ‘/single1.php’);

    }

    ?>

    Then I used the code you gave me to try and change the style of single2.php so I added the code below to style1.css:

    body.single2{

    background: url(“../images/skin1/bgyoungstyle.png”) repeat-x scroll 0 0 #FFFFFF;

    }

    But this doesn’t change the header in the posts? Any ideas?

    Thanks

    #50243

    Instead of single2 fill in your post id or the template class (all classes are applied to the body tag). I can’t give you custom css code because I need a link to your (custom) single page first.

    #50244

    http://www.nicolamorgan.com/author/books/know-your-brain/

    This is link to the custom post in use (single2.php) – does that help? All I need to be able to do to is use my new header (bgyoungstyle.png) in single2.php

    Thanks

    Kev

    #50245

    Ok – I see the problem. Open up functions.php and add following code at the very bottom:

    function category_id_class($classes) {
    global $post;
    foreach((get_the_category($post->ID)) as $category)
    $classes[] = 'category-'.$category->cat_ID;
    return $classes;
    }
    add_filter('post_class', 'category_id_class');
    add_filter('body_class', 'category_id_class');

    #50246

    Thanks so much!!! – Everything is working great!

    That’s two pints of beer I owe you now :o)

    Kev

    #50248

    How would I apply my custom header (bgyoungstyle.png) to a particular page template. I’ve created a new page template called ‘template-young.php’ which appears in the page ‘Template’ drop down box but i’m not sure how to get it to use my alternative header.

    Basically, I can use my alternative header in posts and categories and now want to use it in some pages to.

    Thanks

    Kev

    #50249

    Can you post a link to a “custom page template” please.

    #50250
    #50251

    I can’t access the page (login page appears instead)…

    #50252

    Forgot I had the site locked while it’s still being built. You should be able to access it now.

    K

    #50253

    Ok – use:

    body.page-template-template-young-php{
    background: url("../images/skin1/bgyoungstyle.png") repeat-x scroll 0 0 #FFFFFF;
    }

    #50254

    That worked great! Now I am able to style my categories, posts and pages differently ;o). Thanks for all your help! Just one thing though, now when I click on a menu item that should display only posts from one category it shows all posts from every category and also displays the home page slider. It’s doing this with all menu items that are categories. I’ve tried recreating the menu but it still shows every post for one category in the menu.

    For example if you look at: http://www.nicolamorgan.com/author/clips/

    and click the menu item labeled ‘Clips & Cuttings’ this used to show only one post in the category but now it shows every post along with the home page slider :o( What can I do to fix this?

    #50255

    Maybe you based your archive template on index.php? Use the standard archive.php to remove the slider…

    #50256

    That was the cause – working fine now. Thanks! :o)

    #50257

    Glad that it works now :)

    #50258

    This was working perfect but something must have changed. The Homepage banner color was black which is how i’d like it but now it uses the navy blue banner (bgMediaRoom.png) which is for a specific category? I haven’t changed the CSS. I notice that when i comment out this line the Homapage banner becomes the correct black color again:

    body.category-26{

    background: url(“../images/skin1/bgMediaRoom.png”) repeat-x scroll 0 0 #FFFFFF;

    }

    I can’t leave this line commented out as I need it to make this category navy blue. Any ideas?

    K

    #50259

    I don’t see how your body ended up getting a class like .category-6, if you remove this your problem is solved – the class doesn’t need to be on the body at all.

    #50260

    Thanks, but if I do that then I lose all the work Dude and I did previously to make the headers change depending upon category. I found another solution so no need for help now.

    #50261

    Sorry, I thought I found a way to fix it but sadly not. So the header background is now red on the home page and it should be the default black. How can I make it black on the homepage? The bg.png file hasn’t been changed and as far as I know I haven’t changed any of the CSS that effects the header background on the homepage.

    http://www.nicolamorgan.com/author/

    #50262

    You can use:

    body.home {
    background: url("../images/skin1/bg.png") repeat-x scroll 0 0 #FFFFFF !important;
    }

    #50263

    Thanks so much Dude – that worked!

    K

    #50264

    Glad that it works now :)

Viewing 30 posts - 1 through 30 (of 30 total)

The topic ‘Different style for one category’ is closed to new replies.