在Magento中调用外部js和css


Calling external js and css in Magento

我正在尝试将所有静态内容移动到CDN以提高Magento商店的性能。我可以在页面头部成功获取我想要的脚本标签,但我不知道如何将其放在正确的位置。

下面的代码在输出的其余部分下方输出原型.js脚本标记,因此它不起作用。基本上,我只想知道控制脚本元素顺序的最佳方法。

这是我的页面.xml布局文件在我的主题目录中。

<block type="page/html_head" name="head" as="head">
                <block type="core/text" name="cdn_prototype">
                    <action method="setText">
                        <text><![CDATA[<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/prototype/1.6.0.2/prototype.js"></script>]]></text>
                    </action>
                </block>
                <action method="addJs" ifconfig="dev/js/deprecation"><script>prototype/deprecation.js</script></action>
                <action method="addJs"><script>lib/ccard.js</script></action>
                <action method="addJs"><script>prototype/validation.js</script></action>
                <action method="addJs"><script>scriptaculous/builder.js</script></action>
                <action method="addJs"><script>scriptaculous/effects.js</script></action>
                <action method="addJs"><script>scriptaculous/dragdrop.js</script></action>
                <action method="addJs"><script>scriptaculous/controls.js</script></action>
                <action method="addJs"><script>scriptaculous/slider.js</script></action>
                <action method="addJs"><script>varien/js.js</script></action>
                <action method="addJs"><script>varien/form.js</script></action>
                <action method="addJs"><script>mage/translate.js</script></action>
                <action method="addJs"><script>mage/cookies.js</script></action>
                <action method="addJs"><script>dvm/menu.js</script></action>
                <block type="page/js_cookie" name="js_cookies" template="page/js/cookie.phtml"/>
                <action method="addItem"><type>skin_js</type><name>js/scripts.js</name></action>
                <action method="addCss"><stylesheet>css/styles.css</stylesheet></action>
                <action method="addItem"><type>skin_css</type><name>css/styles-ie.css</name><params/><if>lt IE 8</if></action>
                <action method="addItem"><type>skin_css</type><name>css/styles-ie-8.css</name><params/><if>lt IE 9</if></action>
                <action method="addCss"><stylesheet>css/widgets.css</stylesheet></action>
                <action method="addCss"><stylesheet>css/print.css</stylesheet><params>media="print"</params></action>
                <action method="addItem"><type>js</type><name>lib/ds-sleight.js</name><params/><if>lt IE 7</if></action>
                <action method="addItem"><type>skin_js</type><name>js/iehover-fix.js</name><params/><if>lt IE 7</if></action>
            </block>

这是如何做到的:

<block type="core/text" name="google.maps">
    <action method="setText">
        <text><![CDATA[<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>]]></text>
    </action>
</block>