我开始使用Joomla并且正在编写一个简单的Joomla模块。我在我的模块中使用了一些自定义CSS和JS。现在,当我分发这个模块时,我需要我的JS / CSS文件与ZIP一起使用。我已将文件添加到模块ZIP文件中。
这是我需要知道的 -
如何在我的模块中引用这些CSS / JS文件,这样即使我将模块作为zip分发,我也不必单独发送css / js文件?
我尝试了不同的解决方案,包括 http://www.howtojoomla.net/how-tos/development/how-to-add-cssjavascript-to-your-joomla-extension但我无法弄清楚JS / CSS文件的URL应该是什么?
我正在使用托管在云托管网站上的Joomla 1.7。
由于
答案 0 :(得分:15)
我会说HowToJoomla网站的文章几乎总结了这个过程。
以下是添加了一些步骤的过程 - 希望这会有所帮助。
我假设您已经包装了您的扩展程序并且能够将您的css和javascript文件安装到服务器上。它们可能位于您的模块文件夹中,或者更准确地说它们应位于/ media /文件夹下的modules子文件夹中。
如果在安装模块后找不到您的css和js文件,因为您没有在组件的xml安装文件中正确引用它们。此页面包含有关1.6 / 1.7附加组件的xml安装/清单文件的信息,尽管它适用于组件:http://docs.joomla.org/Developing_a_Model-View-Controller_%28MVC%29_Component_for_Joomla!1.6_-_Part_01它们非常相似。
无论哪种方式 - 在Joomla的文件夹结构中找到您的文件,并记下他们从网站根目录的相对路径 - 即包含configuration.php的文件夹
现在在你的模块的php中 - 添加获取对JDocument对象的引用的行。
$document = JFactory::getDocument();
现在添加将您的javascript添加到html head区域的行:
$document->addScript('url/to/my/script.js');
显然将'url / to / my / script.js'替换为javascript的实际相对路径。
现在添加将你的css添加到html头部的行:
$document->addStyleSheet('url/to/my/stylesheet.css');
再次调整路径 - 例如可以是media / mod_mymodule / mymodule.css(如果你的模块被称为'mymodule')。
只有在需要注意的事项是你需要在退出php模式后在可执行的php标签中添加这些行,而不是在html区域内。
答案 1 :(得分:11)
您可以将js / css文件添加到/ media文件夹。
http://docs.joomla.org/Manifest_files#Media_files
只需添加到您的清单文件中:
<files>
...
</files>
<media folder="media" destination="mod_your_module">
<folder>css</folder>
<folder>js</folder>
</media>
在可安装程序包中,您现在应该拥有/ media文件夹。
然后添加到视图文件:
$doc =& JFactory::getDocument();
$doc->addScript("/media/mod_your_module/js/script.js");
本文解释了这种方法的好处:
http://blog.joomlatools.com/2008/09/hidden-feature-joomlas-media-folder.html
答案 2 :(得分:8)
您可以使用:
JHTML::script('modules/mod_your_module/js/script.js');
JHTML::stylesheet('modules/mod_your_module/css/stylesheet.css');
此示例不需要JFactory::getDocument()
答案 3 :(得分:6)
$document = JFactory::getDocument();
$modulePath = JURI::base() . 'modules/mod_your_module_name/';
//Adding JS Files
$document->addScript($modulePath.'js/myscript.js');
//Adding CSS Files
$document->addStyleSheet($modulePath.'css/style.css');
答案 4 :(得分:-1)
<script type="text/javascript" src="<?php echo JURI::BASE()?>modules/your_module_name/js/your_js_file"></script>
代表Css:
<link href="<?php echo JURI::BASE()?>modules/your_module_name/css/your_css _file" type="text/css" media="all" rel="stylesheet">