Grow your CSS skills. Land your dream job.

[Solved!] WordPress: How do I style a static front page?

  • Anonymous
    # February 15, 2011 at 8:36 pm

    I want my static front page to look like this:
    http://www.aarongmoore.com/test/layout.html

    Whereas I want all other pages on my website to look like this:
    I want my static front page to look like this:
    http://www.aarongmoore.com/

    I did find this page: http://brassblogs.com/cms-platforms/wordpress/creating-wordpress-themes-front-page-styling
    However, when I tried to use the suggestion all pages on my site refused to load and said there was an error on line three — where the < ?php if(is_front_page()) { ?> line was placed.

    I’m not sure how to customize the pages.php file in my theme to make the static front page look differently. I’m hoping someone on here will be able to help.

    # February 15, 2011 at 9:54 pm

    There are a couple things you can do. What I do is use the index.php in your theme’s folder to style the home page. Some people use home.php.

    Sorry my brain is a little fried at the moment and I can’t quite explain it like I should – hopefully somebody can lend me a hand here.

    Anonymous
    # February 15, 2011 at 10:09 pm

    My assumption was that styling the index.php would do what I want. However instead that “customized” the main blog page, where I have ‘x’ number of posts displayed.

    # February 15, 2011 at 10:14 pm

    Index.php will style the blog front page.
    Single.php will style a single post page

    Page.php will style your menu pages or whatever pages you create ( ex. home, contact )

    Now, if you want your homepage ( yoururl.com ) to look different than sub directories or other pages ( yoururl.com/contact ), you should create a new php file and call it “homepage.php”. However, you do not have to, you can target the homepage by using the body class in css.

    Add this to the homepage.php file at the very top!

    < ?php
    /*
    Template Name: Home
    */
    get_header(); ?>

    Remember to choose “Home” in the admin pages template for that particular page.

    Example.

    If you’re using a page called home, on the right hand side of the admin page you will see something that says “Template” with a dropdown box. Choose the correct template.

    Anonymous
    # February 15, 2011 at 10:23 pm

    I have my static page set to a certain page, not a post. Is there a way to have that page look different than other pages? Maybe using ‘if(is_front_page())’ somehow? I’m not sure.

    # February 15, 2011 at 10:42 pm

    Read above as I edited. Nowhere in my discussion above did I say anything about a post. I was referring to pages not blog posts.

    Anonymous
    # February 15, 2011 at 10:53 pm

    That was really easy, once I figured out that you can select the template for a page using quick edit. Thank you very much!

    # February 15, 2011 at 11:09 pm

    Yep, it can be pretty easy once you get the hang of it. You can also throw in the loop to that php file and post content inside the admin “pages”. That way you can easily update things instead of editing the homepage.php every time. If this doesn’t make sense I can elaborate more specifically.

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

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".