Premium support

Please log in to post in these forums. If you didn't create an account when you purchased, please contact us.

Free support

If you haven't purchased GP Premium, support for the free theme can be found on WordPress.org.

[Resolved] Sticky Footer with Flexbox?

Home Forums Support Sticky Footer with Flexbox?

Tagged: 

This topic contains 13 replies, has 4 voices, and was last updated by  Leo 5 days, 23 hours ago.

Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #369041

    Hey Tom,
    I am not sure if you can help with this. I have seen several forum posts about sticky footer but nothing that I can see is resolved for what I am looking for. I also have absolutely no experience with coding so I am very lost. Is there a way I can add the code from here: https://philipwalton.github.io/solved-by-flexbox/demos/sticky-footer/
    And get it to operate like that? I need so badly for the footer to stick to the bottom only when the content isn’t long enough, just like that site is showing. I want my site to work like this: http://www.lik.com/
    when you toggle from normal to full screen the page always fits the browser which is what I’m looking for.
    My home page is very similar. I would gladly provide you with login information to look at my site if that helps. Also, I understand if you cannot help. Either way, I appreciate very much what you have done with GP Pro and could not have gotten as far as I have now without it. I am forever in your debt! So thank you very much for all your hard work!

    GP Premium 1.4.3
    #369044

    Leo
    Staff

    Hi there,

    This topic might help: https://generatepress.com/forums/topic/has-sticky-footer-been-figured-out/

    Want to help support GP? Please consider leaving us a review!
    https://wordpress.org/support/theme/generatepress/reviews

    #369303

    Thanks for getting back Leo!
    Unfortunately, I have already read through that post. I might be able to do this on my own, but I am not knowledgeable on where I need to go in WordPress/theme to write the code I linked to.
    Would you happen to know where I can go for that? Thank you in advance!

    #369373

    Leo
    Staff

    What’s not working in the solution I linked?

    It should give you the desired effect?

    Want to help support GP? Please consider leaving us a review!
    https://wordpress.org/support/theme/generatepress/reviews

    #369391

    Caleb – firstly install Simple CSS from the wordpress plugin directory and activate.
    Then go to WordPress dashboard > Appearance > Simple CSS.
    In the editor window Copy and Paste the code that Leo provided in the other link, And Save CSS.
    When you then preview your pages you will see the footer is sticky.

    You don’t need to use flexbox to do this. That code is more from a developers point of view when creating a site.

    #369487

    Leo – More than likely my lack of understanding. Thank you for the help

    Dave – Thank you for the explanation I will give that a try!

    #369515

    Leo
    Staff

    You should only have to add the CSS here to make it work: https://generatepress.com/forums/topic/has-sticky-footer-been-figured-out/#post-346811

    Want to help support GP? Please consider leaving us a review!
    https://wordpress.org/support/theme/generatepress/reviews

    #369520

    @leo Thank you! I will give it a go once I get off work. I appreciate all the help, its the main thing keeping me from going live.

    #369529

    Leo
    Staff

    Sounds good. It would be easier for us to help if we can see the site live and tell what’s working/not working 🙂

    Want to help support GP? Please consider leaving us a review!
    https://wordpress.org/support/theme/generatepress/reviews

    #369818

    @ Leo
    Hey! I got a chance to give it a go. It’s a win lose really and I think I will have to just work around it until we can pay a programmer. The footer sticks to the bottom. which is great for the pages that don’t have enough content. But I don’t want it there when I do have enough content. Like I said, I will have to find a way to work around it for now because I don’t see anyone posting anything that is what I’m looking for (The flexbox example site I linked was exactly the kind of behavior I’m looking to get someday.)
    Thank you again from everyone who gave me suggestions! I really appreciate it, seeing as I am so new to website building and have no coding knowledge! You guys rock! Will definitely be donating when I get some spare change 🙂

    #369856

    Leo
    Staff

    No problem! We really appreciate it 🙂

    Want to help support GP? Please consider leaving us a review!
    https://wordpress.org/support/theme/generatepress/reviews

    #384315

    In case this might be helpful for someone….

    I am having a similar issue with pages that have short content. For example, if someone searches on a word and there are no results returned, the height of the entire page is very short and the footer goes up too high. The result I’m going for is not really a “sticky” footer that always displays in a fixed position. Instead, it’s more a matter of adding extra padding to the main content so that it bumps the footer back down to a lower position on the page.

    To solve it, I added this CSS:
    .site-content {
    min-height: 100vh;
    }

    I don’t know if it’s the best solution or not, but it seems to at least help. I’ve only tested it on Chrome on Windows 10 laptop. I’d be interested to know how it displays on other devices.

    Best wishes,
    Denise

    #384360

    Leo
    Staff

    Can you provide a link? I can check for sure 🙂

    Want to help support GP? Please consider leaving us a review!
    https://wordpress.org/support/theme/generatepress/reviews

    #384713

    Leo
    Staff

    Hmm not seeing the footer being sticky…

    Want to help support GP? Please consider leaving us a review!
    https://wordpress.org/support/theme/generatepress/reviews

Viewing 14 posts - 1 through 14 (of 14 total)

You must be logged in to reply to this topic.