How can I reposition my newsletter closer to the loyalty program?

[HanMar]

can someone help me move my newsletter up closer to Join our loyalty program?

feel free to direct message and i will provide the necessary info

[Made4uo-Ribe]

Hi @HanMar ,

Would you mind to share your URL website with password?

Thanks!

[Dirk]

Hey, @HanMar

It sounds like you want to move the newsletter signup closer to the loyalty program messaging. I’m confident one of our Shopify experts would be able to accomplish this at a reasonable price.

Just wanted to share this as an option in case you are unable to find a coding solution in your thread.

If there is anything else I can help you with, please let me know.

[Made4uo-Ribe]

Thank you for the information,

I manage to move it on the bottom of the “JOIN OUR COMMUNITY”. But still have a lot to edit for the styles. For fixing this properly better to hire some expert developers.

1. From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
2. Find the theme that you want to edit and click on “Actions” and then “Edit code”.
3. In the “Assets” folder, click on “section-footer.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
4. And Save.

.footer__content-top.page-width {
    position: relative;
}
.footer-block__newsletter {
    position: absolute;
    bottom: 150px;
}

Please remove first the padding-right, it cant be remove by the code need to edit inside.

Result:

I hope it help.

[HanMar]

Thank you for the reply, can you help me align it with the text on the right side?

[Made4uo-Ribe]

I try it. But need editing inside your base.css. Reduce the width to 100%.

This one reduce again the padding right. (5px) its in the custom.css i think.

Result:

I hope it help.

[HanMar]

Hi Ribe, that worked thanks a lot!, i have another issue the mobile version is a little off, can you help me move the newsletter below join our community for the mobile version?

[Made4uo-Ribe]

Im already expecting that let me see what can I do for that.

[HanMar]

Thank you!

[Made4uo-Ribe]

This is for the mobile.

@media only screen and (max-width: 414px) {
.footer-block__newsletter {
    position: absolute;
    bottom: 10px;
    padding: 0px !important;
}
}

Result:

I hope it helps.

[HanMar]

Thank you! it worked!

[Made4uo-Ribe]

Welcome, Happy to help.