Решил создать шаблон с нуля. Отключаю ненужные файлы // Отключаем ненужные Код (CODE): $headlink = $this->getHeadData(); unset($headlink['scripts']['/media/jui/js/bootstrap.min.js']); $this->setHeadData($headlink); А затем подключаю уже сам бутстрап Код (CODE): $doc = JFactory::getDocument (); // Add JavaScript Frameworks $doc->addScript ( $this->baseurl . '/templates/' . $this->template . '/bootstrap/js/bootstrap.min.js' ); // Load Bootstrap CSS $doc->addStyleSheet ( $this->baseurl . '/templates/' . $this->template . '/bootstrap/css/bootstrap.min.css' ); И ещё доп. вещи в head как написано у разработчика Код (CODE): <head> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script> <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> <jdoc:include type="head" /> Но когда захожу на сайт, то вижу, что он подключен. Но идет ошибка Код (CODE): disk-button.min.js:1 Uncaught TypeError: Cannot read property 'defaultView' of null at Object._getElementStyles (disk-button.min.js:1) at Object._isTrimmingByOverflow (disk-button.min.js:1) at Object.findTrimmingParent (disk-button.min.js:1) at Object.getTrimmedBounds (disk-button.min.js:1) at Object._appendOpaque (disk-button.min.js:1) at Object.getAllOpaques (disk-button.min.js:1) at Object._getImageUnder (disk-button.min.js:1) at Object._updateImage (disk-button.min.js:1) at Object.imageUnderCursor (disk-button.min.js:1) at Object.imgUnderCursor (disk-button.min.js:1) Что такое не пойму. Помогите пожалуйста. Думал из за того что я в head подгрузил, да нет, не влияет на это дело никак. Та же самая ошибка идет и с ними и без.
Яваскрипты подключают после CSS. И пробуй пока без яваскрипт. Код (html): <jdoc:include type="head" /> <!-- Подключаю Bootstrap 4 --> <link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/css/bootstrap.min.css" >
Путем отключения и включения, так как Joomla 3.8 использует js старую, еще 1 версии Код (CODE): // Отключаем ненужные $headlink = $this->getHeadData(); unset($headlink['scripts']['/media/system/js/caption.js']); unset($headlink['scripts']['/media/system/js/validate.js']); unset($headlink['scripts']['/media/jui/js/jquery.min.js']); unset($headlink['scripts']['/media/jui/js/jquery-migrate.min.js']); unset($headlink['scripts']['/media/jui/js/bootstrap.min.js']); unset($headlink['scripts']['/media/jui/js/jquery-noconflict.js']); $this->setHeadData($headlink); И подключения последней Код (CODE): <head> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/> <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script> <jdoc:include type="head" /> Ошибки стали вида Код (CODE): Uncaught TypeError: Cannot read property 'push' of undefined at widgetkit-54e5a887.js:3 at widgetkit-54e5a887.js:3 (anonymous) @ widgetkit-54e5a887.js:3 (anonymous) @ widgetkit-54e5a887.js:3 (index):55 Uncaught ReferenceError: JCaption is not defined at (index):55 at dispatch (jquery-3.3.1.min.js:2) at y.handle (jquery-3.3.1.min.js:2) ну с первой понятно. Я вообще поубираю сейчас widgetkit, он просто в сборке моей стоял и сейчас я его не применяю --- добавлено: 23.05.2018, первое сообщение размещено: 23.05.2018 --- После подключения обычных css снова вышла ошибка первого уровня Код (CODE): Uncaught ReferenceError: JCaption is not defined at (index):52 at dispatch (jquery-3.3.1.min.js:2) at y.handle (jquery-3.3.1.min.js:2) (anonymous) @ (index):52 dispatch @ jquery-3.3.1.min.js:2 y.handle @ jquery-3.3.1.min.js:2 load (async) add @ jquery-3.3.1.min.js:2 (anonymous) @ jquery-3.3.1.min.js:2 each @ jquery-3.3.1.min.js:2 each @ jquery-3.3.1.min.js:2 De @ jquery-3.3.1.min.js:2 on @ jquery-3.3.1.min.js:2 (anonymous) @ widgetkit-54e5a887.js:3 (anonymous) @ widgetkit-54e5a887.js:3 disk-button.min.js:1 Uncaught TypeError: Cannot read property 'defaultView' of null at Object._getElementStyles (disk-button.min.js:1) at Object._isTrimmingByOverflow (disk-button.min.js:1) at Object.findTrimmingParent (disk-button.min.js:1) at Object.getTrimmedBounds (disk-button.min.js:1) at Object._appendOpaque (disk-button.min.js:1) at Object.getAllOpaques (disk-button.min.js:1) at Object._getImageUnder (disk-button.min.js:1) at Object._updateImage (disk-button.min.js:1) at Object.imageUnderCursor (disk-button.min.js:1) at Object.imgUnderCursor (disk-button.min.js:1) --- добавлено: 23.05.2018 --- бутстраповские данные у меня в папке бутстрап, но это не суть важно. не пойму как же правильно сделать. Проще решил выслать сам index.php
Спойлер: Без яваскриптов Код (html): <?php defined('_JEXEC') or die; /** @var JDocumentHtml $this */ $app = JFactory::getApplication(); $user = JFactory::getUser(); // Output as HTML5 $this->setHtml5(true); // Getting params from template $params = $app->getTemplate(true)->params; // Detecting Active Variables $option = $app->input->getCmd('option', ''); $view = $app->input->getCmd('view', ''); $layout = $app->input->getCmd('layout', ''); $task = $app->input->getCmd('task', ''); $itemid = $app->input->getCmd('Itemid', ''); $sitename = $app->get('sitename'); if ($task === 'edit' || $layout === 'form') { $fullWidth = 1; } else { $fullWidth = 0; } $doc = JFactory::getDocument (); // Logo file or site title param if ($this->params->get('logoFile')) { $logo = '<img src="' . JUri::root() . $this->params->get('logoFile') . '" alt="' . $sitename . '" />'; } elseif ($this->params->get('sitetitle')) { $logo = '<span class="site-title" title="' . $sitename . '">' . htmlspecialchars($this->params->get('sitetitle'), ENT_COMPAT, 'UTF-8') . '</span>'; } else { $logo = '<span class="site-title" title="' . $sitename . '">' . $sitename . '</span>'; } ?> <!DOCTYPE html> <html lang="<?php echo $this->language; ?>" dir="<?php echo $this->direction; ?>"> <head> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/> <jdoc:include type="head" /> <link rel="stylesheet" href="<?php echo $this->baseurl?>/templates/<?php echo $this->template ?>/bootstrap/css/bootstrap.min.css" /> <link rel="stylesheet" href="<?php echo $this->baseurl?>/templates/<?php echo $this->template ?>/css/main.css" /> </head> Не могу загрузить архив, даю нужный кусок кода без яваскрипт.
Ошибок нет. Но я не могу понять. Вы вообще отключили бутстраповские js, и получается работает только на бутстраповском css. Тогда зачем рекомендуют разработчики подключать их js?
Не знаю как другие разработчики, но мне достаточно было и встроенных js в Джумла . Так что с яваскрипт не помогу.
Можно конечно и так работать. Но мне скажем понадобятся некоторые вещи из js бутстрапа, то как-тогда. Может кто-нибудь сможет понять ошибку при подключении бутстраповских js --- добавлено: 23.05.2018, первое сообщение размещено: 23.05.2018 --- Не понимаю что за мистика. Снова подключил js бутстраповские и всё нормально в консоли, никаких ошибок. Кэш почистил, ошибок нет. Тогда тему можно считать закрытой
Ну так пробуй подключать. Код (html): <link rel="stylesheet" href="<?php echo $this->baseurl?>/templates/<?php echo $this->template ?>/css/main.css" /> <script src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/bootstrap/js/bootstrap.min.js"></script> </head>
Скрипты стоит хранить в папке js а стили в папке css. Подключать же стоить при помощи Jhtml он же htmlHepler если мы говорим о 3.8.x и более новых версиях. Подключение через Jhtml позволяет не только подключать скрпты и файлы только 1 раз(если проверки) но так же кешировать их. Код (PHP): use Joomla\CMS\HTML\HTMLHelper; HTMLHelper::_('stylesheet', 'main.css', array('version' => 'auto', 'relative' => true)); HTMLHelper::_('script', 'bootstrap.min.js', array('version' => 'auto', 'relative' => true)); Что же касается jQuery то подключая его так (то бишь снося старый и подключая снизу новый) вы нарушаете порядок скриптов. Что может привести не ошибка js. Я еще не очень придумал правильный метод подмены jQuery т.к по факту в большинстве случаев хватает и родного, который подключается при помощи Код (PHP): HTMLHelper::_('jquery.framework'); что позволяет избегать конфликтов скриптов. Но пару раз пытался https://github.com/JoomlaZen/tpl_joomlazen/blob/master/helper.php#L58-L79 Кстати от старого bs в head еще будут попадаться скрипты инициализации tooltip и т.п P.S BS не торт UIkit рулит
Превосходно. Огромное спасибо за такую полезную вещь. P.S. Я на ukit делал раньше (больше нравиться). Но к сожалению все сейчас на бутстрап переходят и многие вещи только на нем делают. На ukit я так и не смог найти такой вещи как container-fluid на бутстрапе, т.е. во весь экран чтоб было. У него нет процентных соотношений блоков, а лишь фиксированные. Если подскажите где можно взять такие css для ukit буду очень признателен. Самому писать нет времени
просто делаете без uk-container в uikit2 сетка просто пишеться прям в div без контейнеров. Либо сделайте свой класс типа Код (css): .uk-container.uk-container-full { max-width: 100%; } В uikit 3 uk-container-expand https://getuikit.com/docs/container --- добавлено: 24.05.2018, первое сообщение размещено: 24.05.2018 --- Хотя я бы не рекомендовал делать сайт со 100% шириной на 4к(а сейчас такое даже в ноутбуках средней ценовой категории бывает) экранах это будет выглядеть просто ужастно
Я это лечу присылая скрин в 4к расширении где sidebar размером в пол руки =) --- добавлено: 24.05.2018 --- Ну да ладно . Использование uikit или bs личный выбор каждого. ИМХО кончено но хоть bs4 и получил более широкие возможности, но до uikit3 ему как до луны
Для шаблона нет необходимости. Не выделяются ресурсы памяти на объект, не зависит от подключения и будущих изменений ядра Джумла .