2

It appears ABSOLUTE filespecs to external files work for CSS (addLinkRel) but not JS (addJs). The sytem always prepends the site domain+path when using addJs.

<layout version="1.0.0">
    <adminhtml_mypage_index>
        <reference name="head">
            <action method="addJs">
              <!-- This does not work ... -->
              <name>//cdn.... .js</name>
            </action>
            <action method="addLinkRel">
                <!-- ... but this does! -->
                <rel>stylesheet</rel>
                <href>//cdn.... .css</href>
            </action>

This forces me to a confusing inconsistency whereby the CSS files on, say a CDN, can be specified declaratively in the layout .xml, but the associated external JS files on the same CDN need to go in the .phtml. Is there a better way?

One would hope one could could keep these file references together in a logical place.

Should I move both the JS and CSS declarations from the layout .xml to the associated .phtml so that they're kept together? One could argue this then defeats the purpose of using .xml to declaratively specify JS and CSS.

Suggestions?

  • You can specify the CDN URL as skin URL in admin panel. So all js/CSS will load CDN – MeenakshiSundaram R Jul 7 '15 at 3:48
6

To add the external js file there is no native function in magento. But you can add the js file through layout by following code

<reference name="head">
    <block type="core/text" name="unique-name">
        <action method="setText">
            <text><![CDATA[<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>]]></text>
        </action>
    </block>
</reference>
  • I was looking for a hard-coded solution, not a solution that requires extra config via the UI, so I feel this is what comes closest to what I'm after. Great to know it can be done through the admin panel too. Thanks philwinkle and Meenaskshi. – fris Jul 7 '15 at 5:57
  • Can I add <block type="core/text" name="unique-name"> <action method="setText"> <text><![CDATA[<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>]]></text> </action> </block> inside <head></head> of xml ? OR include directly like this in xml <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js" src_type="url" /> – Slimshadddyyy Mar 22 '18 at 12:37
4

I like Meenakshi's approach. I use this approach for all third-party scripts. A good example is found here in my canonical question about including jQuery from Google CDN:

Google CDN jQuery with Local Fallback in Magento Layout XML

However, there's another way which may or may not prove appealing: Instead of including in the head with layout XML, instead include it via the Admin panel in System > Config > Design and in the HTML Head dropdown:

enter image description here

  • I keep forgetting about this box. It's a great way to add debugging or testing js then get rid of it - for example jquery-migrate to see if an extension that came with an old version can work fine on a new one etc. Thanks for the reminder – iphigenie Jul 29 '17 at 18:34
  • We can include third part JS like this also in XML - <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js" src_type="url" /> – Slimshadddyyy Mar 22 '18 at 12:37

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.