Display category with respective products in ul-li style

[faiqnaseem]

How i can list the categories with there respective products in this fashion

<ul>
<li><?php echo $this->category->category_name; ?></li>
<li><?php echo JHTML::link ($product->link, $product->product_name); ?></li>
....
</ul>

must be in loop

[bytelord]

Hello,

You have to create a template override for the file joomla_folder\components\com_virtuemart\views\category\tmpl\default.php. To create a template override just copy that file inside your_joomla_folder\templates\your_joomla_template\html\com_virtuemart\category\default.php

Then you must have some html, php, css knowledge to edit this file and change the style you need from div to ul/li or create two style using javascipt and each time change this by create a grid/list view option. The product module already have an option to use ul/ui instead of div.

You could find some more examples on that on the vm forum, like:
About grid list you can find here an example for grid/list view example http://forum.virtuemart.net/index.php?topic=97132.0
http://forum.virtuemart.net/index.php?topic=106119.0


Use firebug to examine you site code and css styling: https://forum.virtuemart.net/index.php?topic=102850.0
Creating Template overrides: https://forum.virtuemart.net/index.php?topic=98505.0
Template System: https://dev.virtuemart.net/projects/virtuemart/wiki/Hints_for_the_use_of_the_template_system

Regards

[faiqnaseem]

Dear,

i am done with the overide things,just stopped on how to display all the products of the same category.Eg  i am in category 1 page then in my design i have to show all the products of category1.How to do this

[bytelord]

Hello,

Study the file ... you will see that around line 233 the is the start  of "Show Products" of the selected category you are viewing ... so edit those lines from line 233 until line 312 and make the changes you need (ul/ui) ...
So your template will be ready after that for all your categories when one of the selected and search also. That code will affect all the category view.

Regards

[faiqnaseem]

thanks,problem solved

[bytelord]

Nice,

You could share you solution for other users that may be need it also.

Thanks

[faiqnaseem]

<?php
   // Category and Columns Counter
   $iBrowseCol = 1;
   $iBrowseProduct = 1;

   // Calculating Products Per Row
   $BrowseProducts_per_row = $this->perRow;
   $Browsecellwidth = ' width' . floor (100 / $BrowseProducts_per_row);

   // Separator
   $verticalseparator = " vertical-separator";

   // Count products ?? why not just count ($this->products)  ?? note by Max Milbers
   $BrowseTotalProducts = 0;
   foreach ($this->products as $product) {
      $BrowseTotalProducts++;
   }

   // Start the Output
   foreach ($this->products as $product) {

      // Show the horizontal seperator
      if ($iBrowseCol == 1 && $iBrowseProduct > $BrowseProducts_per_row) {
         ?>
   <div class="horizontal-separator"></div>
         <?php
      }

      // this is an indicator wether a row needs to be opened or not
      if ($iBrowseCol == 1) {
         ?>
   <div class="row">
   <?php
      }

      // Show the vertical seperator
      if ($iBrowseProduct == $BrowseProducts_per_row or $iBrowseProduct % $BrowseProducts_per_row == 0) {
         $show_vertical_separator = ' ';
      } else {
         $show_vertical_separator = $verticalseparator;
      }

      // Show Products
      ?>


<ul>
<li><?php echo JHTML::link ($product->link, $product->product_name); ?></li>
</ul>


</div>
<?php
}

?>

It will be print the current category products in ul-li style