Jump to content

Product grid layout


Recommended Posts

What he's saying is that there is no way to do this via admin, only css customizations. You don't need to know php or anything, but you will need to be able to work with a stylesheet.

In my case I would rather not use display:none to get rid of things so I'll still need to go in and comment some things out elsewhere. Having an admin option would be nice, or a more gutted blankish starter theme available.

I can post the correct code later...

Link to comment
Share on other sites

I'm brand spanking new to Prestashop, but it looks like you can do a lot by editing the global.css file in your current Theme folder. If you don't know anything about css, you should look into it. In the case of making a list into a grid, you need to look in the source of a page for the div that is the list item. Usually, if you alter the css so that item is narrow and 'floats' to the left, all of the list items will wrap up in to a grid. As an experiment, try this:

Open global.css for your theme. Search for 'ul#product_list li {' (not the quotes). This rule ends with 'margin-bottom...' but if you add an additional 5 lines (from 'float: left' to 'clear: none;') then save the css file, go back to your browser and refresh the page and you should see a grid layout (sort of; it might be ugly!)

ul#product_list li {
background: #d0d3d8 url('../img/block_category_item_bg.jpg') repeat-x;
border: solid 1px #d0d3d8;
padding: 6px;
height:130px;
clear:both;
margin-bottom:0.3em;
float: left;
width: 45%;
height: auto;
margin-right: 10px;
clear: none;
}

Please note that this is just to demonstrate. To be tidy, you would remove the earlier height and clear attributes and you'd probably have a lot more work to do because a change like this would have a knock-on effect. But hopefully you'll get the right idea.

Link to comment
Share on other sites

  • 2 months later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...