Wordpress Index Page & Latest Posts Page WordPress
- SOLVED
Firstly apologies to all that answered this question, [[LINK href="http://wpquestions.com/question/showLoggedIn/id/3433"]]wpquestions.com/question/showLoggedIn/id/3433[[/LINK]] - I will get this question relaunched as I still need help with it.
But see new question below...
I'm not sure what I'm looking for on google when trying to find a solution to my problem...
The basics of my problem is that I have <strong>home page</strong> and a <strong>latest news page</strong>.
Now my <strong>home page</strong> (index.php) consists of 3 WP_Query's - see below <strong>index.php</strong> code...
<?php $latest = new WP_Query('cat=4,3&showposts=3&orderby=date&order=ASC'); ?>
<?php if ( $latest->have_posts()) : while ($latest->have_posts()) : $latest->the_post(); ?>
<!-- my loop contents here -->
<?php endwhile; unset($latest); endif; ?>
<?php $feature = new WP_Query('category_name=features&orderby=date&order=ASC'); ?>
<?php if ( $feature->have_posts()) : while ($feature->have_posts()) : $feature->the_post(); ?>
<!-- my loop contents here -->
<?php endwhile; unset($feature); endif; ?>
<?php $offers = new WP_Query('category_name=offers&showposts=3&orderby=date&order=ASC'); ?>
<!-- my loop contents here -->
<?php if ( $offers->have_posts()) : while ($offers->have_posts()) : $offers->the_post(); ?>
<?php endwhile; unset($offers); endif; ?>
This is all cool, does what I need it too...
But my problem lies on the <strong>latest news page</strong>.
I need a latest new page - which will feed content from all my blog - so in theory if I was using the index.php for my latest news page, then I could use a simple loop like this...
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<!-- my loop contents here -->
<?php endwhile; ?>
<?php next_posts_link(__('« Older Entries')) ?>
<?php previous_posts_link(__('Newer Entries »')) ?>
<?php else : ?>
<?php _e('Not Found'); ?>
<?php endif; ?>
But I need a custom loop, which makes the newest post in a different style to all the other posts, see [[LINK href="http://i.imgur.com/yXCNC.png"]]image one here[[/LINK]]. As you can see in this image, the top post is the newest, and it has a different style to the 4 post below. This page will be displaying 5 posts in total.
Now see [[LINK href="http://i.imgur.com/YRNOk.png"]]image two here[[/LINK]], this is what the archive page looks like. Which is displaying 6 posts.
I don't need anyone to actually make the contents of my loop for me, just the loop itself.
See below my attempt in theory of how it needs to work... but obviously this will not lol
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<!-- my loop contents here for the single newest post only -->
<?php endwhile; ?>
<?php while (have_posts()) : the_post(); ?>
<!-- my loop contents here for the next latest 4 posts -->
<?php endwhile; ?>
<?php next_posts_link(__('« Older Entries')) ?>
<?php previous_posts_link(__('Newer Entries »')) ?>
<?php else : ?>
<?php _e('Not Found'); ?>
<?php endif; ?>
And also can someone explain where I put this code? Because I've already used my .index.php?
From previous blogs I've done, the index.php automatically shows the latest news, but I need a latest's news page that's not the landing home page, but works exactly how a index page works. Do I just use the archive page and build this custom loop into it some how?
This where I need help. Thanks
All money will only go to the person who helps the best and posts fully working code. Thanks.
Answers (4)
Sébastien | French WordpressDesigner answers:
There is a very simple solution
if you have set the number of posts by page in the administration you can simply use this code in the archive.php
<?php if (have_posts()) :
//here it's the first post
echo "<h1>";
the_title();
echo "</h1>";
the_content(); ?>
<?php while (have_posts()) : the_post();
//my loop contents here for the single newest post only
the_title();
the_content();
endwhile; ?>
<?php while (have_posts()) : the_post(); ?>
<!-- my loop contents here for the next latest 4 posts -->
<?php endwhile; ?>
<?php next_posts_link(__('« Older Entries')) ?>
<?php previous_posts_link(__('Newer Entries »')) ?>
<?php else : ?>
<?php _e('Not Found'); ?>
<?php endif; ?>
Sébastien | French WordpressDesigner comments:
i post the response here in 5 minutes :-)
Josh Cranwell comments:
cool, I wait for you...
Sébastien | French WordpressDesigner comments:
i have edit my first response
Sébastien | French WordpressDesigner comments:
and if you haven' set the number of posts, you could use a query post
so the code will be like that :
<?php
query_posts('posts_per_page=5');
if (have_posts()) :
//here it's the first post
echo "<h1>";
the_title();
echo "</h1>";
the_content(); ?>
<?php while (have_posts()) : the_post();
//my loop contents here for the single newest post only
the_title();
the_content();
endwhile; ?>
<?php while (have_posts()) : the_post(); ?>
<!-- my loop contents here for the next latest 4 posts -->
<?php endwhile; ?>
<?php next_posts_link(__('« Older Entries')) ?>
<?php previous_posts_link(__('Newer Entries »')) ?>
<?php else : ?>
<?php _e('Not Found'); ?>
<?php endif; ?>
Sébastien | French WordpressDesigner comments:
the code between "if" and "while" is only for the first post
between "while" and "endwhile" that is for the others posts
is it clear ?
Josh Cranwell comments:
hmmm I'm not sure this will work but I will try, where in the admin do you set archive post amounts? Thanks
Sébastien | French WordpressDesigner comments:
yes it works ! No problem
you can st it here : http://YOUR-SITE.com/wp-admin/options-reading.php
In my last code, there is a query post to set the number of post
Use the code you want
Hai Bui answers:
Create a new template, latest.php and put this code in it, and use it for the latest posts page:
<?php
$wp_query = new WP_Query();
$wp_query->query('posts_per_page=5'.'&paged='.$paged);
$i=0;
if ($wp_query->have_posts()) :
while ($wp_query->have_posts()) : $wp_query->the_post();
if ($paged==1 && $i==0) { ?>
<!-- loop contents here for the single newest post only in page 1 -->
<?php
}
else { ?>
<!-- my loop contents here for the next latest 4 posts in page 1 or all 5 posts in page>1-->
<?php
}
$i++;
endwhile;
?>
<?php next_posts_link(__('« Older Entries')) ?>
<?php previous_posts_link(__('Newer Entries »')) ?>
<?php
endif;
?>
Josh Cranwell comments:
Nice, so how do I get to the latest.php page?
Josh Cranwell comments:
As in, lets say Im on the home page, and I click the 'latest posts' button, what would the URL be to get to this template?
Hai Bui comments:
You have to create it. Duplicate the index.php file and rename it to latest.php, then open it to edit, enter the code I provided (replacing the loop of index.php), then upload it to the theme folder.
Hai Bui comments:
You have to create a new page for "Latest posts", and use the latest.php template for that page. Remember to put
<?php
/*
Template Name: Latest
*/
?>
at the top of latest.php
Josh Cranwell comments:
Hey Hai
I've just done all you said. But the newest post loop is not working.
I'm seeing 5 posts, which is right, but all 5 post's are using the second loop.
I've added text infront of my the_title tag, and this text is appearing on all 5 posts being displayed, so its definately using the second loop and ignoring the first.
I'm guna try Luis method below and see if his works...
Hai Bui comments:
Try this
<?php
$wp_query = new WP_Query();
$wp_query->query('posts_per_page=5'.'&paged='.$paged);
$i=0;
if ($wp_query->have_posts()) :
while ($wp_query->have_posts()) : $wp_query->the_post();
if ($paged<=1 && $i==0) { ?>
<!-- loop contents here for the single newest post only in page 1 -->
<?php
}
else { ?>
<!-- my loop contents here for the next latest 4 posts in page 1 or all 5 posts in page>1-->
<?php
}
$i++;
endwhile;
?>
<?php next_posts_link(__('« Older Entries')) ?>
<?php previous_posts_link(__('Newer Entries »')) ?>
<?php
endif;
?>
Josh Cranwell comments:
You've crack it mate!
But there is one slight issue, on the pages after page 1, its only displaying 5 posts, Can this be changed to display 6?
Currently page one looks like this... [[LINK href="http://i.imgur.com/yXCNC.png"]]Page 1[[/LINK]]
The Second Page and so forth, look like this... [[LINK href="http://i.imgur.com/KQCoA.png"]]Page 2[[/LINK]]
I need the following pages to look this... [[LINK href="http://i.imgur.com/YRNOk.png"]]Page 3[[/LINK]]
Josh Cranwell comments:
Ignore where it says page 3 above, thats meant to say page 2 again.
Thanks
Hai Bui comments:
Great. Here you go:
<?php
$wp_query = new WP_Query();
$per_page=$paged<=1?5:6;
$wp_query->query('posts_per_page='.$per_page.'&paged='.$paged);
$i=0;
if ($wp_query->have_posts()) :
while ($wp_query->have_posts()) : $wp_query->the_post();
if ($paged<=1 && $i==0) { ?>
<!-- loop contents here for the single newest post only in page 1 -->
<?php
}
else { ?>
<!-- my loop contents here for the next latest 4 posts in page 1 or all 6 posts in page>1-->
<?php
}
$i++;
endwhile;
?>
<?php next_posts_link(__('« Older Entries')) ?>
<?php previous_posts_link(__('Newer Entries »')) ?>
<?php endif; ?>
Josh Cranwell comments:
Excellent, absolutely perfect dude!!!
Money is all yours thanks very much!
Luis Abarca answers:
1.- Create a file in your template. ie. page-lastest-news.php
2.- Paste the code
3.- Create a new page in your site
4.- Select the "lastest news" template.
page-lastest-news.php
<?php
/*
Template Name: Lastest News
*/
$page = (get_query_var('page')) ? get_query_var('page') : 1;
// get all posts
query_posts('post_type=post&posts_per_page=5&paged=' . $page);
?>
<?php if (have_posts()) : $count = 0; ?>
<?php if ($count < 1 ) : $count++; ?>
<?php // you can use any format here ?>
<?php while (have_posts()) : the_post(); ?>
<!-- my loop contents here for the single newest post only -->
<?php endwhile; ?>
<?php else : ?>
<?php while (have_posts()) : the_post(); ?>
<!-- my loop contents here for the next latest 4 posts -->
<?php endwhile; ?>
<?php next_posts_link(__('« Older Entries')) ?>
<?php previous_posts_link(__('Newer Entries »')) ?>
<?php endif ?>
<?php else : ?>
<?php _e('Not Found'); ?>
<?php endif; ?>
Or this way, using just one while statement:
<?php
/*
Template Name: Lastest News
*/
$page = (get_query_var('page')) ? get_query_var('page') : 1;
// get all posts
query_posts('post_type=post&posts_per_page=5&paged=' . $page);
?>
<?php if (have_posts()) : $count = 0; ?>
<?php while (have_posts()) : the_post(); ?>
<?php if ($count < 1 ) : $count++; ?>
<?php // you can use any format here ?>
<?php else : ?>
<!-- my loop contents here for the next latest 4 posts -->
<?php endif; ?>
<?php endwhile; ?>
<?php next_posts_link(__('« Older Entries')) ?>
<?php previous_posts_link(__('Newer Entries »')) ?>
<?php else : ?>
<?php _e('Not Found'); ?>
<?php endif; ?>
Josh Cranwell comments:
I've tried your solution too, not working right either, I'm going to re-write my question with specific diagrams to help people get the jist of what i'm after. Thanks.
Luis Abarca comments:
I updated my answer, i add the posts_per_page to show only 5 posts
Ivaylo Draganov answers:
<blockquote>And also can someone explain where I put this code? Because I've already used my .index.php?</blockquote>
The index.php template is the default fallback template if others don't exist. It lies in the root of the [[LINK href="http://codex.wordpress.org/Template_Hierarchy"]]WP template hierarchy[[/LINK]]
If you are not using the so called "static front page" (set under Options > Reading) then you can create a new file in your theme called home.php and it will be loaded when your home page is opened (instead of index.php). That way you can use the index.php for your latest posts page.
Another approach is to set a static front page (a blank page without any content) and then create template files called front-page.php (for the home page) and home.php (for the latest posts).
It may seem a little comlicated :--) It took me some time to understand that too...
Ivaylo Draganov comments:
As for the loop, it's as simple as using the <em>offset</em> and <em>posts_per_page</em> parameters with <em>query_posts</em>:
<?php if (have_posts()) : ?>
<?php query_posts( 'posts_per_page=1' ); // grab only the single latest post ?>
<?php while (have_posts()) : the_post(); ?>
<!-- my loop contents here for the single newest post only -->
<?php endwhile; ?>
<?php query_posts( 'offset=1' ); // grab other posts as usual offset by one ?>
<?php while (have_posts()) : the_post(); ?>
<!-- my loop contents here for the next latest 4 posts -->
<?php endwhile; ?>
<?php next_posts_link(__('« Older Entries')) ?>
<?php previous_posts_link(__('Newer Entries »')) ?>
<?php else : ?>
<?php _e('Not Found'); ?>
<?php endif; ?>
Ivaylo Draganov comments:
My advice on template files is to get rid of <em>archive.php</em> and use <em>index.php</em> instead of it (assuming you've created at least home.php).
Template hierarchy is an important concept in WP, so it's not a bad idea to get familiar with it :--)
Josh Cranwell comments:
Thanks for taking the time to explain this Lvaylo - I am trying to get familiar with it always so your advice is great.
But Hai Bui helped me solve it, but obviously my pagination is now...
...mysite.com/latest/
...mysite.com/latest/page2 and so fourth
-----------
But lets say I use your solution, and use my index for my archive page. And set in the admin to use home.php as my landing page...
Then how will I navigate to my archives via a URL?
For example <a href="" title="Latest Posts">Latest Posts</a>
And also, how would my get_archives work? Would that automatically use the index template?
Thanks
Ivaylo Draganov comments:
<blockquote>Then how will I navigate to my archives via a URL?</blockquote>
Please tell me what URL structure you'd like to have.
<blockquote>And also, how would my get_archives work? Would that automatically use the index template?</blockquote>
Do you mean wp_get_archives()?
Josh Cranwell comments:
Yeah I do mean wp_get_archives, but i just check the structure of the URL when a month is clicked...
mysite.com/2011/12
I understand what you mean by your method i think.
In an ideal world, I would like to use the home.php for my home page and the index.php for my latest news.
So this would be the url for the home page...
mysite.com/
..right?
Then what would the path be for the latest news by default, using the index.php?
Thanks
Ivaylo Draganov comments:
Aright, in order to have a separate home page and a latest posts page you should:
1) create two empty pages ("Pages > Add New") - one to be used as homepage and the other one as latest posts page
2) set "Static front page" and "Posts page" (under "Options > Reading") to the newly created pages
3) create the two template files - front-page.php (for the homepage) and home.php(for the latest posts)
4) your homepage will be available under yoursite.com/ and the posts page under whatever slug you set for the page (for example yoursite.com/latest)
The URLs that wp_get_archives() points to will use the first available template file from [[LINK href="http://codex.wordpress.org/Template_Hierarchy#Date_display"]]this hierarchy[[/LINK]]:
1. date.php (rarely used in themes)
2. archive.php
3. index.php
So if you have the setup with <em>home.php</em> + <em>front-page.php</em>, your <em>index.php</em> will be free to use in place of <em>archive.php</em>. But if you are happy with <em>archive.php</em> then keep it :--)
Josh Cranwell comments:
Thank you very much Ivaylo, this makes good sense and is good to know this. Thanks very much for help!!! Take care