Want to improve your Shopify store’s layout? Here’s a simple guide to transform your newsletter into a column, giving your footer a sleek, organised look.
Easy steps to create a newsletter column
Follow these straightforward steps to make your newsletter appear as a column:
- Go to your Shopify admin panel and click on ‘Online Store’.
- Select ‘Theme’, then click ‘Edit Code’.
- Look for one of these files: base.css, theme.css, style.css, main.css, or custom.css.
- Once you’ve found the right file, scroll to the bottom and add this code:
@media (min-width: 990px){
.footer-block__newsletter:not(:only-child) {
position: absolute !important;
left: 0px;
margin-bottom: 18%;
width: 100%;
}
.footer__content-top {
padding-bottom: 0px !important;
display: block;
}
.footer__content-bottom.scroll-trigger.animate--slide-in {
padding-top: 0px !important;
}
}
- Save your changes.
What this code does
This CSS code adjusts your newsletter’s layout for screens wider than 990 pixels. It positions the newsletter as a column on the left side of your footer, stretches it to full width, and tweaks some padding to ensure everything looks neat.
Why make this change?
Turning your newsletter into a column can:
- Improve your footer’s overall layout
- Make your newsletter more prominent
- Create a cleaner, more professional look for your store
Conclusion
By following these simple steps, you can easily transform your newsletter into a column, enhancing your Shopify store’s appearance. This small change can make a big difference in how customers perceive and interact with your site.