[Support request] Modify foter

[Matt]

How do I modify the footer like the below screenshot? I was able to add the logo and menu with footer widgets but can’t figure out the bottom part.

[David]

Hi there,

if you add the social icons to the Widgets > Footer Bar
Once there let me know and i can provide some CSS to align them if required.

OR alternatively build the whole footer with a block element:

https://docs.generatepress.com/article/block-element-site-footer/

[Matt]

Icons are added.

[Ying]

Try this CSS:

.site-footer.footer-bar-active .inside-site-info {
    flex-direction: row-reverse;
    justify-content: space-between;
}

[Matt]

Thanks.

How do I have the icons go below or above when mobile?

[Fernando]

Hi Matt,

Here’s a CSS you may try adding through Appearance > Customize > Additional CSS:

@media (max-width: 768px) {
    .site-footer.footer-bar-active .inside-site-info {
        flex-direction: column;
    }
}

If you want to put the icons under, use this instead:

@media (max-width: 768px) {
    .site-footer.footer-bar-active .inside-site-info {
        flex-direction: column-reverse;
    }
}

You can add spacing to the Blocks on mobile through switching the view: https://share.getcloudapp.com/rRuOn8mo

Hope this clarifies!

[Author]

Posts