Hello!
I am trying to change all of my field inputs to underlines (if this is even possible).
It looks like this now & I want it to look like this:
Any help would be much appreciated!
Topic summary
A user wants to replace boxed input fields with underlined inputs across their Shopify store.
Current Status:
- Successfully implemented underlined styling for newsletter footer fields using custom CSS in base.css
- The CSS solution removes box-shadow and adds a 1px solid black bottom border to
.newsletter-form__field-wrapper .field:after
Remaining Tasks:
The user now seeks to apply the same underline styling to:
- Account fields (create account and login pages)
- Search page and search bar
- Custom liquid sections
Technical Approach:
Modification involves editing the theme’s base.css file through Online Store → Themes → Edit Code, with CSS targeting specific field wrapper classes.
The discussion remains open as the user awaits guidance on extending this styling to additional input fields throughout the store.
1 Like
Hi @tuckerkaide
Would you mind to share your Store URL website? with password if its protected. Thanks!
Hi, yes it’s:
password is sonnydecru
Hi @tuckerkaide ,
- Go to your Online Store => Themes => Edit Code
2 . Find the base.css file and paste this code at the bottom of the file:
Code :
.newsletter-form__field-wrapper .field:after{
box-shadow: none !important;
border-bottom: 1px solid black;
}
3 : Save and hope you get the result like the image:
Hi,
Thanks so much this worked! My next question is, how do I do the same with the following:
-
Customer Account fields (to create an account & to login)
-
Search page (& bar if possible)
Thank you again!