Shopify themes, liquid, logos, and UX
is there a way to change the newsletter (both in footer and induvial section) from this boring design to this?
let me know if u can help!!
website - https://the-style-luxe.myshopify.com/
password - reucho
website with better looking newsletter- https://allureluxe-pastelgrid.myshopify.com/
Solved! Go to the solution
This is an accepted solution.
Please try again with the code below:
.newsletter-form__button{
position: absolute;
width: 85px !important;
border: 1px solid #ffffff;
}
.newsletter-form__field-wrapper .field__input{
width: 100%;
border: 1px solid #ffffff;
margin: 0 !important;
}
.newsletter-form__field-wrapper > .field{
position: relative;
padding-right: 90px;
}
.newsletter-form__field-wrapper > .field::after,
.newsletter-form__field-wrapper > .field::before{
display: none !important;
}
#Subscribe::before{
content: 'Subcribe';
font-size: 14px;
text-transform: uppercase;
}
#Subscribe svg{
display: none;
}
Hello @hasanali1
It's GemPages support team and glad to support you today.
Please share the password of the store: https://allureluxe-pastelgrid.myshopify.com/
Password: pastelgrid
It's GemPages support team and glad to support you today.
I would like to give you a solution to support you.
1. Go to Online Store -> Theme -> Edit code.
2. Open your assets/theme.css theme file.
3. Add the code at the end of the file:
.newsletter-form__button{
position: absolute;
width: 75px;
border: 1px solid #ffffff;
}
.newsletter-form__field-wrapper .field__input{
width: 100%;
border: 1px solid #ffffff;
margin: 0 !important;
}
.newsletter-form__field-wrapper > .field{
position: relative;
padding-right: 80px;
}
.newsletter-form__field-wrapper > .field::after,
.newsletter-form__field-wrapper > .field::before{
display: none !important;
}
Result:
Hope my solution can work and support you!
Kind & Best regards!
GemPages Support Team.
thank you loads!! is there a way to replace the 'arrow' to a text instead 'SUBSCRIBE' ?
This is an accepted solution.
Please try again with the code below:
.newsletter-form__button{
position: absolute;
width: 85px !important;
border: 1px solid #ffffff;
}
.newsletter-form__field-wrapper .field__input{
width: 100%;
border: 1px solid #ffffff;
margin: 0 !important;
}
.newsletter-form__field-wrapper > .field{
position: relative;
padding-right: 90px;
}
.newsletter-form__field-wrapper > .field::after,
.newsletter-form__field-wrapper > .field::before{
display: none !important;
}
#Subscribe::before{
content: 'Subcribe';
font-size: 14px;
text-transform: uppercase;
}
#Subscribe svg{
display: none;
}
Hello @GemPages,
Thank you so much for the code it worked for me!😊
Is there a way to change the position of the button to below the field and in black color ?
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