Hello,
I will advise you to use this css code and paste it in your Custom Head Styles textfield. it is located in your nopCommerce Administration -> Plugins -> Seven Spikes Themes -> Nop Native Theme -> Settings.
@media (min-width: 1281px){
.home-page-category-grid .item-box, .sub-category-grid .item-box {
width: 23.5%;
margin: 0 0 2% 2%;
}
.home-page-category-grid .item-box:nth-child(3n+1), .sub-category-grid .item-box:nth-child(3n+1) {
margin: 0 0 2% 2%;
clear: none;
}
.home-page-category-grid .item-box:nth-child(4n+1), .sub-category-grid .item-box:nth-child(4n+1) {
margin-left: 0;
clear: both;
}
}
Hello,
Thank you your personal message was received. For additional help please don't hesitate to use our ticketing system also.
Hello,
In the Brooklyn theme the category titles are displayed in both category item layouts and you can see that in the demo. It looks like there is a problem on your website. Will it be possible for you to send us a livestore link(you can send it in personal message if you don't want your website to appear on public yet) and we can investigate there what the problem is.
Hello,
This will be a little more trickier. You will have to open your Header.cshtml view located in Themes\Brooklyn\Views\Shared folder and add your link on line 72 like that:
<img class="menu-img" alt="#" src="the physical path to your image">
.header-menu .menu-img {
display: none;
}
@media all and (min-width: 1001px) {
.header-menu.stick {
display: block;
position: fixed;
top: 0;
left: 0;
right: 0;
background: #fff;
padding: 11.5px 0;
text-align: center;
box-shadow: 0 8px 8px rgba(0,0,0,.085);
}
.header-menu>ul {
display: block;
width: auto;
}
.header-menu.stick .menu-img {
display: inline-block;
}
}
Hello,
It is very easy to achieve that effect. You will have to add this css code to your Custom Head Styles textfield (it is located in your nopCommerce Administration -> Plugins -> Seven Spikes Themes -> Nop Brooklyn Theme -> Settings):
@media all and (min-width: 1001px) {
.header-menu.stick {
display: block;
position: fixed;
top: 0;
left: 0;
right: 0;
background: #fff;
padding: 11.5px 0;
text-align: center;
box-shadow: 0 8px 8px rgba(0,0,0,.085);
}
.header-menu>ul {
display: block;
width: auto;
}
}
Hello,
Thank you, I have received your message.
Hello,
We can provide you with a css code to fix the problem, but it will be better if you send us a link to your website if possible(you can send it to a personal message if your website is not published). This way we will be able to provide you with the most suitable solution.
Hello,
You can try adding this custom css code:
@media (min-width: 1001px){
.header.normal .header-top-strip {
height: auto;
}
.header.normal .header-logo {
position: static;
float: left;
}
.header.normal .header-top-strip > ul {
position: static;
float: right;
}
.header.normal .header-menu {
display: block;
clear: both;
padding: 10px 0 0;
text-align: center;
}
.header.normal .mega-menu {
display: inline-block
}
.header.normal .mega-menu>li {
float: none;
font-size: 0;
}
}
Hello,
You have removed the header-menu max-width property, and that is why your menu overlaps the logo and header buttons, since they are absolute positioned. To limit it try giving it max-width: 80%; this will limit the menu, and it will clear the two elements. If your logo is wider you can try reducing the percentage value.
Hello,
To change this two buttons background color you will have to add this css code:
.color-neutral .productAddedToCartWindowCheckout:hover,
.color-neutral .continue-shopping-wrap input[type="submit"]:hover,
.color-neutral .continue-shopping-wrap:hover:before{
background-color: #The value of the color you want to change;
}