Magento – way to load an external CSS file in local.xml

cssexternal

I found out on Google CDN jQuery with Local Fallback in Magento Layout XML from @philwinkle answer that an external js can be loaded to the "head" via local.xml. Is there also a way to load an external css file via Magento's local.xml so that edits to head.phtml can be avoided?

Best Answer

As @Philwinkle said, you can modify the code from the post he previously posted.

<default>
    <reference name="head">
        <block type="core/text" name="your_external_csv">
            <action method="setText">
                <text><![CDATA[<link rel="stylesheet" type="text/css" href="http://path.com/to/stylesheet.css">]]>
                </text>
            </action>
        </block>
    </reference>
</default>

It's important to understand what Magento is actually doing here so you understand how to modify it. A new block is created using the Mage_Core_Block_Text class. This class only has 4 methods: to get, add and set text and a _toHtml method that automatically outputs the text when the block is echoed in a phtml file.

In the block you've created just now you're using the <action> tag with attribute method, setText to imply that Magento should create the block and then call the following method or function of this block with, in this case, as argument your external CSS tag. So It doesn't really matter what you give as argument, it will always be outputted in the phtml.