Related Product in VirtueMart is great but It can break the layout of your design. I am not talking about the module - you have full control over the module - I am talking about the  Related Proructs that display at the bottom of a product!

You see the items expanded beyond the contents area and reached the sidebar on the right. I spent hours trying to figure where to control it from the administration panel without any success! I even downloaded the user manual but failed to find anything can fix it!

So, a new hack journy began VirtueMart URLs helps you to understand where you should start :

index.php?page=shop.product_details&flypage=flypage.tpl

So, the code that control the layout of this page is located on:

administrator/components/com_virtuemart/html/shop.product_details.php

This line control how many items you would like to display:

It's set to 4. You can decrease the number to be 2 and the layout will be fixed! but thats not a practical solution! Says you want to display the 4 related products or even more!

There is another line display where exactly is the code for the Related Products part :

You can find it on the template folder:

components/com_virtuemart/themes/default/templates/common/relatedProducts.tpl.php

The while loop create a for each new item. We need to modify this to end the row and start a new one when it reach the maximum value we specify. So, we set a new variable and call it $relatedproductcount and give it the number of maximum items per row. Using an if statement and an iterator we can edit the code to be like :

You can see the results here

I don't really like modifying the core files and I belive what we did here is vital and should be controlled via the administration panel. I hope to see this in the future.

Note: I used VirtueMart version 1.1 I didnt test it on previous versions.

Thanks for reading!

Source: http://www.alfystudio.com/blog/47-virtuemart-and-related-products.html