YOOtheme Pro is here! The best WordPress and Joomla theme. Learn more

Avatar no64 asked

YoothemePro: Push Footer to the bottom ?

Where can I find a way to have the footer always stay on bottom of the Viewport... no matter if the content fill the Main area?

*edit 1

ok... found a solution... but it is not so elegant:


How can I add a Class or ID to the "Main area" / Viewport then?
I think it should be possible to set the footer position to sticky

If inspecting the code of the "Home" page - I can see this:

    <div id="tm-main" class="tm-main uk-section uk-section-default" uk-height-viewport="expand: true" style="box-sizing: border-box;">  
        <div class="uk-container">  
            <div class="uk-grid uk-grid-stack" uk-grid="">  
                <div class="uk-width-expand@m uk-first-column">  
                    <article id="article-1">  


Here we have a div called "tm-main" and "uk-height-viewport="expand: true" " is set.

But a page made with the Page Builder don't have that "tm-main":

    <div class="uk-section-default uk-section">  
        <div class="uk-container">  

This is all!
Why do it not have the class "tm-main" or id "tm-main"?

*edit 2

How or where can I set the Data attribute "uk-height-viewport"?
I can't find a way to set Data attributes to sections nor to the Main area in the "Page Builder".

  • UIkit
  • YOOtheme Pro


4 Answers


Avatar michael.anlauf Support answered

Not quit sure what you try to achieve. Your headline says that you want the footer sticky but in the text you write about the main part of the page.
How ever, you should take a look here.
In case you want the footer sticky you should of course edit this part or the content of the footer.

Regards, Michael tucfoto
Slideshow design


Avatar no64 answered

Hi Michael,

... you are right.. asking for a "sticky" footer is not what I am trying to do.
I need to strech the main part of the page to push the footer to the bottom of the viewport no matter ho much vonten i have in the main part.


Avatar michael.anlauf Support answered

That's answered in the link you posted in your question. I advice reading studying carefully the UIkit page.
The custom code script field you find in YOOtheme / settings.



Avatar no64 answered

Yes... I push the footer down with "stretching" the section,.... but in the page builder there is no way to do that with the "main content".
There is no ID or Class "tm-main" ... as I wrote .. I wonder why.

I know where to find the custom code area and how to use it... but why do it have to be that complicatet... should be a built in feature.

Anyway... fixing the foooter to the bottom with css will also work.

Know someone who can answer? Share a link to this question via email or twitter.