Hogyan adhatok osztály attribútumot egy Drupal 8 blokkhoz?
A Drupal core-ban sok példa található, például a súgó modulok amely beállítja a blokk role attribútumait. Tehát ezt követően sikeresen hozzáadhatok egy osztályt.
/** * 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"; } }
Lehetséges-e osztályt hozzáadni az előfeldolgozó kampó nélkül? Ideális esetben a blokk plugin fájlban található, amely az src / Plugin / Block / fájlban található?
Ez elősegítené egy blokkhoz kapcsolódó összes kód egy helyen való megtartását.
Válasz
Megpróbálta csak beállítani a #attribútumokat a blokk plugin által visszaadott render tömbben?
$build["#attributes"]["class"][] = "my-nice-block";
A (z) BlockViewBuilder::preRender()
elemet nézve ennek működnie kell.
Válasz
Ellenőrizheti a Blokk osztály modult.
A blokkosztály lehetővé teszi a felhasználók számára, hogy osztályokat adhassanak hozzá bármely blokkhoz a blokk konfigurációs felületén keresztül. Ha egy nagyon rövid PHP-részletet hozzáad a „s
block.tpl.php
témához fájl, osztályok hozzáadhatók egy blokk szülő eleméhez. Hurrá az erőteljesebb blokkoláshoz!
Válasz
keressen gallysablont névjavaslat a blokkhoz (gally hibakeresési megjegyzések használatával) és felülírja
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 %}
Válasz
1. Hello.config fájl létrehozása
my_module_name/config/install/my_module_name.config content this code: color :"blue" color_red: "red"
2. Csatolja a könyvtáram fájlt: 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. Állítsa be az osztályt a my_module_name.module fájlban
my_module_name_preprocess_block funkció (tömb & $ változók) {
// 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");
// A blokk azonosítójának megszerzése
$id= $variables["elements"]["#id"]; $block = Block::load($id);
// A régió megszerzése blokk
$region = $block->getRegion(); if($region == "name_of_the_block_id"){ // Set the class $variables["attributes"]["class"][] = $class ; } }
4. my_module_name.libraries.yml
itt a my_module_name a könyvtáram neve
5. Készítse el css fájlját css / my_module_name.css
.red {background: red! Fontos; }
.zöld {háttér: zöld! fontos; }
.sárga {háttér: sárga! fontos; }