Skip to content
● Grav 2.2 is out: 2x faster cold starts and 96% less memory on big sites. Read the announcement →

Questions about custom.css

Solved by pamtbaau View solution

Started by Urmm 8 years ago · 1 replies · 1529 views
8 years ago

Regarding the custom.css that I read here: https://learn.getgrav.org/themes/customization

1/ Is using custom.css the default way to overwrite all other css?

2/ If so, how to have it load as the last css?

3/ Is there a similar alternative for javascript?

8 years ago Solution

@ityoflaw
To answer your questions point by point:

  1. Using custom.css is not the default way, but sure is the simplest way.

  2. If the theme you are using does use custom.css, it will add custom.css as last css.
    Have a look in user/themes/<your theme>/templates/partials/base.html.twig. You might find something like:

    TWIG
    {% block stylesheets %}
        {% do assets.addCss('theme://css-compiled/spectre'~compress) %}
        {% if theme_var('spectre.exp') %}{% do assets.addCss('theme://css-compiled/spectre-exp'~compress)  %}{% endif %}
        {% if theme_var('spectre.icons') %}{%  do assets.addCss('theme://css-compiled/spectre-icons'~compress) %}{% endif %}
        {% do assets.addCss('theme://css-compiled/theme'~compress) %}
        {% do assets.addCss('theme://css/custom.css') %}
        {% do assets.addCss('theme://css/line-awesome.min.css') %}
    {% endblock %}
    
  3. There is no custom.js... If you inherit base.html.twig in your own theme, you can add any js in a similar way as adding css. See the topic "Theme inheritance" in the same document you are referring to.

Suggested topics

Topic Participants Replies Views Activity
General · by Andy Miller, 7 days ago
0 114 7 days ago
General · by lynbor, 1 month ago
3 442 2 weeks ago
General · by lynbor, 3 weeks ago
7 562 2 weeks ago
General · by Harry, 2 weeks ago
0 162 2 weeks ago
General · by Old Man Umby, 1 month ago
2 309 4 weeks ago