Search code examples
javascriptasynchronousprototypemagento-1.9.1

HTML <script> async Attribute in Magento


I would like to try to insert the "async" attribute in Prototype JavaScript script tag in Magento 1.9.1:

<script type="text/javascript" src="http://www.mywebsite.com/media/js/ec1651c8b1a4ea49a916679f1e120ccf.js"></script>

I would have this result:

<script type="text/javascript" src="http://www.mywebsite.com/media/js/ec1651c8b1a4ea49a916679f1e120ccf.js" async></script>

Where I have to insert "async"? What is the file with this line code? Thanks


Solution

  • Look at the file app/design/frontend/<yourlayout>/<yourtheme>/layout/page.xml (or copy app/design/frontend/base/default/layout/page.xml into your theme).

    Inside this file, search for the following lines:

    <!-- ... -->
    <block type="page/html_head" name="head" as="head">
        <action method="addJs"><script>prototype/prototype.js</script></action>
        <!-- ... -->
    </block>
    <!-- ... -->
    

    And change addJs calls by:

    <!-- ... -->
    <block type="page/html_head" name="head" as="head">
        <action method="addJs"><script>prototype/prototype.js</script><params>async</params></action>
        <!-- ... -->
    </block>
    <!-- ... -->
    

    As your are using the merging javascript feature of magento, you need to apply this change to every addJs definition, because Magento will group files by params.