how to make, sort of products.

[wippionline]

¡Hello! Im new here, and this is my first thread, im trying to make a website with joomla 2.5 and vm 2.0.1c, for now everything is fine for me, not too dificult, but the problems start when i gotta write something in php , so im asking for help here...

How i can do that my categories appear like this: http://imgur.com/a/0mgl3
and after, clicking "ver sin foto" looks like this: http://imgur.com/UUFtl

i know i have to change my php code, and i know where too: TEMPLATE/html/com_virtuemart/category/blabla.php
but what i dont know is how to change the code to make a table, or how to make a button to show a list without images.

Can some1 help me please?

[tobisagt]

http://forum.virtuemart.net/index.php?topic=97132.msg319908#msg319908

[wippionline]

I see, i tried with the code of that page and worked fine.

But still dont know how to show my list of products on a table and instead change the weight, remove photo products with jQuery.

some more info pls? 

thank you.

[tobisagt]

Just use css! "display: none" to hide things you dont need.

My function is a bit more complicated. But here is a simple example, you can change and add what you like.

Code Select Expand


jQuery( function ($) {
        $("div.button_01").click(function(){
        $("div.browse-view").addClass("view_02").removeClass("view_01");
        });

        $("div.button_02").click(function(){
        $("div.browse-view").addClass("view_01").removeClass("view_02");
        });
});

"div.button_01" and "div.button_02" are the buttons to change the product view.
If you click "button 1" the class "view_02" is added to "div.browse-view".
If you click on "button 2" he removes the class "view_02" and adds "view_01"

Now you can change everything with your css style.

For example:



.view_02 img {
        display: none; }



Thats it.

[wippionline]

fine, i got it:

Code Select Expand

<style>
.view_02 img {
display: none; }

</style>

<script type="text/javascript">
jQuery( function($) {
$("div.click").click(function(){
$("div.browse-view").addClass("view_02");});   
$("div.click2").click(function(){
$("div.browse-view").removeClass("view_02");});   
});
</script>

<div class="click">Click</div>
<div class="click2">Click2</div>
</script>

it took 2 hours for me :S..
the next thing was to show my product categories with the products inside of a table, any hint?

thank you.

[tobisagt]

Pls explain what you mean with table?

[wippionline]

hmmmm i want to make 2 views:
1st: List products in box where they've got their photo, description, price and "details" button, i say table, because i want show the table lines beetwen each product, and give each product the same size.
2nd: List products without images and just showing the name and the price.

just like the screenshots i placed there before:

1st view: http://imgur.com/a/0mgl3
2nd view: http://imgur.com/UUFtl

here an example: http://www.pixmania.com/es/es/10753/xx/xx/1903/9/criteresn.html?dt=grid
clicking on "VISUALIZACION" you can see what i mean (At the moment i've got the "visualizacion" button, u teach me already ^^, now i need the view).

Thank you again man, im learning a lot with your little lesons , tell me if u get bored of me

P.D: Sry for me english, lot time without practice it

[tobisagt]

First go to your backend "Configuration -> Templates -> Default number of products in a row" Set the number of products you want to show per row.

For example you choose "4" it will add a class to your product "width25". 4 x 25 = 100%

Now you can style everything via css.

.view_02 .product.width25 {
     width: 100%!important; }