Score:1

Drupal

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

Steve Siddu

3/25/23, 7:38 PM

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!

205

0 + 0

views

theming

blocks

css-js-aggregation

Akshay

3/26/23, 1:11 PM

What if you add the class to all the block displays in the view manually in Advanced section? Are you going to create a twig file simply to add classes?

Steve Siddu

3/26/23, 6:24 PM

I want to manipulate the structure of all the blocks of a particular view.

Akshay

3/29/23, 5:45 AM

Ok. Then you will need to create a twig file to modify HTML structure. Please modify your question, as it indicates only to add a class.

Score:3

Drupal

Clive

3/25/23, 8:19 PM

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.

0 + 0

Steve Siddu

3/26/23, 9:46 AM

what should be the function name, if module name is "XYZ", Is `XYZ_theme_suggestions_block()` right?

Clive

3/26/23, 9:51 AM

Yes that's right

Steve Siddu

3/26/23, 6:30 PM

the classes and id's that are added in `block--views-block--categories-all-blocks.html.twig` are reflecting in drupal site. can you tell me where exactly, In what file or In what folder I need to add that code. I added that file in `XYZ.module` file. thannk you !

Steve Siddu

3/26/23, 6:37 PM

Is everything should be same or need to be changed? like what is `#base_plugin_id` and `#plugin_id`

Clive

3/26/23, 8:00 PM

You shouldn't need to change anything, it matches the view id and display id from the template files in the question

Score:2

Drupal

Joseph

3/25/23, 7:57 PM

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

The Layout Builder Component Attributes module allows editors to add HTML attributes to Layout Builder components (blocks). Attributes can be added to 1) the block (outer) element, 2) the block title, and 3) the block content (inner) element.

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

Block Classes allows users to add classes to block title, content, and wrapper of any block through the block's configuration interface. This module extends the Block Class module features.

0 + 0

Elon Musk

I sit in a Tesla and translated this thread with Ai:

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

TH: จะเพิ่มคลาสให้กับบล็อกการดูหลายรายการโดยใช้กิ่งไม้ได้อย่างไร

RO: Cum să adăugați clasă la mai multe blocuri de vizualizare folosind twig?

RU: Как добавить класс в несколько блоков просмотра с помощью ветки?

VI: Làm cách nào để thêm lớp vào nhiều khối xem bằng twig?

Post an answer

Most people don’t grasp that asking a lot of questions unlocks learning and improves interpersonal bonding. In Alison’s studies, for example, though people could accurately recall how many questions had been asked in their conversations, they didn’t intuit the link between questions and liking. Across four studies, in which participants were engaged in conversations themselves or read transcripts of others’ conversations, people tended not to realize that question asking would influence—or had influenced—the level of amity between the conversationalists.