How to add class to multiple view-blocks using twig?

Question

I have four blocks to a view. I want to add class 'fancy-body' to all four blocks. How can I add that.

view_id : categories

display_id's of blocks : block_1, block_2, block_3, block_4

I know, I can add classes by creating individual twig template file for each block. like this,

block--views-block--categories-block-1.html.twig
block--views-block--categories-block-2.html.twig
block--views-block--categories-block-3.html.twig
block--views-block--categories-block-4.html.twig

Is it possible to achieve in single twig template file? How can I achieve that?

Need Help, Thank You!

Answer 1

If it's just classes you need, the modules mentioned in Joseph's answer should be enough.

If you need to make more alterations and definitely need a custom template file, you can implement hook_theme_suggestions_HOOK().

Something like:

function module_theme_suggestions_block(array $variables) {
  $suggestions = [];

  if ($variables['elements']['#base_plugin_id'] == 'views_block') {
    if (preg_match('/views_block:categories-block_[0-9]+/', $variables['elements']['#plugin_id'])) {
      $suggestions[] = 'block__views_block__categories_all_blocks';
    }
  }

  return $suggestions;
}

With the above example your single template file would be named block--views-block--categories-all-blocks.html.twig.

Answer 2

There are several modules that allow you to add classes to blocks via admin, depending on where you're adding the blocks:

• If using Layout Builder: https://www.drupal.org/project/layout_builder_component_attributes
• If using Block Layout: https://www.drupal.org/project/block_classes