Solved

Newsletter box in footer not aligning properly – Craft Theme

jmd92
Excursionist
29 0 7

Hello,

 

I am having an issue on desktop only where my newsletter box in my footer does not align with the Screenshot 2024-01-27 at 12.39.07 AM.jpg above it. The header above is aligned with my top nav menu and slideshow etc. Mobile looks fine, does anyone know how to fix this issue  for desktop? Mockup attached for reference. Thank you so much. 

Accepted Solutions (2)
Dan-From-Ryviu
Shopify Partner
7726 1506 1513

This is an accepted solution.

Sorry, please update code to this 

<style>
@media (min-width: 750px) {
.newsletter-form { margin-left: 0px !important; }
}
</style>

- Helpful? Like and Accept solution or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

View solution in original post

Dan-From-Ryviu
Shopify Partner
7726 1506 1513

This is an accepted solution.

Code update 

<style>
@media (min-width: 750px) {
.newsletter-form { margin-left: 0px !important; }
.footer-block--newsletter {
align-items: flex-start !important;
margin-top: 0px !important;
}
}
</style>

- Helpful? Like and Accept solution or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

View solution in original post

Replies 9 (9)

Dan-From-Ryviu
Shopify Partner
7726 1506 1513

Could you share your store URL?

- Helpful? Like and Accept solution or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

jmd92
Excursionist
29 0 7

Hi Dan, below:

http://thetypefella.com

Dan-From-Ryviu
Shopify Partner
7726 1506 1513

Please add this code to your Online store > Themes > Edit code > open theme.liquid file, add this code after <head> element

@media (min-width: 750px) {
.newsletter-form { margin-left: 0px !important; }
}

- Helpful? Like and Accept solution or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

jmd92
Excursionist
29 0 7

Hmm, got this weird code above, header after adding that code. This did not fix the bottom either, any ideas? Screenshot 2024-01-27 at 1.06.55 AM.png

Dan-From-Ryviu
Shopify Partner
7726 1506 1513

This is an accepted solution.

Sorry, please update code to this 

<style>
@media (min-width: 750px) {
.newsletter-form { margin-left: 0px !important; }
}
</style>

- Helpful? Like and Accept solution or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

jmd92
Excursionist
29 0 7

That worked perfect! Last question, do you know how to top align the newsletter header and block on far right just like image attached? Desktop only. Tried some other code from others but couldn't get all blocks to top align properly. Screenshot 2024-01-27 at 1.21.39 AM.jpg

Dan-From-Ryviu
Shopify Partner
7726 1506 1513

This is an accepted solution.

Code update 

<style>
@media (min-width: 750px) {
.newsletter-form { margin-left: 0px !important; }
.footer-block--newsletter {
align-items: flex-start !important;
margin-top: 0px !important;
}
}
</style>

- Helpful? Like and Accept solution or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

jmd92
Excursionist
29 0 7

Perfect thanks so much! Just paypal'd you, I appreciate the help!  

Dan-From-Ryviu
Shopify Partner
7726 1506 1513

You are very welcome!

- Helpful? Like and Accept solution or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now