Would like to have a box to hold the products and categories on web pages

[bikashshil02]

Hi,

I want to create a box around the product category(Thumbnail + Information) on home page and other product pages.

For reference you can look into https://kraftly.com/ (You can check how trending items are being displayed, the image, product price, product description all are within one box). Can I do that for my website. Also can I have a page background like them.

Please advise

Regards

Bikash

[David Martin – Support]

Hi Bikash,

Yes, you can do this with CSS. Depending on what you need, you may need to work with a developer. A broad example is:

.woocommerce ul.products li.product {
    border: solid 1px red;
}

Yes, you can add a slider to your shop page: Theme Options => WooCommerce Options

[bikashshil02]

Thanks David,

I tried the css. The border is being created. But then box sizes are varying. Also there is no gap between the product categories. Can I achieve the same box size and some gap between the categories as well. Please refer to the attached image to see how it looks like after applying the custom css.

Also, I was referring to have a different back ground for my home page. Right now it is white. I want to have some other colour, may be light blue or grey. Can that be achieved.

Please advise

Thanks

Bikash

Attachments:

You must be logged in to view attached files.

[David Martin – Support]

1) No this would not be possible without really jeopardizing the layout. To create this you would need to use fixed height products which would not translate well to mobile. I’d suggest you work with a developer to fully integrate this if you really need it.

2) Sure, edit your page and change the inner page background color: Meta Options => Page Background => Inner Background Color