Skip to content
Grav 2.0 is officially stable. Read the announcement →
General

Questions about custom.css

Solved by pamtbaau View solution

Started by Urmm 8 years ago · 1 replies · 1418 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 jean-louis67, 3 weeks ago
2 311 3 weeks ago
General · by Andy Miller, 3 weeks ago
0 312 3 weeks ago
General · by Veehem, 4 weeks ago
0 264 4 weeks ago
General · by milkboy, 4 weeks ago
0 267 4 weeks ago
General · by ian russell, 1 month ago
2 336 1 month ago