Support » Themes and Templates » how to add css for custom page template

  • hi everyone

    I made frontpage using custom page template, the template is frontpage.php was taken from page.php

    I have plan to make frontpage differently per month using this template, my problem is How and Where place to add the css for the frontpage

    I am absolutly newbie for coding, so the code advices that closely to copy-paste is realy needed, this is my link pandjalu

    many thanks

Viewing 9 replies - 1 through 9 (of 9 total)
  • Moderator t-p

    (@t-p)

    Have you consider incorporating an unique id or class for your “custom page template” and then add to CSS to the main stylesheet(s) using the id/class?

    However, if you want to use a standalone additional CSS sheet, you could use a conditional to call it in header.php?

    you mean something alike this:

    <body<?php if ( is_page(array('somepage1', 'somepage2', 'somepage3'))) {
    echo ' class="myclass" '; } ?>>

    and

    .myclass #content { background-color: #123456; }
    .myclass #content p { color: #987654; }
    Moderator t-p

    (@t-p)

    For example: Let’s suppose your newsletter template is called newsletter.php, you could do something like this:

    <link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_url'); ?>" media="screen" />
    <?php if(is_page_template('newsletter.php')) :?>
    <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>/newsletter.css" media="screen" />
    <?php endif;?>

    Generally I would recommend using the body_class filter instead of the if statement on the body.

    However, since you are newbie, I would recommend using the Custom Classes plugin for easily adding classes to specific pages.

    Once the class is added, simply add the styles to the main stylesheet for the theme.

    t-p & kopepasah, thanks the support, since i dont know how to implement your advices, now i made the frontpage with inline code in the page:

    &nbsp;
    
    <style><!--
    body {background-image:url('http://aryapandjalu.net/wp-content/uploads/2013/01/depan-front.jpg'); background-position: center center; background-size: cover;}
    --></style>
    <p style="text-align: right;"><span style="font-family: 'trebuchet ms', geneva; color: #88C34B; font-size: xx-large; padding-right: 140px;">ARYA PANDJALU</span></p>
    
    <h2 style="text-align: right;"><span style="color: #88C34B;"><span style="font-family: 'trebuchet ms', geneva;">                                                                                                                                         </span><span style="font-family: 'trebuchet ms', geneva;"><a href="http://aryapandjalu.net/arya-pandjalu/"><span style="color: #99cc00; padding-right: 140px;">Welcome /</span></a></span></span></h2>
    <h2 style="text-align: right;"><span style="color:#88C34B;"><a href="http://aryapandjalu.net/arya-pandjalu/"><span style="font-family: 'trebuchet ms', geneva; color: #99cc00; padding-right: 140px;">Selamat Datang</span></a></span></h2>
    <p style="text-align: right; margin-right: 45px;"></p>

    this is the best i did at the moment

    Justin, thanks for the advice, I’m trying to add the body_class_filter. Unfortunately the codex is incomplete. From the example on that page, where does the code go? If I were to take a wild guess I’d put the below in the page template.

    // Apply filter
    add_filter('body_class', 'multisite_body_classes');

    And the following in the themes function file?

    function multisite_body_classes($classes) {
            $id = get_current_blog_id();
            $slug = strtolower(str_replace(' ', '-', trim(get_bloginfo('name'))));
            $classes[] = $slug;
            $classes[] = 'site-id-'.$id;
            return $classes;
    }

    Am I correct?

    Then do I still add some custom css in my main css file?

    esmi

    (@esmi)

    Forum Moderator

    @square_eyes: If you require assistance then, as per the Forum Welcome, please post your own topic.

    But then I would be accused of a duplice post? I don’t see how posting a new question which directly relates to getting clarification from an answer in this question benefits anyone.

    esmi

    (@esmi)

    Forum Moderator

    Please post your own topic. Your new topic will not be removed as a duplicate as I am now closing this topic.

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘how to add css for custom page template’ is closed to new replies.