My website offers discounts on some products when you order any amount more than 1, but I really dislike the appearance of my quantity selector.
It is a premium theme, which has been great for other purposes, but I am clueless how to find solutions.
I want a simple quantity selector that encourages adding more. What I have now is almost like they have to enter their own quantity. Or they can hit that arrow button, but it’s not clear.
How do I fix this quantity selector to be something more button-like that encourages adding ++++ to add more sheets? Something that looks better with my theme?
Thanks!
1 Like
Hi!
It can be done manually with coding if you provide the website address.
Terence
Actually, the “Quantity” section is incorrect in the upper part. The “drop down” option is provided because it is actually an “option”. Its use is not necessary here. However, the “Quantity Button” below can be used, which also requires a nice css styling. I can do it for you if you want!
Yes, please. That looks like it is part of an app I downloaded yesterday to try to solve the problem. I’d appreciate any help from you. How can I get your assistance? I’m grateful.
If the problematic app is the culprit, I suggest you uninstall it. Issues often arise with free apps. Remember, style modifications always require manual coding. I’ve just corrected the issue on the product page for you. Of course, any desired style can be implemented!
The following code will do what you want. You can change the values as you like.
Navigate to the ‘Edit Code’ option in your theme settings, then search for “custom.css” in the search bar and add below codes.
.block.type-quantity_selector .quantity {
display: none!important;
}
.custom_qty {
flex-direction: column!important;
justify-content: start !important;
align-items: self-start!important;
}
.custom_qty .qty_label {
font-size: 16px !important;
color: #2f2a27 !important;
font-family: unset !important;
}
.custom_qty_inner.custom-quantity {
padding: 5px;
}
.qty_block.fully_rounded {
box-shadow: none !important;
}
Terence, the only .css file I see is california.css. This premium theme has been difficult for me to change due to the way it’s organized and most files being .liquid or .json and being arranged differently.
You can add it to the bottom of the ‘california.css’ file without any issues. Fine-tuning options are often limited in premium themes. We provide manual coding services for most aspects to our clients.
Still having issues so sent you a message here.