Craft Theme Footer Layout Issues

Shopify Discussion
1

Hello,

I am seeking some assistance with some code for a website that is using the Craft theme.

I have added the following code to my theme.liquid file to format the footer into three columns and move the newsletter form to the middle column:

@media screen and (min-width: 768px) {
.footer-block.grid__item.footer-block–menu.scroll-trigger.animate–slide-in {
display: flex !important;
flex-flow: column !important;
}
form#ContactFooter {
place-self: center !important;
}
.footer-block__newsletter {
bottom: 270px !important;
position: relative;

However, this has caused a big space in my footer that I would like removed (photo attached).

I have tried using the following code, but this unfortunately also removes the Newsletter Form from above:

.footer-block–newsletter {

display: none !important }

The preview link is https://c9697fcvatbr7ouc-65874886903.shopifypreview.com

Any help would be greatly appreciated!

Screen Shot 2024-11-09 at 2.11.21 pm.png
Screen Shot 2024-11-09 at 2.11.21 pm.png2796×1076 135 KB

2

Hi @BellesandBells

You can solve it by adding this code to Custom CSS in Online Store > Themes > Customize > Theme settings

@media (min-width: 750px) {
.footer__content-top {
max-height: 300px;
}
}
1 Like
3

Thank you so much, that worked perfectly!

1 Like
4

Glad I could help. Have a great day ahead!

Best regards,
Dan from Ryviu