WordPress.org

Support

Support » Themes and Templates » custom theme per page

custom theme per page

  • Hi all ,
    I’m new in Wordspress and probable my question is fully but
    How can i attach different theme for each page i have or
    how to attach different CSS per page. I found “custom css and js” plugin
    but with him i can couldn’t;t attach css per page

    is it any plugin that i can use to attach theme or different css per page ? Or group of pages to get same template / or css / different from default

    Best Regards
    Emil T.

Viewing 4 replies - 1 through 4 (of 4 total)
  • You can make a template for each page in your theme. You can even have a different header and footer for each page. If you copy and paste the three files then rename them, eg. header-new.php, new.php, footer-new.php you can then make the new.php call the different header and footer then use CSS to make the pages look completely different 🙂

    If you look through the wordpress documentation you can find more details.

    Versi

    Thanks Versi
    I really didn’t find that way. I just thinking about solution like that but i seek something that is much user friendly :
    http://themeshaper.com/forums/topic/how-do-i-define-a-custom-css-file-per-page-template

    It’s because i have 3 groups with 4-5 pages on each group/ category /
    and i need to have 3 different CSS. Your solution will give me option to
    have different file per page , not for category or group of pages.

    Best Regards
    Emil

    You can use “conditionals” and trigger the action to insert extra css files into your header (loaded via header.php) .

    Enter something like this in your functions.php

    function more_css_to_this_category()
    {
      if( in_category(array('blue','Blue Cheese')) )
      {
        wp_enqueue_style( 'bluecss', get_bloginfo('stylesheet_directory') . '/bluecss.css' );
      }
      elseif( in_category(array('green','Green fish')) )
      {
        wp_enqueue_style( 'greencss', get_bloginfo('stylesheet_directory'). '/greencss.css' );
      }
      else
      {
        // a default: wp_enqueue_style( 'redcss', get_bloginfo('stylesheet_directory'). '/redcss.css' );
      }
    };
    add_action('wp_print_styles', 'more_css_to_this_category');
    
    function more_css_to_this_page()
    {
      if( is_page(array(42,'about-joe','About Joe'))  )
      {
        wp_enqueue_style( 'joecss', get_bloginfo('stylesheet_directory') . '/joecss.css' );
      }
      elseif( is_page(array(41,'about-linda','About Linda'))  )
      {
        wp_enqueue_style( 'lindacss', get_bloginfo('stylesheet_directory'). '/lindacss.css' );
      }
      else
      {
        // a default: wp_enqueue_style( 'dudecss', get_bloginfo('stylesheet_directory'). '/dudecss.css' );
      }
    };
    add_action('wp_print_styles', 'more_css_to_this_page');

    For more options, see codex for conditional tags: http://codex.wordpress.org/Conditional_Tags

    BR \ Emil 🙂

    An alternative to the above mentions, if the theme has the body_class(); in the <body> tag you can use CSS to design for each individual page

    If you view-source of your outputted page, and look at the <body class=”*classes here*”> you will find one that says page-id-#

    That page-id-# is specific to the exact page your on (if it’s a page)

    Otherwise it will give you other information like single home attachment etc.

    Which you can then use targetted CSS, so if you do

    body.page-id-2 {
        background: #000;
    }
    
    /* changing the links color just for that page id 2 */
    body.page-id-2 a {
         color: #f00;
    }

    It will change the background of whatever page is with the ID of 2 and etc, can target anything specifically on that page by prefixing the CSS with the body.page-id-# or body.single or body.home etc, whatever classes are available.

    There are a few people who made filters to the body classes to give you even more individualistic control.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘custom theme per page’ is closed to new replies.
Skip to toolbar