Why this article?

One would think that changing the footer line produced by the Joomla Protostar template would be a fairly common thing to want to to do, but I was not able to find a definitive description of how to do it that I considered really good. So maybe my demands are too exotic?

  • I want to use the standard Joomla Protostar template as-is, without having to make a copy of it. (This is apparently a controversial point of view - I've seen it strongly recommended that you should make a copy, rather than using the standard files.)
  • I don't want to modify the index.php or template.css files associated with the template, because I don't want to be in a situation where an automatic update to a new version of Joomla results in my modified files being overwritten, and my modifications no longer in operation.

Anyway, just so we are completely clear on what we're talking about, the footer line is the line at the bottom of every page where it shows something like this:

   © 2018 Merlinia A/S                                                                                   Back to Top

where the "Back to Top" part is right-justified and multi.lingual and clickable.

This article is based largely on suggestions by user "Jaydot" on the Joomla support forum - many thanks.

    How to edit the footer content?

The simple version

Here's how I recommend that you do it, using techniques that will work as long as you don't need to include use of PHP in generating your footer line text.

If you haven't already done so, create a user.css file in the same folder as where the Protostar template.css file is. Add these lines to the user.css file:

/* Suppress the footer line produced automatically by Protostar, and enable the footer line produced by my
"Custom footer line" module. */
/* See https://forum.joomla.org/viewtopic.php?f=708&t=924170 */
.footer p {
display: none;
}
.footer .custom p {
display: inline;
}

Once you've saved the new or updated user.css file the default footer line should be gone. Check that this is indeed the case, otherwise something is wrong.

Now create a "custom module" to show the text that you want to display on the footer line. Using the administrator / back-end access to your Joomla website, use Extensions - Modules, and then click on New. As module type select Custom. Give the new module a name, for example "Custom footer line", and as position select Protostar - footer.

CustomFooter Snap1

Now enter the text, or whatever, that you want to place on the footer line, and click Save.

Check that it works. If so, and if all you wanted was simple text, then you're done.

Adding PHP or other fancy stuff

The simple footer line created above does not include the "Back to Top" link over at the right end of the line. If you want to add that in the same way Protostar does it by default (a multi-lingual link), then you need to insert some PHP code. Or maybe you want to insert some HTML code that the Joomla editor likes to throw away. In this case you need to do more work.

My recommendation is that you install an extension named Sorcerer, which you can download from here: Regular Labs Sorcerer

Due to the intrinsic problems involved in editing HTML and PHP with a web browser, which is trying to interpret all HTML tags instead of considering them to be text data, you should learn a bit about how Sorcerer provides an editing button and something they call the "double bracket syntax". See Sourcerer tutorial - syntax.

Now go back to editing your "Custom footer line" module. After a bit of fiddling around with the Code button at the bottom of the editor, and getting used to the strange "double bracket syntax", you should be able to end up with something like this:

<p> Copyright © 2017-2018, Merlinia A/S {source} [[p class="pull-right"]] [[a href="#top" id="back-top"]] [[?php echo JText::_('TPL_PROTOSTAR_BACKTOTOP'); ?]] [[/a]] [[/p]] {/source} </p>

The "{source}" and "{/source}" tags are used by the Sorcerer extension, and the strange "[[" and "]]" character sequences denote "<" and ">".

Check that the footer line is now the way you want it.

You must login to post a comment.
Loading comment... The comment will be refreshed after 00:00.
  • This commment is unpublished.
    Jaydot · 5 months ago
    Hi! Interesting post :). Though... Sourcerer needs to be entered in the WYSIWYG editor, not in the code editor...
    ps I added some understandable text to my own front page.
    • This commment is unpublished.
      Rennie Petersen · 5 months ago
      Thank you very much for your comment. I think I've got it right now ...
  • This commment is unpublished.
    Jeffrey Fox · 5 months ago
    Rennie, this worked great for me on my site. Thanks for taking the time to make this writeup.