Это относится к версии 1.5.? или выше!
Чтобы правильно сформированный XHTML документа, необходимо поместить все ссылки на Javascript и CSS файлов в <head> часть. Так как Joomla! порождает все HTML, который составляет страницы перед выводом, можно добавить эти ссылки на <head> тег из вашего расширения. Простейший способ сделать это, чтобы использовать встроенные возможности в Joomla!:
// Add a reference to a javascript file
// The default path is 'media/system/js/'
JHTML::script($filename, $path, $mootools);
// Add a reference to a CSS file
// The default path is 'media/system/css/'
JHTML::stylesheet($filename, $path);
Используя эти функции, Joomla! будет заботиться о любых дополнительных требований. Например, если Ваш JavaScript требует Mootools, установив $ MooTools = True автоматически обеспечить Mootools загружается, если она еще не было сделано.
Тем не менее, выше функций не будет достаточно гибкой для каждого сценария, и так можно подключиться к основной функциональности, а не. (Конечно, это означает, что вы также должны вручную код некоторые шаги, которые будет сделано автоматически с помощью функции выше!)
Во-первых, вам нужно получить ссылку на текущий объект документа:
$document =& JFactory::getDocument();
Чтобы добавить файл JavaScript, используйте этот код:
$document->addScript($url);
Заметим, что это не будет автоматически включать Mootools. Если сценарий требует Mootools, Вы должны также включить строку:
JHTML::_("behavior.mootools");
Для стилей, используйте этот код:
$document->addStyleSheet($url);
Однако, ваш JavaScript или CSS не может находиться в отдельном файле - вы можете создавать их использованием PHP. В этом случае вы можете написать скрипт / стилей прямо в голову вашего документа:
// Add javascript
$document->addScriptDeclaration($javascript, $type);
// Add styles
$document->addStyleDeclaration($styles, $type);
Например, следующий код используется для определения пользовательских отзыв инструмент, который использует MooTools.
function getToolTipJS($toolTipVarName, $toolTipClassName){
$javascript = 'window.addEvent(\"domready\", function(){' ."\n";
$javascript .= "\t" .'var $toolTipVarName = new Tips($$("' . $toolTipVarName .'"), {' ."\n";
$javascript .= "\t\t" .'className: "' .$toolTipClassName .'",' ."\n";
$javascript .= "\t\t" .'initialize: function(){' ."\n";
$javascript .= "\t\t\t" .'this.fx = new Fx.Style(this.toolTip, "opacity", {duration: 500, wait: false}).set(0);' ."\n";
$javascript .= "\t\t" .'},' ."\n";
$javascript .= "\t\t" .'onShow: function(toolTip){' ."\n";
$javascript .= "\t\t\t" .'this.fx.start(1);' ."\n";
$javascript .= "\t\t" .'},' ."\n";
$javascript .= "\t\t" .'onHide: function(toolTip) {' ."\n";
$javascript .= "\t\t\t" .'this.fx.start(0);' ."\n";
$javascript .= "\t\t" .'}' ."\n";
$javascript .= "\t" .'});' ."\n";
$javascript .= '});' ."\n\n";
return $javascript;
}
$document =& JFactory::getDocument();
$document->addStyleSheet("/joomla/components/com_mycustomcomponent/css/mytooltip.css",'text/css',"screen");
$document->addScriptDeclaration(getToolTipJS("mytool","MyToolTip"));
(Заметим, что для того, чтобы это JavaScript функционально полезной, необходимо будет включить соответствующее имя класса в HTML, а также предоставление mytooltip.css файл. Оба выходят за рамки данной статьи.)
Там будут какие-то случаи, когда даже эти функции не являются достаточно гибкими, так как они ограничены в письменной форме содержания <script /> или <style /> метки, и не может добавить что-либо за пределами этих тегов. Примером может служить включение стилей ссылку в условных комментариев, так что он взял только Internet Explorer 6 и выше. Для этого мы можем использовать $document->addCustomTag:
$stylelink = '<!--[if lte IE 6]>' ."\n";
$stylelink .= '<link rel="stylesheet" href="/../css/IEonly.css" />' ."\n";
$stylelink .= '<![endif]-->' ."\n";
$document =& JFactory::getDocument();
$document->addCustomTag($stylelink);
