Disabling CSS in Joomla modules and components

Today’s entry will be connected with extensions styling for Joomla! It offers us access to head section of a document, thanks to which it is possible to add script or CSS style from a module/component level. Some developers eagerly use this option in order to e.g. avoid embedding link elements inside body section of a storefront (which, by the way, causes validation errors). I will describe access and operations on head sections template for Joomla! next time as it is quite important and wide topic. But for this moment a little trick which can be useful while creating, e.g. a template for mobile devices.

When we are creating a template which is truncated from more features, e.g. layout for iPhone, we want to be sure that we load those CSS styles which we really need (we can also think of reducing of using transfer). Some extensions, e.g. K2, add styles directly to head section if we do not want to create tags manually, like title, meta and we just need such a code in our template:
<jdoc:include type="head" />

and additionally, we want to be sure that none of outside components will load CSS styles in our template and because of that, we have to get rid of them. How to do that?

Our solution to this problem will be a code below which should be placed somewhere on the end of a template:

<?php

    $document =& JFactory::getDocument();

    $headData = $document->getHeadData();

    $headData["styleSheets"] = array();

    $document->setHeadData($headData);

?>

If we had PHP5 installed on our server, we can get rid of an operator =& from the first line.

Script presented, loads the content of head section of our template to variable, cleans CSS styles table and saves head section in the new version. Thanks to this, we are sure that a user getting into subpage with component, will not see styling characteristic for component given, deleting styles in some cases might look tragically on cell phones.

One more comment – in the above code, head section is a structure which stores information about various tags, which are later on placed at the site by code:

<jdoc:include type="head" />

This structure is not the same as the whole head section content because apart from this listing we can add our CSS styles or scripts manually, which will not be visible in this structure.

Share
This article was first published May 10th, 2010