[Skip to main content](#vessel-content)

#   Simple layout for product listing page

##

- **[mank087](/forum/user/21968-mank087 "View mank087's Profile")**
- [![mank087's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/21968-mank087 "View mank087's Profile") Topic Author
- [ Offline](/forum/user/21968-mank087)

Less More

- Posts: 46
- Thank you received: 0
-
-

13 years 3 months ago [\#111671](#111671) by [mank087](/forum/user/21968-mank087 "View mank087's Profile")  *[Simple layout for product listing page](/forum/4-how-to/84404-simple-layout-for-product-listing-page#111671 "Hello,  I am trying to change the layout of my product listing page:   www.pssgpcshop.com/index.php?option=com&#95;...t=listing&amp;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...")* was created by *[mank087](/forum/user/21968-mank087 "View mank087's Profile")*

Hello,

I am trying to change the layout of my product listing page:
[ www.pssgpcshop.com/index.php?option=com\_...t=listing&amp;Itemid=624](http://www.pssgpcshop.com/index.php?option=com_hikashop&view=category&layout=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](http://www.pssgpcshop.com/index.php/columns/78-columns/189-gram-columns)

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

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzQtaG93LXRvLzg0NDA0LXNpbXBsZS1sYXlvdXQtZm9yLXByb2R1Y3QtbGlzdGluZy1wYWdlP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[nicolas](/forum/user/63-nicolas "View nicolas's Profile")**
- [![nicolas's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar63.png)](/forum/user/63-nicolas "View nicolas's Profile")
- [ Away](/forum/user/63-nicolas)

Less More

- Posts: 86290
- Thank you received: 14269
-
-

13 years 3 months ago [\#111678](#111678) by [nicolas](/forum/user/63-nicolas "View nicolas's Profile")  Replied by *[nicolas](/forum/user/63-nicolas "View nicolas's Profile")* on topic *[Simple layout for product listing page](/forum/4-how-to/84404-simple-layout-for-product-listing-page#111678 "Hello,  I am trying to change the layout of my product listing page:   www.pssgpcshop.com/index.php?option=com&#95;...t=listing&amp;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-&gt;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.

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzQtaG93LXRvLzg0NDA0LXNpbXBsZS1sYXlvdXQtZm9yLXByb2R1Y3QtbGlzdGluZy1wYWdlP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[mank087](/forum/user/21968-mank087 "View mank087's Profile")**
- [![mank087's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/21968-mank087 "View mank087's Profile") Topic Author
- [ Offline](/forum/user/21968-mank087)

Less More

- Posts: 46
- Thank you received: 0
-
-

13 years 3 months ago [\#111813](#111813) by [mank087](/forum/user/21968-mank087 "View mank087's Profile")  Replied by *[mank087](/forum/user/21968-mank087 "View mank087's Profile")* on topic *[Simple layout for product listing page](/forum/4-how-to/84404-simple-layout-for-product-listing-page#111813 "Hello,  I am trying to change the layout of my product listing page:   www.pssgpcshop.com/index.php?option=com&#95;...t=listing&amp;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...")*

Thank you, I was able to change the layout.

[ www.pssgpcshop.com/index.php?option=com\_...t=listing&amp;Itemid=624](http://www.pssgpcshop.com/index.php?option=com_hikashop&view=category&layout=listing&Itemid=624)

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

Thank you!

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzQtaG93LXRvLzg0NDA0LXNpbXBsZS1sYXlvdXQtZm9yLXByb2R1Y3QtbGlzdGluZy1wYWdlP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[nicolas](/forum/user/63-nicolas "View nicolas's Profile")**
- [![nicolas's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar63.png)](/forum/user/63-nicolas "View nicolas's Profile")
- [ Away](/forum/user/63-nicolas)

Less More

- Posts: 86290
- Thank you received: 14269
-
-

13 years 3 months ago [\#111837](#111837) by [nicolas](/forum/user/63-nicolas "View nicolas's Profile")  Replied by *[nicolas](/forum/user/63-nicolas "View nicolas's Profile")* on topic *[Simple layout for product listing page](/forum/4-how-to/84404-simple-layout-for-product-listing-page#111837 "Hello,  I am trying to change the layout of my product listing page:   www.pssgpcshop.com/index.php?option=com&#95;...t=listing&amp;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...")*

You can add such CSS for that:

.hikashop_product_image_row, .hikashop_product_image{ display: none; }

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzQtaG93LXRvLzg0NDA0LXNpbXBsZS1sYXlvdXQtZm9yLXByb2R1Y3QtbGlzdGluZy1wYWdlP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[mank087](/forum/user/21968-mank087 "View mank087's Profile")**
- [![mank087's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/21968-mank087 "View mank087's Profile") Topic Author
- [ Offline](/forum/user/21968-mank087)

Less More

- Posts: 46
- Thank you received: 0
-
-

13 years 3 months ago [\#112676](#112676) by [mank087](/forum/user/21968-mank087 "View mank087's Profile")  Replied by *[mank087](/forum/user/21968-mank087 "View mank087's Profile")* on topic *[Simple layout for product listing page](/forum/4-how-to/84404-simple-layout-for-product-listing-page#112676 "Hello,  I am trying to change the layout of my product listing page:   www.pssgpcshop.com/index.php?option=com&#95;...t=listing&amp;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...")*

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!

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzQtaG93LXRvLzg0NDA0LXNpbXBsZS1sYXlvdXQtZm9yLXByb2R1Y3QtbGlzdGluZy1wYWdlP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[Mohamed Thelji](/forum/user/6861-mohamed-thelji "View Mohamed Thelji's Profile")**
- [![Mohamed Thelji's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar6861.png)](/forum/user/6861-mohamed-thelji "View Mohamed Thelji's Profile")
- [ Offline](/forum/user/6861-mohamed-thelji)

Less More

- Posts: 12953
- Thank you received: 1778
-
-
-

13 years 3 months ago -  13 years 3 months ago [\#112687](#112687) by [Mohamed Thelji](/forum/user/6861-mohamed-thelji "View Mohamed Thelji's Profile")  Replied by *[Mohamed Thelji](/forum/user/6861-mohamed-thelji "View Mohamed Thelji's Profile")* on topic *[Simple layout for product listing page](/forum/4-how-to/84404-simple-layout-for-product-listing-page#112687 "Hello,  I am trying to change the layout of my product listing page:   www.pssgpcshop.com/index.php?option=com&#95;...t=listing&amp;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,

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-&gt;System-&gt;Configuration-&gt;Display-&gt;'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 ](http://www.hikashop.com/fr/forum/4-how-to/14639-allign-table-and-provide-description.html):

> If you want to display the product description, you will have to edit the file listing\_table via the menu Display-&gt;Views and add the code:
> echo $this-&gt;row-&gt;product\_description;
>
> after the code:
> echo $this-&gt;row-&gt;product\_name;

Last edit: 13 years 3 months ago by [Mohamed Thelji](/forum/user/6861-mohamed-thelji "View Mohamed Thelji's Profile").

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzQtaG93LXRvLzg0NDA0LXNpbXBsZS1sYXlvdXQtZm9yLXByb2R1Y3QtbGlzdGluZy1wYWdlP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[mank087](/forum/user/21968-mank087 "View mank087's Profile")**
- [![mank087's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/21968-mank087 "View mank087's Profile") Topic Author
- [ Offline](/forum/user/21968-mank087)

Less More

- Posts: 46
- Thank you received: 0
-
-

13 years 3 months ago [\#112697](#112697) by [mank087](/forum/user/21968-mank087 "View mank087's Profile")  Replied by *[mank087](/forum/user/21968-mank087 "View mank087's Profile")* on topic *[Simple layout for product listing page](/forum/4-how-to/84404-simple-layout-for-product-listing-page#112697 "Hello,  I am trying to change the layout of my product listing page:   www.pssgpcshop.com/index.php?option=com&#95;...t=listing&amp;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...")*

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?

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzQtaG93LXRvLzg0NDA0LXNpbXBsZS1sYXlvdXQtZm9yLXByb2R1Y3QtbGlzdGluZy1wYWdlP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[Mohamed Thelji](/forum/user/6861-mohamed-thelji "View Mohamed Thelji's Profile")**
- [![Mohamed Thelji's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar6861.png)](/forum/user/6861-mohamed-thelji "View Mohamed Thelji's Profile")
- [ Offline](/forum/user/6861-mohamed-thelji)

Less More

- Posts: 12953
- Thank you received: 1778
-
-
-

13 years 3 months ago [\#112700](#112700) by [Mohamed Thelji](/forum/user/6861-mohamed-thelji "View Mohamed Thelji's Profile")  Replied by *[Mohamed Thelji](/forum/user/6861-mohamed-thelji "View Mohamed Thelji's Profile")* on topic *[Simple layout for product listing page](/forum/4-how-to/84404-simple-layout-for-product-listing-page#112700 "Hello,  I am trying to change the layout of my product listing page:   www.pssgpcshop.com/index.php?option=com&#95;...t=listing&amp;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...")*

Sure, You'll have to add this code : Code:

&lt;td class="hikashop_product_description_row"&gt; &lt;?php echo $this-&gt;row-&gt;product_description; ?&gt; &lt;/td&gt;

after this : Code:

&lt;?php if ($this-&gt;config-&gt;get('show_code')){ ?&gt; &lt;td class="hikashop_product_code_row"&gt; &lt;?php if($this-&gt;params-&gt;get('link_to_product_page',1)){ ?&gt; &lt;a href="&lt;?php echo $link;?&gt;"&gt; &lt;?php } echo $this-&gt;row-&gt;product_code; if($this-&gt;params-&gt;get('link_to_product_page',1)){ ?&gt; &lt;/a&gt; &lt;?php } ?&gt; &lt;/td&gt; &lt;?php } ?&gt;

and add this code : Code:

&lt;th class="hikashop_product_description_title" align="center"&gt; &lt;?php echo JText::_( 'PRODUCT_DESCRIPTION' ); ?&gt; &lt;/th&gt;

after this : Code:

&lt;?php if ($this-&gt;config-&gt;get('show_code')) { $columns++;?&gt; &lt;th class="hikashop_product_code_title" align="center"&gt; &lt;?php echo JText::_( 'PRODUCT_CODE' ); ?&gt; &lt;/th&gt; &lt;?php } ?&gt;

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzQtaG93LXRvLzg0NDA0LXNpbXBsZS1sYXlvdXQtZm9yLXByb2R1Y3QtbGlzdGluZy1wYWdlP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[mank087](/forum/user/21968-mank087 "View mank087's Profile")**
- [![mank087's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/21968-mank087 "View mank087's Profile") Topic Author
- [ Offline](/forum/user/21968-mank087)

Less More

- Posts: 46
- Thank you received: 0
-
-

13 years 3 months ago [\#112703](#112703) by [mank087](/forum/user/21968-mank087 "View mank087's Profile")  Replied by *[mank087](/forum/user/21968-mank087 "View mank087's Profile")* on topic *[Simple layout for product listing page](/forum/4-how-to/84404-simple-layout-for-product-listing-page#112703 "Hello,  I am trying to change the layout of my product listing page:   www.pssgpcshop.com/index.php?option=com&#95;...t=listing&amp;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...")*

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

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzQtaG93LXRvLzg0NDA0LXNpbXBsZS1sYXlvdXQtZm9yLXByb2R1Y3QtbGlzdGluZy1wYWdlP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[Eliot](/forum/user/1824-eliot "View Eliot's Profile")**
- [![Eliot's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar1824.png)](/forum/user/1824-eliot "View Eliot's Profile")
- [ Offline](/forum/user/1824-eliot)

Less More

- Posts: 2334
- Thank you received: 403
-
-

13 years 3 months ago [\#112963](#112963) by [Eliot](/forum/user/1824-eliot "View Eliot's Profile")  Replied by *[Eliot](/forum/user/1824-eliot "View Eliot's Profile")* on topic *[Simple layout for product listing page](/forum/4-how-to/84404-simple-layout-for-product-listing-page#112963 "Hello,  I am trying to change the layout of my product listing page:   www.pssgpcshop.com/index.php?option=com&#95;...t=listing&amp;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...")*

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.

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzQtaG93LXRvLzg0NDA0LXNpbXBsZS1sYXlvdXQtZm9yLXByb2R1Y3QtbGlzdGluZy1wYWdlP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

Board Categories HikaShop- Install &amp; Update- Product &amp; Category Display- Content Creation- Sales and Orders- - Orders management- - Reports &amp; Statistics- Customers- Checkout- Payment Methods- Shipping Methods- Import &amp; Export (CSV, XLS…)- Specific Features- - Affilation- - Taxes- - Wishlist- - Vote- - Carousel &amp; Slider- - Mass Actions- - Filters &amp; Search- - Discount &amp; Coupon- - Feature Request- Integrations- Showcase- General Talk about HikaShop- Development- - HikaShop 3.0 Beta- Translation- Commercial Jobs HikaShop Components- HikaMarket- - Market: Feature requests- - Market: How to?- - Market: Bug Report- HikaSerial- - General talk about HikaSerial- - Serial: Bug Report- - Serial: How to?- - Support en Français de HikaSerial (French Support)- - HikaSubscription- HikaAuction- - Auction: Feature requests- - Auction: How to?- - Auction: Bug report Hikashop around the world- Support en Français (French Support)- Russian- - FAQ. Курс выживания с Hikashop. Частые вопросы и о- - Расширения Hikashop- - Наши сайты на Hikashop- 日本語版サポート(Japanese Support)- Thai- German Archives- Bug Report- How to?

[](/forum/topics/feed/mode-topics?format=feed&type=rss)

Time to create page: 0.381 seconds

[Powered by](/forum/credits) [Kunena Forum](https://www.kunena.org)

[](#top)
