Shopify themes, liquid, logos, and UX
Hi,
Please could someone help me change these buttons so they are transparent? I want to keep the thin outline but get rid of the greyed out background.
See screenshot for examples on X, magnifying glass and 'subscribe'.
Thanks!
Share store url
hello @mbhlg
Please provide website url and if your store is password protected then also provide password So I will check and provide a solution here.
hello @mbhlg
@media screen and (max-width: 789px){
.search-form__clear-action.predictive-search__clear-button--visible{
background: transparent;
}
.search-form__connected-submit{
background: transparent;
}
.btn.newsletter__submit{
background: transparent;
}
}
Thanks, I tried the code and it doesn't seem to have worked on all buttons, see screenshots below.
I would also like the button outline to be rounded if possible, not rectangle?
Thank you!
@mbhlg Use the below code
button {
background: transparent !important;
border-radius: 16PX;
padding: 3px 10px;
}
Hope this works
thanks
hello @mbhlg
fo all button transparent all add below code in the bottom of theme.css file
@media screen and (max-width: 789px){
button {
background: transparent !important;
}
}
Great that seems to have helped with the other buttons except the one on the captcha when you subscribe to email updates... see below
Also would it be possible to get rid of all the black rectangle outline from all buttons? (except the email address boxes)
Thanks!
hello @mbhlg
@media screen and (max-width: 789px){
button:not(.newsletter__submit , #Contact_1622218268cfe899e3 .btn ){
border: transparent;
}
}
Thanks @Kinjaldavra
Unfortunately still having issues with this as the email 'subscribe' buttons still have a black outline as below.
thanks
hello @mbhlg
@media screen and (max-width: 789px){
.site-footer.critical-hidden .site-footer__hr{
visibility:hidden;
}
.shopify-challenge__button.btn{
background: transparent;
}
}
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024