putting the box content in the homepage

Hi,

how can I add the what'snew, offers, and featured products boxes in the home page only.

This is the site
afzdesign dot com/ cadante/index.php?main_page=index

and this is an example
www. carlolotti. com

Thank you

V 1.39h

Thee are settings in Admin - Configuration - Index Listing.

Thank you, I had that set, I meant to put them in a 3 column display - categories - new - featured - like the sample site, or leaving the categories how they are, and moving the new, and featured in the top right.

For a start on this, add to your stylesheet```
#indexCategoriesMainContent, .categoryListBoxContents {width: 48% !important; float: left; clear: left;}
.categoryListBoxContents+.clearBoth, .centerBoxContentsNew+.clearBoth, .centerBoxContentsFeatured+.clearBoth {display: none;}
#whatsNew, #featuredProducts {width: 48%; float: right; clear: right;}

There is still something that is preventing the right floats from rising all the way up as they should; you may need to eliminate various <br class="clearBoth" /> from your files, as they seem to be leaving ghosts even though set to display: none.

You can use Categories Dressing on the categories sidebox in the left column, with "category groups" styled with individual headings to look like the navigation in the sample site.

Thanks gjh42, I tried the css solution, and besides the <br class="clearBoth" />, which I don't know which files to look in, the main issue is it applies to the other pages as well, whereas I need to have it only on the homepage.

I am not sure I understand your second solution: on the sample site the 3 columns are Enoteca (winery - the shop), In vetrina (featured), Offerte (offers), the Winery has the categories; my understanding of Categories Dressing is it applies to the category box, please correct me if I am wrong.

Yes, Categories Dressing applies to the categories sidebox. You can make that look almost exactly like your example using Cat Dressing, including the separate "boxes" for the groups of categories.

To make the CSS rules apply only to the homepage, add #indexHomeBody to the selectors:```
#indexHomeBody #indexCategoriesMainContent, #indexHomeBody .categoryListBoxContents {width: 48% !important; float: left; clear: left;}
#indexHomeBody .categoryListBoxContents+.clearBoth, #indexHomeBody .centerBoxContentsNew+.clearBoth, #indexHomeBody .centerBoxContentsFeatured+.clearBoth {display: none;}
#indexHomeBody #whatsNew, #indexHomeBody #featuredProducts {width: 48%; float: right; clear: right;}

Thanks, I'm not sure I understand how to make the fetaured, and new boxes be categories, but I'll try it, and in case post back.

The featured and new boxes will not be categories, nor in the left column. That is not what you asked for; what you asked for (the example site) has categories in separate boxes in the left column, and featured and new in the center/right.

To get the example layout, you need to turn on the left column and enable the categories sidebox for it, then apply Categories Dressing.

I apologize for having created the confusion not being too clear. Which led to your suggestion for Category Dressing, and my further confusion in not understanding the suggestion.

What I meant is that I needed to move the new, and featured either up to the right in the blank space above the 4 category cells, or displaying the 3 boxes (catehories, new, featured) in the 3 column view like the sample site, the category box, as it is either in home page, or in the other pages is ok as is.

At this point I just need to work on your stylesheet suggestion, and play with it till I get it right.

There is still something that is preventing the right floats from rising all the way up as they should; you may need to eliminate various <br class="clearBoth" /> from your files, as they seem to be leaving ghosts even though set to display: none.

Will you please address me to which files I should look into?

Thank you.

It occurs to me that you may be wanting the category listing to show in the left column, not a categories menu or set of menus. Do you want just a set of the top categories in the left, and only on the home page? If you put the category listing in the left, Categories Dressing does not apply.Try this in your stylesheet:```
#indexHomeBody #indexCategoriesMainContent, #indexHomeBody .categoryListBoxContents {width: 32% !important; float: left; clear: left;}
#indexHomeBody .categoryListBoxContents+.clearBoth, #indexHomeBody .centerBoxContentsNew+.clearBoth, #indexHomeBody .centerBoxContentsFeatured+.clearBoth {clear: none;}
#indexHomeBody #whatsNew, #indexHomeBody #featuredProducts {width: 32%; float: right; margin-left: 1.2em;}

Look in /includes/templates/your_template/common/tpl_columnar_display.php for the <br class="clearBoth" /> to eliminate. Note that this file is used by several other displays, and just deleting code will affect places you don't want to affect. You need a conditional test. Add these two lines as shown:

    if (!$this_is_home_page) { //add test for homepage

    } //close homepage test
```php
    <?php echo '<div' . $r_params . '>' . $list_box_contents[$row][$col]['text'] .  '</div>' . "\n"; ?>
<?php
      }
    }
    if (!$this_is_home_page) { //add test for homepage
?>
<br class="clearBoth" />
<?php
    } //close homepage test
  }
}
?> 

Thank you, I really appreciate your patience.

I tried the tpl_columnar_display.php mod, but it messed up the category listing page, meaning, when I clicked on the "wines" the page displayed would be messed up.
I'm not a coder, but in the php code you suggested when I delete <br class="clearBoth" /> isn't it deleted for the other condition as well, I mean doesn't the code say:
do this, and that, then <br class="clearBoth" />, and if homepage do this, and that w/o the <br class="clearBoth" />?
In other words shouldn't I have the <br class="clearBoth" /> somewhere in the code for the condition where it is not homepage?

