2

I've created a custom Block in Drupal 8 from the UI.

Is there a way to add a custom CSS style to this custom block?
Is it possible, like in Views, to click on CSS and type it in?

Improve this question

1 Answer 1

Reset to default
3

Easiest way to add a custom class to a block would be to override the default block.twig.html twig template within your theme.

You'll need to copy the above file from /core/themes/stable/templates/block into your custom theme using the same directory structure.

** NB don't edit the file found in core directly!! This is bad practice and you'll lose any changes when you upgrade Drupal core. **

Clear the cache and you should now be able to edit the block template file and customize it.

Then, to load CSS, you must define an asset library. You can then load that asset library using {{ attach_library('mytheme/special-block') }} in your Twig template (assuming the theme is called mytheme and the asset library special-block).

Helpful links:

Improve this answer
3
  • 1
    To load CSS, you must define an asset library. You can then load it using {{ attach_library('mytheme/special-block') }} (assuming the theme is called mytheme and the asset library special-block). See drupal.org/theme-guide/8/assets.
    – Wim Leers
    Feb 20, 2016 at 18:02
  • Apologies ignore my last comment :) thanks for the amendment
    – Alex Kirsten
    Feb 20, 2016 at 18:15
  • 1
    Oh I see, I didn't interpret it that way. In that case, I think you should also mention you can use attributes.addClass('foo') to do that. Let me add another suggestion. Then this answer will be complete, for both possible interpretations :)
    – Wim Leers
    Feb 20, 2016 at 18:18

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.