Как включить CSS файл в Symfony 2 и Twig?
я играю с Symfony2 и у меня есть проблемы, в том числе CSS и JS файлы веточка шаблон.
у меня есть пакет с именем Webs/HomeBundle
внутри которого я HomeController
С indexAction
это делает файл шаблона ветки:
public function indexAction()
{
return $this->render("WebsHomeBundle:Home:index.html.twig");
}
так что это легко. Теперь то, что я хочу сделать, это включить некоторые CSS и JS файлы внутри этого шаблона ветки. Шаблон выглядит так это:
<!DOCTYPE html>
<html>
<head>
{% block stylesheets %}
<link href="{{ asset('css/main.css') }}" type="text/css" rel="stylesheet" />
{% endblock %}
</head>
<body>
</body>
</html>
файл, который я хотел бы включить, main.css
файл находится в:
Webs/HomeController/Resources/public/css/main.css
Итак, мой вопрос в основном, как, черт возьми, я могу включить простой файл CSS внутри шаблона Twig?
я использую веточку asset()
функция, и она просто не попадает в правильный путь CSS. Кроме того, я запускаю эту команду в консоли:
app/console assets:install web
это создало новую папку
/web/bundles/webshome/...
это просто ссылка на элемент
src/Webs/HomeController/Resources/public/
верно?
вопросы
- где вы размещаете свой актив файлы, JS, CSS и изображения? Это нормально, чтобы положить их в ? Это подходящее место для них?
- как вы включаете эти актив файлы в вашем шаблоне Twig с помощью функции asset? Если они находятся в общей папке, как я могу их включить?
- должен ли я настроить что-то еще?
3 ответа:
Вы делаете все правильно, за исключением прохождения вашего пути к пакету .
по данным документация - в вашем примере это должно выглядеть, как показано ниже:
{{ asset('bundles/webshome/css/main.css') }}
Совет: вы также можете вызвать assets: install with
--symlink
ключ, поэтому он будет создавать символические ссылки в веб-папке. Это очень полезно, когда вы часто применяетеjs
илиcss
изменения (таким образом, ваши изменения, примененные кsrc/YouBundle/Resources/public
будет сразу отражается вweb
папка без необходимости вызоваassets:install
снова):app/console assets:install web --symlink
также, если вы хотите добавить некоторые активы в вашем дочернем шаблоне, вы можете позвонить
parent()
метод для блока ветки. В вашем случае это было бы так:{% block stylesheets %} {{ parent() }} <link href="{{ asset('bundles/webshome/css/main.css') }}" rel="stylesheet"> {% endblock %}
и вы можете использовать %stylesheets% (assetic feature) тег:
{% stylesheets "@MainBundle/Resources/public/colorbox/colorbox.css" "%kerner.root_dir%/Resources/css/main.css" %} <link type="text/css" rel="stylesheet" media="all" href="{{ asset_url }}" /> {% endstylesheets %}
вы можете записать путь к css в качестве параметра (%parameter_name%).
подробнее об этом варианте:http://symfony.com/doc/current/cookbook/assetic/asset_management.html
остальные ответы действительны, но Официальные Рекомендации Symfony руководство предлагает использовать
web/
папка для хранения всех активов, а не d