Change Position of Email Signup and Social Icons in Footer Dawn Theme

[ed_bb]

Hi,

I'm using dawn theme 11, looking to move the positions of the email signup box and social media icons in my footer section. Tried a few things and bits of code I've found online but nothing seems to give me the look I require.

URL : baileybespoke.co.uk

It currently looks exactly as I want it to on mobile but on desktop the email signup box is over to the left hand side but I want it to be under the subscribe text box, aligned left of the box as the text is and the social icons stay over to the right hand side.

Hope that makes sense and thank you in advance.

[Moeed · Accepted solution]

Hey @ed_bb 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
.footer-block__newsletter:not(:only-child) {
    text-align: -webkit-right !important;
    margin-right: 90px !important;
}
</style>

RESULT:

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[Moeed · Accepted solution]

Hey @ed_bb 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
.footer-block__newsletter:not(:only-child) {
    text-align: -webkit-right !important;
    margin-right: 90px !important;
}
</style>

RESULT:

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[ed_bb]

Hi @Moeed 

I implemented your solution which worked fine but I have gone to Dawn 12 now, 

 As you will see from the screenshot the email signup box sits quite low away from the text. How do I make it sit closer to the text above but leave the social icons where they are, please?

Thanks.

[Moeed · Accepted solution]

Hey @ed_bb 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
@media screen and (min-width: 768px) {
.footer-block.grid__item.scroll-trigger.animate--slide-in {
    height: 100px !important;
}
}
</style>

RESULT:

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[ed_bb]

Hi @Moeed 

Just noticed that whilst your solution makes it look great, on desktop it prevents one of the links in the footer menu from being "clickable" - I've tried playing with the pixel height but just changes which of the 2 lowest menu links aren't able to be clicked.

Works fine on mobile but guessing that's because it stacks the sections differently?

Could you advise, please?

Thanks.

[Theodore2]

Hi @ed_bb

For solving the problem about the Change Position Of Email Signup And Social Icons In Footer Dawn Theme, let’s try this solution:

.footer-block__newsletter:not(:only-child) {
    text-align: -webkit-right !important;
    margin-right: 90px !important;
}

[PageFly-Theodor]

Hi @ed_bb 
This is Theodore from PageFly - Shopify Page Builder App.
For solving the problem about the Change Position Of Email Signup And Social Icons In Footer Dawn Theme, let’s try this solution:

Online Store ->Theme ->Edit code
Assets ->Base.css

.footer-block__newsletter:not(:only-child) {
    text-align: -webkit-right !important;
    margin-right: 90px !important;
}

I’ll be so happy if my suggestion can help to solve your problem. If you have any further questions, please feel free to tell me.
Best regards,
Theodore | PageFly