Javascript 如何将CSS文件添加到Magento中的自定义小部件？

因此，我为Magento定制了小部件（如产品幻灯片）

并希望将自定义CSS/Javascript添加到我的小部件中

我不想每次都显示（加载）CSS/JS文件

---

我只想在页面包含自定义小部件时加载JS/CSS。

---

谢谢。

这取决于您是否已将您的小部件添加为小部件实例（CMS->Widgets），或者是否已将其包含在页面、静态块或电子邮件的内容区域中，例如：

{{widget type=“blablablabla/carousel”}

如果已将其作为小部件实例包含，则可以添加资产，如下所示：

protected function _prepareLayout() {
    if ($head = $this->getLayout()->getBlock('head')) { 
        $head->addCss('myfile.css');
    }
    return parent::_prepareLayout();
}

…在实现

Mage\u Widget\u block\u接口的块中

（见附件）

顺便说一句，当您将小部件作为模板指令内联时，不可能添加资产。这仅仅是因为HTML头已经输出了它的HTML：模板指令（例如

{{widget}

或

{{var}}

）在块的{u-toHtml阶段被注意到。对已渲染的块调用任何方法都不会产生任何效果

另请参见

Mage\u Cms\u Block\u页面

protected function _toHtml()
{
    /* @var $helper Mage_Cms_Helper_Data */
    $helper = Mage::helper('cms');
    $processor = $helper->getPageTemplateProcessor();
    $html = $processor->filter($this->getPage()->getContent());
    $html = $this->getMessagesBlock()->toHtml() . $html;
    return $html;
}

我知道这个问题已经很老了，但如果有人想在包含magento小部件的情况下添加CSS或javascript（而不需要像Erfan给出的答案那样要求它是“小部件实例”），我建议在phtml模板文件中使用一个小ajax脚本。如果您的设计包不使用jQuery，那么您的代码可能会有所不同

jQuery(document).ready(function(){
jQuery.when(
    jQuery.ajax({
        type: "GET",
        url: "<?php echo $this->getSkinUrl('css/myWidget.css');?>",
        success: function(data){
            jQuery("head").append("<style>" + data + "</style>");
        },
        dataType: "html",
        cache: false,
    }),
    jQuery.ajax({
        type: "GET",
        url: "<?php echo $this->getSkinUrl('js/myWidget.js');?>",
        dataType: "script",
        cache: false,
    })

).then(function(){
        myWidget.setupFunction();
    });   
});

jQuery（文档）.ready（函数（）{
jQuery.when(
jQuery.ajax({
键入：“获取”，
url:“”，
成功：功能（数据）{
jQuery（“head”）.append（“+data+”）；
},
数据类型：“html”，
cache:false，
}),
jQuery.ajax({
键入：“获取”，
url:“”，
数据类型：“脚本”，
cache:false，
})
).然后（函数（）{
myWidget.setupFunction（）；
});   
});
如果有一种特定类型的页面包含小部件，则只能在相关布局中添加js。您将在哪里显示小部件？我希望在任何页面类型上插入小部件。并且只想在页面上包含小部件时添加自定义JS/CSS。我不想为每种类型的页面编辑布局XML。所以，我仍然在为Magento小部件寻找JS/CSS解决方案。但想想Magento，我的想法没有解决方案(