With Goya there’s an option to show a sticky product bar but it’s disabled form mobiles. However, it’s possible to adjust that.
In the goya-child/style.css add this code:
/* Sticky add to cart on mobiles */
@media screen and (max-width: 991px) {
.site-content .sticky-product-bar .sticky-product-bar-title,
.site-content .sticky-product-bar .sticky-product-bar-image {
display: none;
}
.site-content .sticky-product-bar .quantity {
min-width: 92px;
}
.site-content .sticky-product-bar .quantity .minus,
.site-content .sticky-product-bar .quantity .plus {
display: flex;
}
.site-content .sticky-product-bar .quantity {
height: auto;
}
}
@media screen and (max-width: 575px) {
.site-content .sticky-product-bar {
display: flex !important;
top: auto !important;
bottom: 0 !important;
opacity: 1;
position: fixed;
visibility: visible;
}
}
Code language: CSS (css)
The regular add to cart button will remain visible on variable products and the sticky bar will display a button with the text “Select Options”
For single products it will show only the sticky add to cart button.
Leave a Reply