Ací tinc un truquet per tal d'adaptar la plantilla de blocks del theme de Drupal que tinc instal·lat, Bootstrap 5, per a que el block de les etiquetes s'adapte perfectament.
Primer de tot, crearem un fitxer services.yml copiant el fitxer per defecte:
cp sites/default/default.services.yml sites/default/services.yml
Ara modificarem el fitxer /sites/default/services.yml per a provatures diverses deixant els següents paràmetres:
parameters:
twig.config:
debug: true
auto_reload: true
cache: false
Per defecte, aquest fitxer té els valors debug: false, auto_reload: null i cache: true
Per defecte, l'estil que tinc als blocks seria aquest:
<div class="block-tagclouds">
<div class="list-group divdeshabilitat">
{% if label %}
<a class="list-group-item disabled" href="#">TÍTOL DEL BLOCK</a>
{% endif %}
<div class="list-group-item">
COS DEL BLOCK
</div>
<p> </p>
</div>
</div>
Una vegada hem instal·lat el mòdul TagCloud de Drupal i hem creat un block, veurem que l'estil no és exactament igual que la resta de blocks del theme que tinc, aleshores tocarà personalitzar-ho.
Per a fer-ho, editarem la plantilla Twig per al block en /themes/contrib/bootstrap5/block/block--tagclouds.html.twig amb el contingut que farà que mostre el block amb l'estil CSS que tinc en els altres themes:
<div class="block-tagclouds">
<div class="list-group divdeshabilitat">
{% if label %}
<a class="list-group-item disabled" href="#">{{ label }}</a>
{% endif %}
<div class="list-group-item">
{{ content }}
</div>
<p> </p>
</div>
</div>
Netejem la caché de Drupal.
I he hagut d'afegir unes poques línies en els estils CSS per adaptar el marge i la grandària del títol:
#block-categoriesdelblogportada1, #block-categoriesdelblogportada2, #block-categoriesdelblogportada3 {margin-bottom: 30px; }
.block-categoriesdelblog a.disabled, .block-tagclouds a.disabled {font-size: 1.3em; font-weight: bold;}
