Breadcrumbs

Подключение JS, CSS из любого расширения Joomla

Подключаем стили, скрипты или кастомные теги из модулей, плагинов, компонентов или шаблона

head

Во-первых, нужно получить ссылку на текущий объект документа, без этого - никак.

$document = JFactory::getDocument(); // Подключаем один раз

Подключить файл CSS или JS

$document->addStyleSheet($url); // для стилей

$document->addScript($url); // для Javascript

где $url - переменная, содержащая полный путь к файлу javascript или CSS, например: JUri::base() . 'templates/custom/js/sample.js'

defer async

Так же для скриптов можно передать параметры:

  • Тип скрипта, если это не JavaScript,
  • defer
  • async
$doc->addScript('/media/system/js/sample.js', "text/javascript", true, false);
$doc->addScript('/media/system/js/sample.js', "text/javascript", false, true);

Если у тега SCRIPT есть атрибут async или defer(true), то браузер ставит его в очередь на загрузку и, не задерживаясь, продолжает отображать страницу.
Когда скрипт загрузится — он выполнится.
Разница между этими двумя атрибутами заключается в том, что defer сохраняет порядок выполнения скриптов, а async — нет.

Инлайн стили и скрипты

// Javascript
$document->addScriptDeclaration('
    window.event("domready", function() {
        alert("An inline JavaScript Declaration");
    });
');

// CSS
$style = 'body {'
        . 'background: #00ff00;'
        . 'color: rgb(0,0,255);'
        . '}'; 
$document->addStyleDeclaration($style);

Или свой тег

$stylelink = '<!--[if lte IE 6]>' ."\n";
$stylelink .= '<link rel="stylesheet" href="/../css/IEonly.css" />' ."\n";
$stylelink .= '<![endif]-->' ."\n";

$document = JFactory::getDocument();
$document->addCustomTag($stylelink);

Для шаблона вроде как есть более удачный вариант:

$this
   ->addStyleSheet('/templates/'.$this->template.'/css/template.css')
   ->addStyleSheet('/templates/'.$this->template.'/css/menu.css')
   ->addScript('/templates/'.$this->template.'/js/menu.js');

Почему удобнее написано тут: https://joomlaforum.ru/index.php/topic,278856.msg1387215.html#msg1387215 

Перенос скриптов вниз страницы

Да так, чтоб они подключались из любого расширения Joomla.

в шаблоне

$path = $this->baseurl . '/templates/' . $this->template . '/';
// Add JavaScript Frameworks
$this->footerScript[$path . 'js/jquery-1.9.1.min.js'] = 1;
$this->footerScript[$path . 'js/bootstrap.min.js'] = 1;
$this->footerScript[$path . 'js/common.js'] = 10;

в конце шаблона

<?php
if (is_array($this->footerScript))
{
$scriptHtml = '';
asort($this->footerScript, SORT_NUMERIC);
foreach (array_keys($this->footerScript) as $script):
$scriptHtml .= '<script src="' . $script . '"></script>';
endforeach;
echo $scriptHtml;
}
?>
</body>

В любом расширении

$doc = JFactory::getDocument();
$doc->footerScript[ 'myPath/myScript.js'] = 1; // оперируя цифрами в значении мы оперируем порядком вывода

Ссылки и благодарности

Взято из документации: docs.joomla.org

С JoomlaForum:

  • вот тема,
  • Про defer и async
  • Загрузка внизу