xml - 如何通过 CMS 将外部 jQuery 添加到 Magento ？

Question

在 Magento 安装中，我试图将 xml 插入到我主页的布局更新 XML 中。我已经有一些正在工作的 xml，但我想添加一个 jQuery 脚本来运行我的幻灯片。我在 page.xml 中有它(并计划在某个时候将它移动到我的 local.xml)，它在那里工作，但它破坏了产品页面上的添加到购物车。所以，我想我会合并到主页上，并将其放入布局更新 XML。由于某种原因，它没有通过。

<reference name="head">
<action method="addJs"><script>jquery/jquery-1.7.1.noConflict.min.js</script></action>
<action method="addJs"><script>folder/slider.js</script></action>
</reference>

任何想法为什么它会在我的 page.xml 中工作而不是在这里？

这是page.xml中的嵌套思想

<default translate="label" module="page">
    <label>All Pages</label>
    <block type="page/html" name="root" output="toHtml" template="page/3columns.phtml">
        <block type="page/html_head" name="head" as="head">
            <action method="addJs"><script>prototype/prototype.js</script></action>

Answer 1

您可以执行以下操作:

将 javascript 添加到 local.xml

<layout version="0.1.0">
<default>
   <reference name="head">
      <action method="addJs"><script>jquery/jquery-1.7.1.min.js</script></action>
      <action method="addJs"><script>jquery/carouFredSel.js</script></action>
   </reference>
</default>
</layout>

然后制作一个自定义主页模板(引用 1column.phtml )，从 CMS 中为主页选择此模板。

将以下内容放入“设计”选项卡的主页“XML 布局更新”部分。
这是我的设置，我从主页中删除了整个原型(prototype)脚本是因为不想要。

<reference name="head">
<action method="removeItem"><type>js</type><script>prototype/prototype.js</script></action>
<action method="removeItem"><type>js</type><script>prototype/validation.js</script></action>
<action method="removeItem"><type>js</type><name>scriptaculous/builder.js</name><params/></action>
<action method="removeItem"><type>js</type><name>scriptaculous/effects.js</name><params/></action>
<action method="removeItem"><type>js</type><name>scriptaculous/dragdrop.js</name><params/></action>
<action method="removeItem"><type>js</type><name>scriptaculous/controls.js</name><params/></action>
<action method="removeItem"><type>js</type><name>scriptaculous/slider.js</name><params/></action>
<action method="removeItem"><type>js</type><name>lib/ccard.js</name><params/></action>
<action method="removeItem"><type>js</type><name>varien/menu.js</name><params/></action>
<action method="removeItem"><type>js</type><name>varien/js.js</name><params/></action>
<action method="removeItem"><type>js</type><name>mage/translate.js</name><params/></action>
<action method="removeItem"><type>js</type><name>varien/form.js</name><params/></action>
<action method="removeItem"><type>skin_js</type><script>js/prototype.formalize.min.js</script></action>
<action method="removeItem"><type>skin_css</type><name>css/formalize.css</name><params/></action>

另外，不要创建特定的 noConflict 页面，只需将运行良好的 jQuery 脚本结束即可。

例如，这是我的:
jQuery&&define("jquery",[],function(){return f})})(window);var $jQuery = jQuery.noConflict();
另外，你应该创建 jquery根目录下的文件夹 js目录，不在皮肤文件夹中 js目录。