Displaying Posts Outside WP Differently

  • Resolved Y2Neildotcom

    (@y2neildotcom)


    15 years, 10 months ago

    Hi folks,

    I’m trying to create a site for my girlfriends football team, I am using WP to write all the news items.

    I have an index page (pershoreladies.y2neil.com) which I use to display the latest three posts from the blog using the code:

    <?php
// Include WordPress
define('WP_USE_THEMES', false);
require('./blog/wp-blog-header.php');
query_posts('showposts=3');
?>

    This calls the blog and means I can display the latest three posts on my page by using WP code.

    My question is, how can I format each post differently. For example, I want the first post to be large and prominent with the second and third posts smaller. Its been suggested that I use a counter variable that increments everytime I go through the loop, but honestly I don’t understand what that means.

    Many thanks for your help,

    Neil

Viewing 7 replies - 1 through 7 (of 7 total)

  • Can you post the code that follows the above, namingly the WP loop…

    Myself or someone else can write a few lines for you to add..

    Thread Starter Y2Neildotcom

    (@y2neildotcom)

    Certainly, the following is what I use to call the posts. Try to ignore the mess.

    <?php while (have_posts()): the_post(); ?></b>

              <h3><b><?php the_title(); ?></b></h3> by <?php the_author(); ?>

            <span class="style6 style2">
            <?php the_excerpt(); ?>
            </span>
            <p class="style6 style2" align="right"><a href="<?php the_permalink(); ?>">Read more...</a>

            <span class="style6 style2">

              <?php endwhile; ?>

            <p align="left"><a href="archives.php"><< Older Posts</a>

    Many thanks,

    Ok, well it’s only the while loop i needed to see.

    I’ll just mention firstly, there’s some invalid markup, so i’ve corrected that in this example… (if i can explain further if you like).

    <?php while (have_posts()): the_post(); $postnum = 1; ?>
	<div <?php if($postnum == 1) : echo 'class="main_post"'; else : echo 'class="following_post"'; endif; ?>">
		<h3 style="font-weight:bold"><?php the_title(); ?></h3>
		by <?php the_author(); ?>

		<span class="style6 style2"><?php the_excerpt(); ?></span>

		<p class="style6 style2" align="right">
			<a href="<?php the_permalink(); ?>">Read more...</a>
		</p>
	</div>
<?php if($postnum == 1) echo '<div style="clear:both"></div>'; ?>
<?php $postnum++; ?>
<?php endwhile; ?>

    You’d need to accompany that with a little CSS…

    In the example above… you have 3 posts…

    [ post 1 ] – has the class “main_post”
    [ post 2 ] – has the class “following_post”
    [ post 3 ] – has the class “following_post”

    Of course you can change the names to what you like, just modify the code as you like…

    Here’s some example CSS though…

    .main_post {
  width:100%;
  background-color:#fff;
}
.following_post {
  float:left;
  width:auto;
}

    You’ll need to make it work visually by fiddling with the CSS (as that’s totally untested)…

    The PHP is very simple itself, but i imagine that’s where you primarily wanted the help.

    If you need further help, just post back..

    Thread Starter Y2Neildotcom

    (@y2neildotcom)

    That’s fantastic, I’ll have a tinker with the CSS and give it a go.

    Thank you for your help!

    You’re welcome… ??

    Thread Starter Y2Neildotcom

    (@y2neildotcom)

    Hello again,

    Turns out, I’m rubbish.

    The code wasn’t displaying the posts as I would expect so I threw an echo $postnum in there and all the posts are being numbered as post 1 meaning they’re displaying the same CSS.

    How do I increment the postnum for the following two posts?

    Many thanks,

    This part…

    <?php $postnum++; ?>

    Increments the postnum after each post, so that should be increasing with each post…

    Try changing that for…

    <?php $postnum = $postnum+1; ?>

    It shouldn’t make a difference though..

    Perhaps this line is being a problem..

    <?php if($postnum == 1) echo '<div style="clear:both"></div>'; ?>

    Could also try changing that for..

    <?php if($postnum == 1) { echo '<div style="clear:both"></div>'; } ?>

    If you’re still stuck after that i’ll test some code, but i’ve done this kinda thing lots of times and i can’t see an issue with the above..

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Displaying Posts Outside WP Differently’ is closed to new replies.