[Resolved] Inline Footer Widgets

Home Forums Support Inline Footer Widgets

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #1305761
    Christian

    Hello, Team!

    I used the following code to inline my footer widgets: https://generatepress.com/forums/topic/how-to-make-footer-menu-horizontal/#post-265949

    But it seems to only be working with my Footer Widget 3. Footer Widget 1 and 2 remain stacked.

    No changes happen even when using only one footer widget (basically eliminating Footer Widget 2 and 3). 🙂

    #1306001
    David
    Staff
    Customer Support

    Hi,

    That CSS only applies to Navigation Menu widgets, which is why it doesn’t effect your social icons. It also only works if there is enough room for the items to be placed inline – which is why footer widget 2 doesn’t work.

    You need to fix the social icons first.
    First you need to remove the Title from the first icon.
    Then Add a new HTML Widget to Footer Widtget one. Give it the ‘Follow’ Title. And add a HTML Comment inside its content eg. <!-- Follow -->

    Let me know once thats done and ill take a look at the CSS required to align them all if possible

    #1306305
    Christian

    Oh, I see. Got it, thanks for the explanation, David! I just made the changes you asked for.

    #1306333
    David
    Staff
    Customer Support

    try this CSS:

    /* Add flex and remove width so widgets auto resize */
    .footer-widgets .inside-footer-widgets {
        display: flex;
        flex-wrap: wrap;
    }
    .footer-widgets .inside-footer-widgets .grid-33 {
        width: unset;
        margin-bottom: 20px;
    }
    
    /* Set all widget elements inline */
    .footer-widgets .widget_nav_menu li,
    .footer-widget-1 .widget_media_image {
        display: inline-block;
        margin-right: 10px;
    }
    /* Reduce space between social icons */
    .site-footer .footer-widgets-container .footer-widget-1 .widget_media_image:not(:nth-child(2)) {
        padding-left: 10px;
    }
    #1306468
    Christian

    David, did you go to Hogwarts? Because you must be a wizard!

    That worked, thank you so much 🙂

    #1306573
    David
    Staff
    Customer Support

    Haha 🙂
    Glad to be of help

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.