Solved

Newsletter box in footer not aligning properly – Craft Theme

jmd92
Excursionist
23 0 4

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
6872 1294 1323

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 or Accept solution, - Coffee Tips or Paypal Tips
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 1 month of Shopify for $1. Sign up now

View solution in original post

Dan-From-Ryviu
Shopify Partner
6872 1294 1323

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 or Accept solution, - Coffee Tips or Paypal Tips
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 1 month of Shopify for $1. Sign up now

View solution in original post

Replies 9 (9)

Dan-From-Ryviu
Shopify Partner
6872 1294 1323

Could you share your store URL?

- Helpful? Like or Accept solution, - Coffee Tips or Paypal Tips
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 1 month of Shopify for $1. Sign up now

jmd92
Excursionist
23 0 4

Hi Dan, below:

http://thetypefella.com

Dan-From-Ryviu
Shopify Partner
6872 1294 1323

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 or Accept solution, - Coffee Tips or Paypal Tips
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 1 month of Shopify for $1. Sign up now

jmd92
Excursionist
23 0 4

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
6872 1294 1323

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 or Accept solution, - Coffee Tips or Paypal Tips
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 1 month of Shopify for $1. Sign up now

jmd92
Excursionist
23 0 4

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
6872 1294 1323

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 or Accept solution, - Coffee Tips or Paypal Tips
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 1 month of Shopify for $1. Sign up now

jmd92
Excursionist
23 0 4

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

Dan-From-Ryviu
Shopify Partner
6872 1294 1323

You are very welcome!

- Helpful? Like or Accept solution, - Coffee Tips or Paypal Tips
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 1 month of Shopify for $1. Sign up now