Footer is loading before other elements on the page, can I delay it?

flaky

I included the html code I wrote in the footer from the settings > appearance > custom footer area. The footer appears before anything else on the page. The reason I use the footer here is because I don't find the current footer application useful.

Can I set the html part in the footer section to be loaded last on the page?

Also, is there a way I can set the loading order of the elements on the page?

clarkwinkelmann

If you want to only show the footer after the Flarum Single Page App finished loading, you will have to use the extension API and hook into the Flarum mount method or similar.

You could also delay it by a specific amount of time, but you won't be able to predict how long the Flarum SPA takes to render.

If your concern is that the footer appears too high on the page before being pushed down, maybe you can solve the issue by assigning a min-height to the app container?

flaky

Thanks for your response. @clarkwinkelmann

I've included the solution I found below.

<div id="customFooter" style="display: none;"> 

</div>

<script>
    document.addEventListener("DOMContentLoaded", () => {
        document.getElementById("customFooter").style.display = "block";
    });
</script>