CODEWITHSUNDEEP
symfonysasssylius
gabriel
gabriel

Reputation: 345

Add custom css/scss files to default Sylius theme

I've just installed Sylius. I'd like to add custom CSS (SCSS) files to the default Sylius theme (without creating a custom theme). How is it possible? Or is there a better way to copy this theme and create a custom one?

Upvotes: 1

Views: 1373

Answers (1)

Dmitrijs Čornobiļs
Dmitrijs Čornobiļs

Reputation: 953

Easiest and hacky way:

Firstly add needed css file into public/ directory. Then you need to override vendor/sylius/sylius/src/Sylius/Bundle/ShopBundle/Resources/views/layout.html.twig template (stylesheets block) by copying this as templates/bundles/SyliusShopBundle/layout.html.twig and modifying it like this:

...
{% block stylesheets %}
        <!--[if lt IE 9]>
        <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
        <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
        <![endif]-->

        {% include '@SyliusUi/_stylesheets.html.twig' with {'path': 'assets/shop/css/style.css'} %}
        {% include '@SyliusUi/_stylesheets.html.twig' with {'path': 'my-custom-file.css'} %}

        {{ sonata_block_render_event('sylius.shop.layout.stylesheets') }}
    {% endblock %}
...

More about customizing see this article.

Upvotes: 1

Related Questions