¿Cómo puedo agregar un atributo de clase a un bloque de Drupal 8?
Hay muchos ejemplos en el núcleo de Drupal, como los módulos de ayuda que establece los atributos de rol para el bloque. Entonces, después de eso, puedo agregar una clase con éxito.
/** * Implements hook_preprocess_HOOK() for block templates. */ function mymodule_preprocess_block(&$variables) { if ($variables["plugin_id"] == "mymodule_my_block") { $variables["attributes"]["class"][] = "my-nice-block"; } }
¿Es posible agregar una clase sin el gancho de preproceso? Idealmente, dentro del archivo de complemento de bloque ubicado en src / Plugin / Block /?
Esto ayudaría a mantener todo el código relacionado con un bloque contenido en una ubicación.
Respuesta
¿Ha intentado simplemente establecer #attributes en la matriz de renderizado devuelta por nuestro complemento de bloque?
$build["#attributes"]["class"][] = "my-nice-block";
Mirando BlockViewBuilder::preRender()
, debería funcionar.
Respuesta
Puede consultar el módulo Block Class .
Block Class permite a los usuarios agregar clases a cualquier bloque a través de la interfaz de configuración del bloque. Al agregar un fragmento muy corto de PHP a un tema «s
block.tpl.php
archivo, las clases se pueden agregar al elemento padre de un bloque. ¡Hurra por una temática de bloques más poderosa!
Respuesta
encuentra una plantilla de ramitas sugerencia de nombre para su bloque (usando comentarios de depuración de twig) y anótelo
themes / templates / block – my-custom-block.html.twig
{% extends "block.html.twig" %} {# /** * @file * Theme override for tabs. */ #} {% block title %} {{ title_prefix }} {% if label %} <h2{{ title_attributes.addClass(title_classes, "accordion") }}{{ title_attributes.setAttribute("id", "campus") }}> {{ label }} <i class="fa fa-plus" aria-hidden="true"></i> </h2> {% endif %} {{ title_suffix }} {% endblock %}
Respuesta
1. Cree el archivo hello.config
my_module_name/config/install/my_module_name.config content this code: color :"blue" color_red: "red"
2. Adjunte su archivo de biblioteca my_module_name.libraries.yml
// This function below is located on my_module_name.module file function my_module_name_page_attachments(array &$page){ $page["#attached"]["library"][]= "my_module_name/library_name"; }
3. Establezca la clase en my_module_name.module file
function my_module_name_preprocess_block (array & $ variables) {
// Get the value of my color content in my_module_name/config/install/my_module_name.config $class = \Drupal::config("my_module_name.config")->get("color");
// Obtenga el ID del bloque
$id= $variables["elements"]["#id"]; $block = Block::load($id);
// Obtenga la región que tiene el bloquear
$region = $block->getRegion(); if($region == "name_of_the_block_id"){ // Set the class $variables["attributes"]["class"][] = $class ; } }
4. my_module_name.libraries.yml
aquí, my_module_name es el nombre de mi biblioteca
5. Cree su archivo css css / my_module_name.css
.red {background: red! Important; }
.verde {fondo: verde! importante; }
.yellow {background: yellow! important; }