This topic has 13 replies, 2 voices, and was last updated 6 years, 9 months ago ago by Rose Tyler
how to (add to cart) and (price label)
between one product to another can equally flat for the horizontal like like picture below
Is there a way to align the “Add to Cart” or “Select Options” buttons on the shop pages? When the product names are different lengths, or some products have reviews and some don’t, the buttons are misaligned. ??
at Front page and shop pages
i want my website like transformation 2 picture below
before and after
Hello,
.slide-item .product .product-name, .products-grid .product .product-name {
min-height: 48px;
}
Regards
okay, works. and
i want to add seacrh product in point 1 at pictures below, and how to decrease gap in point 2 at pictures below.
1. Add search element in page content, and if you want to see it only on mobile, simply hide it http://prntscr.com/iavvr4
2. Set margin-bottom 0px for the slider element http://prntscr.com/iavwtu
Regards
okay, works.
how to make 3 columns of product in shop page
@media only screen and (max-width: 480px) {
.product-loop.products-grid .product:nth-child(2n+1),
.sidebar-position-without .product-loop.products-grid .product:nth-child(2n+1) {
clear: none !important;
}
.sidebar-position-without .product-loop.products-grid .product:nth-child(n) {
width: 33.33%;
}
.product-loop.products-grid .product:nth-child(3n+1),
.sidebar-position-without .product-loop.products-grid .product:nth-child(3n+1) {
clear: both !important;
}
}
Regards
I’ve added to custom css, but not changes to mobile view, specially on page shop
.slide-item .product .product-name, .products-grid .product .product-name {
min-height: 50px;
}
.slide-item .product .add-to-container a, .products-grid .product .add-to-container a {
text-align: center;
}
.slide-item .product .add-to-container, .products-grid .product .add-to-container {
padding-left: 0;
padding-right: 0;
text-align: center;
}
.slide-item .product .product-name, .products-grid .product .product-name {
margin-left: 0;
margin-right: 0;
text-align: center;
}
@media only screen and (max-width: 480px) {
.slide-item .product .add-to-container a, .products-grid .product .add-to-container a {
font-size: 10px;
text-align: center;
}
.slide-item .product .add-to-container, .products-grid .product .add-to-container {
padding-left: 0;
padding-right: 0;
text-align: center;
}
.slide-item .product .product-name, .products-grid .product .product-name {
font-size: 10px;
margin-left: 0;
margin-right: 0;
text-align: center;
}
.home h2.title {
font-size: 1.5rem;
}
.slide-item .product .product-name, .products-grid .product .product-name {
min-height: 58px;
}
.product-loop.products-grid .product:nth-child(2n+1),
.sidebar-position-without .product-loop.products-grid .product:nth-child(2n+1) {
clear: none !important;
}
.sidebar-position-without .product-loop.products-grid .product:nth-child(n) {
width: 33.33%;
}
.product-loop.products-grid .product:nth-child(3n+1),
.sidebar-position-without .product-loop.products-grid .product:nth-child(3n+1) {
clear: both !important;
}
}
Hello,
Please provide temporary wp-admin and FTP access in Private Content so we can take a closer look.
Regards
problem solved
i was checked, everything is OK. problem solved
Great.
This topic will be closed because the issue is solved. Please kindly open up new tickets for additional questions.
Have a nice day.
Regards
The issue related to '‘how to (add to cart) and (price label) to parallel’' has been successfully resolved, and the topic is now closed for further responses