Craft adjust footer padding and font

Store Design
,
1

I’m running craft version 12.0

I need the following footer to be adjusted the following way:

  • Menus on the edge of the screen, for left menu on the edge of the left, for right menu on the edge of the right, no matter what resolution the client is using.
  • Logo to be always on the center.
  • I would like to change the font of the Menu title (heading) and the menu links too, font size too.
2

Screenshot 2024-07-07 152338.jpg
Screenshot 2024-07-07 152338.jpg2559×582 23.5 KB

585358.myshopify.com

atwosk

3

Hi @gege29 ,

What’s font and size you want change ? Is this result you want ?

BSSCommerceTC_0-1720362652672.png
BSSCommerceTC_0-1720362652672.png1905×922 112 KB

1 Like
4

Yes, this is the padding I want but could it be center alligned?.

I’m not sure about font size and font, I have to decide yet. For testing sake lets say I want 16 size for header and 12 for menus, font Arial.

5

Hi @gege29 ,

This is the code applied for desktop screens with a width of 750px or more. Please insert at the end file base.css

body {
    font-family: Arial, sans-serif;
}

@media screen and (min-width: 750px) {
    .footer__content-top {
        margin: 0;
        display: contents;
    }
    
    .footer-block.grid__item.footer-block--menu:last-child {
        text-align: right;
    }

    .footer-block__heading {
        font-size: 16px !important;
    }

    .footer-block__details-content > li {
      margin-right: 0 !important;
     }
}

Hope this can help you

1 Like
6

Hi @gege29

This is Amelia from PageFly - Landing Page Builder App

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file → Save

.footer-block {

text-align: center;

}

.footer-block li {

margin: 0 !important;

}

.footer-block a.link.link–text.list-menu__item.list-menu__item–link {

font-size: 20px !important;

font-family: ‘Americana’ !important;

}

Hope that my solution works for you.

Best regards,

Amelia | PageFly