The issue of using a portal-style home page in WordPress has come up a couple of times recently. I’ve tried to help some people with the code and settings. I’ve learnt a fair bit in the process that I thought was worth sharing.
WordPress can use a file called home.php as a homepage, which supercedes index.php. Allowing you to show whatever you like on your homepage. Now, WordPress v2.5 gives you the option of using a “page” as the home page of your blog/website. I like this method much better, because it allows a home page and the regular blog/posts page.
To do this you need to
- Create your home page
- Create a posts page
- Change the Reading settings
Custom Permalinks
On a slight tangent. I highly recommend that you enable custom permalinks. Doing so will allow for sensible page addresses. For example the ‘about’ page will be at www.example.com/about/ instead of www.example.com/?p=2 (or something like that). Later, when you create the posts page, it can be at www.example.com/blog/ or /posts/ or /articles/.
There’s a pretty good explanation for changing the permalink structure at Blog Tutorials.
Create a home page
Presumably you are familiar with writing posts and pages — your site would be pretty skint without them!
The first step of creating a home page is no different from any other page. Go to Write > Page.
Give the page a suitable title, such as Homepage or Home and save the page. By default the title of the page will become the post-slug or permalink name; i.e. a page called Homepage will be found at www.example.com/homepage/. In WordPress v2.5 you can edit the permalink under the Title.
Home page content
Adding the home page content can be as easy as writing a post — if you want static (unchanging) content. This kind of page will be displayed with the standard page template, which usually looks the same as a post page (header, content, sidebar, footer).
The other option is to create a Page Template, which is a little more involved. I’ll cover a bit about this in a later post.
Once you have the content you want on the page, be sure to Publish it. You might be able to see a saved (but not published) page when you’re signed in, but others won’t.
Create a posts page
All you need to do for a posts page is Write > Page, give it a title such as Posts or Blog (whatever you want the address to be). Publish the page.
When you apply this page as the posts page it will use index.php to show the posts.
Change the settings
To activate these pages go to Settings > Reading, choose “Front page displays a static page”. Then select the pages from the two dropdown boxes.
Voila! Separate home and posts pages.
Do you have any questions? Do you want to put something on your home page, but don’t know how? Leave a comment and I’ll try to cover it in the next post.
Follow up post: Create a custom homepage in WordPress: the content.
great post!
But an FYI to pre-2.5 users, the static page as your home page is a standard feature that goes back a while and was made an admin option in version 2.1.
Thanks Jay (sotolicious)!
Yep, I suspected the static page feature had been there before, but I’d never used it. I figured I’d say 2.5 to be on the safe side. Thanks for the heads-up.
Also, if people are still using old versions I’d recommend upgrading. I’ve read stuff about security issues, but mainly the interface is way better and there are some handy features too.
NP – 2.5 is definitely worth the time and effort to upgrade to – and it’s not as involved a process as one might think.
2.5 is a nicely refined application I actually look forward to using every time I log in. I’ve developed and manage a dozen other sites, most of which use Joomla (which is a nightmare in and of itself but still better than pre WP2.5)… now I’m re-thinking future site development using the 2.5 platform for non-bloggish like design as it’s the refinements to features like the one you point out that make WP a serious CMS contender.
Have you upgraded to Joomla 1.5? The interface makes so much more sense than the 1.0 series. Unfortunately the changes were so significant I think the themes are incompatible.
I don’t use it, but I was tempted to build a site on it, until I realised that I could do it on WP and it would be much simpler to pass on to the next person who’ll run it.
I agree, WP is getting up there in functionality and versatility.
Hi Kristarella. Please let me add some more.
By choosing new ‘Home’ page as homepage, in many themes, original ‘Home’ link will likely redundant (or doubled and the new slug will be /home-2. At times confusing).
If it happens then simply find and delete this line in header.php file or something alike:
<a href=β/β>Home </a>
Hope it helps.
Oh the codes disappear π₯
Hey Robin,
Thanks for the input! Yes, you’re right – once the page becomes the homepage it’s address will just be the root of your blog. I didn’t really think of that π
I guess it’s useful to know the address of the page before you activate it as the homepage, you can make sure the page looks right.
Was there another page located at /home that you were referring to as well?
Fixed up that code – you did the right thing with the first part, but the last part was parsed (?) as html.
I would like to put an astore in my homepage and get rid of my sidebars because the width is too small. I want it to look clean like it belongs there. What do I do with the theme?
Phillip, it’s different with every theme. Looks like you’ve figured most of it out, you would just need to add
#content.widecolmn {width:100%;}to your CSS and change the iframe width to 100% as well.I pretty much covered it all in the next post as I said I would. Create a custom homepage in WordPress: the content
Hi Kristarella, thanks for the info – veryuseful indeed.
I’d like to refer back to the first comment made by Robin regarding the duplicated pages. I followed your steps explained – set up a Home page (static) and a posts pages just for the blog. I just don’t know how to get rid of the duplicated page? I’d appreciate any help you could give!
Andre — I’m not familiar with your theme, but it will probably be in header.php, there’s some code that says
<div class="nav"><ul class="menu">
Then after that there might be a home link and a wp_list_pages function. You can either edit wp_list_pages to exclude page number 2 (your home page, which WP now treats as the home page) or remove the original home link.
thanks for your response Kristarella,-
this is the code present in my header.php file:
<a href=”/”>
As you can see, it does not seem to contain the wp_list_pages function you described? sorry for the hassle, but im really stuck on this one! regards
Ok, I’m not sure where you’re navigation menu is coming from in that case, but if you just delete that whole think that says
<a href="/">Home</a>or something like that then you’ll be left with one Home and the other pages. Looks like you might have already done that?Hi Kristarella,
I got a great fix for the problem at http://www.artisteer.com/?post.....orum_id=13
“”If you want to remove the “home’ page button, you need to look at the functions.php file and find the line of code that says:
echo ‘Home‘;
If you remove that line, it will remove the default link back to the top of the wordpress site.
As always, back up your files and EDIT CAREFULLY “”
Cool huh??
I thot I’d share- maybe this will help someone elso too!!!! Thanks a lot for your help!
Hi Kristarella,
Does this process (creating separate home and blog/posts page) work in Thesis? I can’t seem to get my site to make the change. Actually, I was able to make the home page static. But when I click on the link to my posts page, it takes me to my new static home page. Any ideas?
Thank you.
Nat
Nat — Yep! It definitely works in Thesis. I have it on my test blog at the moment. You need to create the home page, the posts page, set them both in the WordPress Reading settings and then you should add the posts page to the Thesis nav menu in the options page, but not the home page, because that will become the normal home page that is already in the nav menu.
Thank you Kristarella! I figured it out. Thanks so much.
Hi
thanx for your kindness to explain to beginners like me how to do some wonderfull things with the Code, that sometimes I don’t understand at all…
I ask for your help to fix an error I did when I’ve tried to create a diferent home page: now I have de old home page named Alma Sana with a permalink http://almasanazen.com/?page_id=2, I think this belongs to Thesis default, and I can’t see the Home page on the board. Can you help me please to fix it?
Another question is, how to create an homepage only with an image and a entry link?
Thanks so much
JA
SenutnA — When you set a page as the home page it ceases to become the page at its address and is no the home page, which you seem to have acheived. You should remove that page from the navigation.
To make a different looking page on your site have a look at page templates.
Hi Kristarella
Thank you so much.
JA
On my homepage I have a sticky post at the top.
When I make a post sticky, I sometimes won’t want either a title (i.e. subject) or the line underneath it that displays: “by AuthorName on May 5, 2010[edit]:”.
In other words, I’m treating the sticky post as a sort of a note pushed to the top.
Not entering a title is simple enough, but is there any way to get rid of the author/date line *ONLY* for specific posts?
TIA
– Rosie
Rosie — I think the easiest way would be to hide it with CSS. Most themes give each post a unique ID, so you could use that to hide the byline on that post. For example, in the Thesis theme the CSS might be
#post-1081 .headline_meta {display:none;}.I am not using a static page for my homepage but would like to make a seperate blog page. Is there a way to do that?
Look forward to hearing from you,
Michelle
Michelle — I think there probably is, but I’m not sure what the best way to do it is without understanding it more. How will the blog page be different to the homepage if you don’t use another page for the homepage?