Correct HTML Structure inside PHP IF Condition - php

Question

This is my modified Wordpress loop w/ PHP If and Else Condition code.
<?php if (have_posts()) : ?>
<?php
$i = 1;
while (have_posts()) {
the_post();
if ($i <= 1) {
echo '<div class="firstp">';
echo '<a href="'; the_permalink(); echo '"'; echo 'alt="'; the_title(); echo '"'; echo 'title="'; the_title(); echo '">';
the_post_thumbnail('article-oneimg', array( 'id' => "article-oneimg"));
echo '</a>';
echo '<div class="thedate1">';
the_date();
echo '</div>';
echo '<h1><a href="'; the_permalink(); echo '"'; echo 'alt="'; the_title(); echo '"'; echo 'title="'; the_title(); echo '">';;
the_title();
echo '</a></h1>';
echo '<p>';
the_excerpt();
echo '</p>';
echo '</div>';
} elseif ($i <= 10) {
echo '<div class="HOLDER-OF-secondp">';
include "secondp.php";
echo '</div>';
} else {
// There should be a bunch of HTML mixed in here too
the_title();
}
$i++;
}
?>
<?php else : ?>
<h2>No Posts Found</h2>
<?php endif; ?>
secondp.php contains this code:
<div class="secondp">
<a href="<?php the_permalink() ?>" alt="<?php the_title(); ?>" title="<?php the_title(); ?>">
<?php the_post_thumbnail('article-twoimg', array( 'id' => "article-twoimg")); ?>
</a>
<div class="thedate2">
<?php the_date(); ?>
</div>
<h1>
<?php the_title(); ?>
</h1>
</div>
What I'm trying to do here is just to add a holder/container of the secondp.php since it has several posts. But every time I use an echo '<div class="HOLDER-OF-secondp">'; before & after the include "second.php"; this happens (see image below taken using Firebug.)
What's wrong with the HTML structure inside the PHP IF condition? I trying to achieve is to put a container that holds all the divs class secondp.
In simple HTML, it's something like this:
<div class="holderofsecondp">
<div class="secondp">
a href="<?php the_permalink() ?>" alt="<?php the_title(); ?>" title="<?php the_title(); ?>">
<?php the_post_thumbnail('article-twoimg', array( 'id' => "article-twoimg")); ?>
</a>
<div class="thedate2">
<?php the_date(); ?>
</div>
<h1>
<?php the_title(); ?>
</h1>
</div>
</div>

Answer 1

Try this code:-
<?php global $wp_query;?>
<?php if (have_posts()) : ?>
<?php
$i = 1;
$start_hoder = true
$total_posts = $wp_query->found_posts;
while (have_posts())
{
the_post();
if ($i <= 1) {
echo '<div class="firstp">';
echo '<a href="'; the_permalink(); echo '"'; echo 'alt="'; the_title(); echo '"'; echo 'title="'; the_title(); echo '">';
the_post_thumbnail('article-oneimg', array( 'id' => "article-oneimg"));
echo '</a>';
echo '<div class="thedate1">';
the_date();
echo '</div>';
echo '<h1><a href="'; the_permalink(); echo '"'; echo 'alt="'; the_title(); echo '"'; echo 'title="'; the_title(); echo '">';;
the_title();
echo '</a></h1>';
echo '<p>';
the_excerpt();
echo '</p>';
echo '</div>';
} elseif ($i <= 10) {
if($start_hoder)
{
echo '<div class="HOLDER-OF-secondp">';
$start_hoder = false;
}
include "secondp.php";
if($total_posts == $i && $start_hoder == false)
{
echo '</div>';
}
} else {
// There should be a bunch of HTML mixed in here too
the_title();
}
$i++;
}
?>
<?php else : ?>
<h2>No Posts Found</h2>
<?php endif; ?>
May be this will help you to get your expected output.

Answer 2

Looks like you have a loop, an inside your loop you are repeatedly echoing the holder. You want to rearrange your code to not have the holder inside the loop.

Answer 3

<div class="holderofsecondp">
<?php while (have_posts()) { ?>
<div class="secondp"></div>
<div class="secondp"></div>
<div class="secondp"></div>
<div class="secondp"></div>
<div class="secondp"></div>
<div class="secondp"></div>
<div class="secondp"></div>
<?php } ?>
</div>
<div class="holderofsecondp"> this will be always out of the loop
or in your code Do this
<?php if($i==0) {?> <div class="HOLDER-OF-secondp"><?php } ?>
and add the div out of loop but its not good idea . Let me know if you need more help .