OK, so here is a custom solution as requested. This fix works for current Files app 5.5.0, but I cannot guarantee it will work for future releases. Also to note, you want a custom header, so there is no styling included in this custom element, because I don't even know what it will be used for. You will need to add custom CSS yourself to set background, colors, font size, paddings etc.
Custom header element
- Open Files
index.php
in code/text editor.
- Locate around line 1876
<nav id="topbar" ...
.
- Create new line below
<div class="my-header">test</div>
and save.
- Load in browser, you will see "test" in the header, entirely un-styled.
If you want to style the header, create a file _files/css/custom.css
, and for example add this:
.my-header {
background: linear-gradient(90deg, #1c2429, #263238);
padding: 10px;
color: white;
}
Custom footer element
This is actually more complicated, because unlike the custom header, where will you put the element? All elements need to go into another element, and there is no element at the bottom of the screen in Files app. Besides, would it be "fixed" (always visible on scroll)? Or attached below the current scrollable gallery items? ... In which case, if there are only a few items, the footer will be high be high up on the page.
I could offer a simple solution with CSS to add text (no html) at bottom of page. Adding an actual DOM element that supports HTML requires more logic.