Question

I'm building a custom template using Bootstrap 3 in Joomla 3. I'd like to modify some of the head output - ideally moving some of the JS to the footer for performance, combining some of the generated css files into one, etc...

Is there an easy way of doing this? I've used template overrides but no luck - searched but haven't found anything remotely useful except for scripts that unset everything in the head first like a reset.

Thanks!

Was it helpful?

Solution

There is no way of doing this "easily".

While Joomla does collect all scripts and css before rendering them, a large number of extensions simply output the <script> and <style> tags in the markup.

So the only real solution is to write a system plugin that parses all the resources and performs the optimizations.

The best implementation you can find is toomanyfiles, which handles this correctly for css but not completely for js: the issue with js is that you can't simply move all js to the bottom: modernizr and other libraries affect the classes and need to be loaded in the head; and many libraries and frameworks (even bootstrap) have some methods that output markup directly, not to mention document.write(): if this is your case, you'll have to discriminate manually.

You can get over 95% of what you need from it.

An honorable mention goes to JCH Optimize which is even less complete but follows a similar approach.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top