Move Email Sign Up To Bottom Left In Footer

Shopify Discussion
1

Hello,

Could someone assist me with this, I’m trying to add the email signup to the bottom left of my footer and the navigation to the right. I’ve tried so many different things. Anyone have a solution? I’m using the Streamline Theme.

I can give you access if you need to jump into the coding, also the password to the site is welcome4123

Thanks!

Screen Shot 2022-10-01 at 6.07.58 PM.png
Screen Shot 2022-10-01 at 6.07.58 PM.png3687×423 24.7 KB

Screen Shot 2022-10-01 at 6.08.38 PM.png
Screen Shot 2022-10-01 at 6.08.38 PM.png3667×259 7.27 KB

2

hello, Corp41

you gave the password to the site but didn’t give the site link

3

My apologies. It is www.forgiveoursins.co

4

hey, I fixed this in a way, but check mobile to see if it looks ok

go to online store > themes > actions > edit code

on the theme.css file, at the end, add this:

.site-footer {
    display: flex;
    justify-content: space-between;
    position: relative;
    padding-top: 20px;
}

.site-footer .page-width {
   margin: 0;
}

.site-footer__copyright {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 5px;
}
5

Definitely works on the computer, but on mobile its squeezed together :disappointed_face:

6

can you do a quick sketch of how you want it to look on mobile? I can do an extra code for that

7

Sure, so on mobile I was trying to keep it centered, I took a screenshot of the mobile without the new code you gave me…

IMG_C64D0945A11C-1.jpeg
IMG_C64D0945A11C-1.jpeg1170×1931 57.4 KB

8

replace the code that I sent previously with

@media (min-width: 768px) {
.site-footer {
    display: flex;
    justify-content: space-between;
    position: relative;
    padding-top: 20px;
}

.site-footer .page-width {
   margin: 0;
}

.site-footer__copyright {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 5px;
}
}
9

That worked perfectly. Thank you so much for that!