Simple layout for product listing page

Hello,

I am trying to change the layout of my product listing page:
www.pssgpcshop.com/index.php?option=com_...t=listing&Itemid=624

I want to created a product listing page that has no images and shows the product name, decription and price with a buy now button for each product.

I have a page written in html with a layout I am shooting for scroll down the page to see the product layout:

www.pssgpcshop.com/index.php/columns/78-...mns/189-gram-columns

How can I replicate this in HikaShop? Everything I try in the page option does not seem to take effect...

Hi,

If you don't see the changes, it means that you don't change the options at the correct place.

Go in the menu Display->Content modules, edit the module with the id 142. There you will have the options of your products listing.
Looking at your example page, I would recommend to change the layout to "table" and that should already help a lot.

Thank you, I was able to change the layout.

www.pssgpcshop.com/index.php?option=com_...t=listing&Itemid=624

Is there a way to remove the "Image" column and add a description column?

Thank you!

You can add such CSS for that:

.hikashop_product_image_row, .hikashop_product_image{ display: none; }

Hello,
I copied that exact CSS line in to both the front end css and back end css and the image row still appears.


Also, how can I add the description to the table view?

Thank you!

Hi,

1. I tried the CSS code that nicolas gave you by using firebug, and it seems to be working fine, are you adding this CSS code through the "Front-end CSS File" option of the page "Hikashop->System->Configuration->Display->'CSS tab'" ?

2. Regarding the description, I think that you'll be able to do it by editing the code of your "listing_table" file of your "product" view of your front-end template. You'll probably find some answer there :

If you want to display the product description, you will have to edit the file listing_table via the menu Display->Views and add the code:
echo $this->row->product_description;

after the code:
echo $this->row->product_name;

Thank you, I was able to hide the image columns.

Regarding the description though it appears to add the description to the same column as the product name. Is there a way to have separate columns one for product name and one for description?

Sure, You'll have to add this code : after this : and add this code : after this :

Thank you so much! Works great.

Last question. Is it possible to change the width of the columns? My product name column is much wider than it needs to be and I would like to expand the description columns.

Thank you

H there,

The listing table is already using a 100% width so if you want it to be bigger you'll need to edit your template.
The table currently fit the central position, make this part of your template bigger and the width of the table will go with it.