Solved

Change "SUBSCRIBE TO OUR EMAILS" field from rectangle to pill shaped on Footer Menu

itsfrizzy
Tourist
11 0 3

Is it possible to change the box/field where you submit your email on footer menu from rectangle shape to pill shaped?

Also is it possible to change the text inside that field to make it bold and upper case, now it says Email and i'd like to have it as EMAIL 

I use dawn theme and my website is www.storeolympia.com

 

Accepted Solutions (2)

suyash1
Shopify Partner
9280 1154 1495

This is an accepted solution.

@itsfrizzy - add this css to the end of your base.css file and check

.newsletter-form__field-wrapper .field:after{border-radius: 15px;}

.newsletter-form__field-wrapper .field__input::placeholder{font-weight:bold; text-transform:uppercase;}
To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
Paranormal story video using AI

View solution in original post

Moeed
Shopify Partner
3805 962 1193

This is an accepted solution.

Hey @itsfrizzy 

 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
.field:after, .select:after, .customer .field:after, .customer select:after, .localization-form__select:after {
    border-radius: 100px !important
}
label.field__label {
    text-transform: uppercase !important;
    font-weight: bold !important;
}
</style>

RESULT:

Moeed_0-1700487094334.png

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

Need a Shopify developer? Chat on WhatsApp


- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️

View solution in original post

Replies 2 (2)

suyash1
Shopify Partner
9280 1154 1495

This is an accepted solution.

@itsfrizzy - add this css to the end of your base.css file and check

.newsletter-form__field-wrapper .field:after{border-radius: 15px;}

.newsletter-form__field-wrapper .field__input::placeholder{font-weight:bold; text-transform:uppercase;}
To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
Paranormal story video using AI

Moeed
Shopify Partner
3805 962 1193

This is an accepted solution.

Hey @itsfrizzy 

 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
.field:after, .select:after, .customer .field:after, .customer select:after, .localization-form__select:after {
    border-radius: 100px !important
}
label.field__label {
    text-transform: uppercase !important;
    font-weight: bold !important;
}
</style>

RESULT:

Moeed_0-1700487094334.png

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

Need a Shopify developer? Chat on WhatsApp


- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️