将外部JavaScript文件添加到Magento

如何将外部JavaScript文件添加到Magento,所以它的代码将被包含在每个前端页面?

将JS文件放到“js”文件夹中,在XML布局中可以包含它:

<reference name="head"> <action method="addJs"><script>folder/file.js</script></action> </reference> 

希望有所帮助。

编辑:你也可以在你的块中做到这一点:

  protected function _prepareLayout() { $this->getLayout()->getBlock('head')->addJs('path/from/js/folder/to/your/file.js'); return parent::_prepareLayout(); } 

要添加一个外部JS没有任何问题使用这个:

 <reference name="head"> <block type="core/text" name="google.cdn.jquery"> <action method="setText"> <text> <![CDATA[<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script><script type="text/javascript">jQuery.noConflict();</script>]]> </text> </action> </block> </reference> 

您可以使用Inchoo_Xternal扩展名。 所以你可以做这样的事情:

 <layout version="0.1.0"> <default> <reference name="head"> <action method="addItem"><type>external_css</type><name>http://developer.yahoo.com/yui/build/reset/reset.css</name><params/></action> <action method="addItem"><type>external_js</type><name>http://yui.yahooapis.com/2.8.2r1/build/yahoo-dom-event/yahoo-dom-event.js</name><params/></action> <action method="addExternalItem"><type>external_js</type><name>http://yui.yahooapis.com/2.8.2r1/build/imageloader/imageloader-min.js</name><params/></action> <action method="addExternalItem"><type>external_css</type><name>http://yui.yahooapis.com/2.8.2r1/build/fonts/fonts-min.css</name><params/></action> </reference> </default> <catalog_product_view> <reference name="head"> <action method="removeItem"><type>external_css</type><name>http://developer.yahoo.com/yui/build/reset/reset.css</name><params/></action> <action method="removeItem"><type>external_js</type><name>http://yui.yahooapis.com/2.8.2r1/build/yahoo-dom-event/yahoo-dom-event.js</name><params/></action> <action method="removeExternalItem"><type>external_js</type><name>http://yui.yahooapis.com/2.8.2r1/build/imageloader/imageloader-min.js</name><params/></action> <action method="removeExternalItem"><type>external_css</type><name>http://yui.yahooapis.com/2.8.2r1/build/fonts/fonts-min.css</name><params/></action> </reference> </catalog_product_view> </layout> 

在这里你可以find更多关于这个信息。

 <block type="core/text" name="jquery"> <action method="setText"> <text> <script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js?ver=3.9.2"></script> </text> </action> </block> 

创build/编辑以下内容:

 app/design/frontend/PATH/TO/YOURTHEME/layout/local.xml 

让它看起来像这样 – 应该是自我解释…

 <!-- Add an EXTERNAL stylesheets --> <action method="addLinkRel"><rel>stylesheet</rel><href>https://fonts.googleapis.com/css?family=Roboto+Condensed:300italic,400,300,700|Open+Sans:300italic,400,300</href></action> <!-- Add an EXTERNAL javascript --> <action method="addLinkRel"><rel>text/javascript</rel><href>https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js</href></action> <!-- Add stylesheets from your local theme directory located in skin/frontend/ --> <action method="addCss"><stylesheet>css/styles.css</stylesheet></action> <!-- Add javascript from your local theme directory located in skin/frontend/ --> <action method="addJs"><script>bootstrap.min.js</script></action> 

方法“addItem”并input“link_rel”来从page.xml添加外部的css文件

 <action method="addItem"><type>link_rel</type> <name>//vjs.zencdn.net/4.12/video-js.css</name><params>rel="stylesheet"</params></action> 

与2.1.7一起正常工作

应用程序/devise/前端/ PATH / TO / YOURTHEME /布局/ default_head_blocks.xml

 <?xml version="1.0"?> <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <head> <css src="css/bootstrap.min.css" /> <css src="css/YOUR.css" order="99" /> <link src="js/jquery.js" /> <link src="js/bootstrap.js" /> <link src="js/YOUR.js" /> </head> </page>