logo помогаю бизнесу зарабатывать больше.
Связаться
Введите название услуги:

Как правильно подключать CSS стили и JS скрипты в Opencart

В этой заметки расскажу, как стоит правильно подключать свои файлы стилей и скриптов.

Можно просто добавить свои строки в шаблон /catalog/view/theme/default/template/common/header.tpl таким образом:

<link href="/catalog/view/javascript/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
<script src="/catalog/view/javascript/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>

Это простой и надежный вариант. Все подключения будут присутствовать на всех страницах. А где-то эти файлы и вовсе не будут задействованы, занимая таким образом лишнее место при загрузке страницы.

Также этот способ в будущем не даст вам возможность оптимизировать стили и скрипты, например сжать все в один файл автоматически.

Я рекомендую подключать файлы через контролер нужного нам класса. Например, чтобы подключить общие скрипты для всего сайта обращаемся к /catalog/controller/common/header.php.

$this->document->addScript('catalog/view/javascript/slick/slick.min.js');
$this->document->addStyle('catalog/view/javascript/slick/slick.css');

Дальше просто в нужном классе подключаем нужные файлы.В шаблоне шапки уже есть конструкция для вывода массива стилей и скриптов

<?php foreach ($styles as $style) { ?>
<link href="/<?php echo $style['href']; ?>" type="text/css" rel="<?php echo $style['rel']; ?>" media="<?php echo $style['media']; ?>" />
<?php } ?>

<?php foreach ($scripts as $script) { ?>
<script src="/<?php echo $script; ?>" type="text/javascript"></script>
<?php } ?>

Похожие статьи

Оставить заявку
По любым вопросам пишите мне в мессенджеры .
Написать в WhatsApp
+7 (925) 444-48-89
Написать в Telegram
@max_webs
Ваша цена
Предложите свою цена за товар или услугу. Пишите мне в мессенджеры или оставьте заявку в данной форме.
Написать в WhatsApp
+7 (925) 444-48-89
Написать в Telegram
@max_webs
[contact-form-7 id="22192" title="Универсальная форма"]
[contact-form-7 id="114828" title="Рассчитать стоимость"]

Представительство Max-Webs в других городах:

There are no products