Category Product Border

Hi,

I am trying however unable to figure out how to do a couple of things:

1. Create a black colored border around the listings on the category page.
2. Create margins for the category and text size to adjust to the margins so the image, title, and description stay in the margins for the category listings.
3. To create a view details button if possible.

4. To make the top section of my page new products and the bottom popular items if possible.

See attached photos for examples.

Thank you

Hi,

1. You can edit the CS file of hikashop via the interface provided in the config under the tab display and add the code:
.hikashop_products .hikashop_subcontainer{
border: 1px solid;
}

2. You need to configure the hikashop options of your menu/module

3. www.hikashop.com/en/support/forum/4-how-...available.html#10640

4. You will need to create new modules of the type 'hikashop content module' via the joomla module manager and set the hikashop options to display the latest products or featured products like on our demo website (you can look at their hikashop options on our demo website).

I tried adding the code as follows but it didn't seem to work; should i have placed it somewhere else:


.hikashop_products a.hikashop_cart_button,.hikashop_products a.hikashop_cart_button:hover, #hikashop_checkout_coupon a.hikashop_cart_button,#hikashop_checkout_coupon a.hikashop_cart_button:hover{
float:none;
width:100px;
}

.hikashop_products .hikashop_subcontainer{
border: 1px solid;
}

#hikashop_button_1 div.hikashop_container,#hikashop_button_2 div.hikashop_container,#hikashop_button_3 div.hikashop_container {
cursor:pointer;
}
#hikashop_button_1 div.hikashop_subcontainer, #hikashop_button_2 div.hikashop_subcontainer, #hikashop_button_3 div.hikashop_subcontainer,#hikashop_order_listing div.hikashop_subcontainer {
text-align:center;
}

Try this one then:
div.hikashop_products div.hikashop_subcontainer{
border: 1px solid;
}

Nope, not working either.

Could you give a link to that page ?

hikashop

I don't see any products listing displayed as div on your website. There is only that one displayed as table:
hsmemory.com/category/listing/cid-10/name-sd-memory-cards

I wanted to have the border around the categories on the main page

see attached image

Ok. I thought you were talking about products...
So it should be:
div.hikashop_subcategories div.hikashop_subcontainer{
border: 1px solid;
}

Now if I want the margins to adjust so that the borders are a standard size and the images / text readjust to fit so this doesn't happen. How would I do that

You need to configure the hikashop options of your menu.
Go in the menu Display->Content menus and edit the menu 101.
there, you have the "number of columns" option that you need to reduce and the margin option that you need to increase.