I came up with this solution, will you please tell me if it is feasible?
It looks ok in FF, IE8, and Chrome - I added a margin-top to your css rules, and specifically

#indexHomeBody #whatsNew, #indexHomeBody #featuredProducts {
width: 32%;
float: right;
margin-left: 1.2em;
margin-top: -493px;
}

To be precise the solution works for a 1280x960 resolution, and it's not ideaql for 1024x768, or less.

That margin-top only works correctly if you know exactly what the height of the left content is going to be. It would work for a fixed width page and non-variable content in the left, but not otherwise.

The code given would have tpl_columnar_display.php output a row of categories, then if not homepage, output the <br class="clearBoth" />; if on the homepage, skip it and output the next row of categories.
What exactly did your version look like when it was messing up the display?

If by left content you mean the categories (wines etc.) being only those 4 categories, I'd guess the height won't change.

I tried duplicating the messed up page, but now it displays correctly, I thought I had misplaced the code in the tpl_columnar_display.php so I tried a couple of "misplacing", and it is either ok, or no page display at all, nothing close to the problem I encountered yesterday.

Anyhow I attach the screenshots of different configs I tried so you can perhaps spot the problem, like case 4 where the images in the new products don't always stay in the grid 3x3, when I refresh the page sometimes they do, sometimes they don't.
Without the negative margin the boxes stay down even with the conditional tpl_columnar_dispaly.php file.

case 1 - homepage with the negative margin

case 2 - homepage with negative margin, and max images for the new products set to 6 - the featured overlaps the new box

case 3 - homepage with tpl_columnar_display.php with negative margin

case 4 - homepage with tpl_columnar_display.php and no negative margin

I have it solved. The right-floated columns were moving up to the top of the previous left-floated element only, not the whole stack of left-floated elements.
To fix this, the categories need to be wrapped so that only one element in the page flow is left-floated.
Edit /includes/templates/your_template/templates/tpl_index_categories.php; find this```php
/**

• require the code to display the sub-categories-grid, if any exist
  */
  require($template->get_template_dir('tpl_modules_category_row.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_category_row.php');
  }
  ?>

?>
<div id="categoryList">
<?php

</div>

to get```php
/**
 * require the code to display the sub-categories-grid, if any exist
 */
?>
<div id="categoryList">
<?php
   require($template->get_template_dir('tpl_modules_category_row.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_category_row.php');
  }
?>
</div>
<!-- EOF: Display grid of available sub-categories -->

Then change the stylesheet section to look like this:

/* regole per spostare new, e featured in alto alla home */
#indexHomeBody #indexCategoriesMainContent, #indexHomeBody #categoryList {
    width: 32% !important;
    float: left;
    clear: left;
    }

#indexHomeBody .categoryListBoxContents {width: 99%!important;}

#indexHomeBody .categoryListBoxContents+.clearBoth, #indexHomeBody .centerBoxContentsNew+.clearBoth, #indexHomeBody .centerBoxContentsFeatured+.clearBoth {
clear: none;
}
#indexHomeBody #whatsNew, #indexHomeBody #featuredProducts {
width: 32%;
float: right;
margin-left: 1.2em;
/*margin-top: -493px;*/
}
/* END regole per spostare new, e featured in alto alla home */
/*

Thank you very much.

Could you please tell me why the new products sometimes displays like case 3 of my previous post?

I tried to set the width to 32% in modules/my_template/new_products.php at line 71
$list_box_contents[$row][$col] = array('params' => 'class="centerBoxContentsNew centeredContent back"' . ' ' . 'style="width:32%"',
but it didn't help.

That's what the <br class="clearBoth" /> is intended to prevent. Floated elements can "hang up" on an element above while trying to slide over, if the elements above are different heights.

You may be able to eliminate the customized tpl_columnar_display.php, or you may need a tweak to tpl_columnar_display.php to limit its modification to only the categories.

    <?php echo '<div' . $r_params . '>' . $list_box_contents[$row][$col]['text'] .  '</div>' . "\n"; ?>
<?php
      }
    }
    if (!$this_is_home_page or (strpos($list_box_contents[$row][$col]['params'], 'categoryListBoxContents') < 1)) { //add test for homepage
?>
<br class="clearBoth" />
<?php
    } //close homepage test
  }
}
?>

(strpos($list_box_contents[$row][$col]['params'], 'categoryListBoxContents') < 1)

means that categoryListBoxContents is not in the output, so it is not the category list that is being handled (and thus the <br> should be used).

Thank you.

I tried both solutions (deleted the tpl_columnar_display.php, and modified it with the code) but in both cases the issue is there, it does so randomly, meaning when I refresh sometimes they are in a 3x3 fashion, and other times in a disoredered way.

Can you try a debug test? Change this code```php
}
if (!$this_is_home_page or (strpos($list_box_contents[$row][$col]['params'], 'categoryListBoxContents') < 1)) { //add test for homepage
?>

to this```php
    }
echo $row . $col . '=' . strpos($list_box_contents[$row][$col]['params'], 'categoryListBoxContents');//debug
    if (!$this_is_home_page or (strpos($list_box_contents[$row][$col]['params'], 'categoryListBoxContents') < 1)) { //add test for homepage
?>