Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
  • #1112

    I have a page I am working on for a client and we were wanting to use 6 info boxes on the main page instead of 3. – you can see the site and problem that keeps arising here.

    Any idea what I did wrong or whats causing this to happen?



    This is happening because the content boxes are set to float left without a clear after the third box. The text in the 1st box is greater than the 2nd box so the 4th box uses the 2nd as the marker to appear.

    It’s easy to fix, add this HTML to index.php after the 3rd box:

    <div class="clearboth"></div>



    thanks for the reply! I added the code and it didnt change anything. I am using “posts” to display the front page content, and I adjusted the code to show 6 posts, instead of three -> $query_string .= “&showposts=6”;

    Do I need to make any other changes, or use an HTML page instead for the home page content?


    I went in and edited the text from box 1 and it fixes the issue however I would like to be able to have unlimited content in the boxes and this not be a problem.



    I assume you simply changed:

    $query_string .= "&showposts=3";


    $query_string .= "&showposts=6";


    If so, you can add conditional code which uses the counter function (already present in index.php) and add this code:

    <?php if ($counter == '4') echo '<div class="clearboth"></div>'; ?>

    immediately under:

    <div class="info_box box<?php echo $counter; $counter++; ?>">
    <div class="box_image"><img src='<?php echo $preview_pic_mainpage; $preview_pic_mainpage =''; ?>' alt="" /></div>
    <span class="meta"><?php echo $punchline; $punchline='';?></span>
    <h2><?php the_title(); ?></h2>
    <?php the_content('Read more'); ?>
    <?php edit_post_link('Edit','', '' ); ?>

    Note: I chose counter = 4 because the count is increased by 1 in the existing code just after the $counter class is added, if I had chosen 3 it would appear after the 2nd (middle) column.

    Let me know how you get on :)



    I am revisiting this post. We have never used more than 5 boxes and now we are adding to my customers site and need the 6th box. For some reason the 6th box appears on the 3rd line. Please help.


    In style.css change:

    #top .box3{


    #top .box3, #top .box6{


    thanks alot! works perfect


    Glad that I could help you :)

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

The topic ‘CUBIT FRONTPAGE – 6 INFO BOXES’ is closed to new replies.