0

I understand this question has been asked many times. However, I still can't figure out why the CSS files of my custom Drupal 8 theme are not loading.

Edited (more info): The CSS files are not being defined at all (they do not show up in the HTML).

Here is my test.info.yml file:

name: "test"
type: theme
description: "Theme by ..."
package: custom
core: 8.x

libraries:
  - test/global-styling
  - test/global-scripts

regions:
  headline: Headline
  header: Header
  content_special: 'Content special'
  content: Content
  sidebar: Sidebar
  footer: Footer

And here is my test.libraries.yml file

global-styling:
  version: 1.0
  css:
    theme:
      css/bootstrap-4.0.0.css: {}
      css/content.css: {}
      css/footer.css: {}
      css/header.css: {}
      css/IE.css: {}
      css/lista.css: {}
      css/navigation.css: {}
      css/style.css: {}
      css/taulukko.css: {}

global-scripts:
  version: 1.0
  js:
    js/scripts.js: {}
  dependencies:
    - core/jquery

Note: The CSS files are not being defined at all (they do not show up in the HTML). So the console is not showing any errors about this issue. The css files are accessible if you manually type the path in the browser window.

  • Looks all good so far. You activated it, flushed caches, and then inspect the HTML on a front-end page, and the CSS and JS ain't there, did I got it right? Did you already tried it with a base theme set in your test.info.yml? For example: base theme: classy? I'm not sure if package is necessary. I'd remove it. – leymannx Aug 20 '18 at 9:14
  • you has enable it in the admin ? – vinhdv Aug 20 '18 at 9:15
  • Yes, activated theme, flushed caches (like a dozen times) and when I inspect the HTML on the front-end there isn't a single CSS file defined. I now even added a base theme (classy) as you suggested. I appreciate the comments though! – puudutus Aug 20 '18 at 9:27
  • If you open the network tab of your console, does it show that the CSS files are being not found? – Jaypan Aug 20 '18 at 9:46
  • 1
    Have you implemented html.html.twig? Are you outputting the CSS in that template? – Jaypan Aug 20 '18 at 9:58
0

After trying alot of different things I found the problem in page.html.twig file. Had misspelled one region name (a "-" instead of a "_"). Fixing the misspelled region name just got the CSS working.

Thank you all that helped me by commenting on the question.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.