1

In my custom Drupal 8 theme, for all regions of my page, there is HTML looking like:

<div class="block-region-xxxx"></div>

where xxxx is the region name.

There are also empty 's rendered around my blocks.

This is my block.html.twig

{% block content %}
    {{ content }}
{% endblock %}

as you see, no divs there.

Here's my theme.info.yml , region part:

regions:
  header: Header
  hero: Hero
  help: Help
  top: 'Page Top'
  content: Content
  sub: 'Sub Content'
  bottom: 'Page Bottom'
  footer: Footer

Here's a screenshot of the actual HTML tree rendered:

enter image description here

essentially I'd like to remove everything between the .row and the .col..

0

This may help some one else who is having this issue.

So how to remove the extra black divs inside a region you would do the following:

Find "core/modules/system/templates/region.html.twig"

Change it from this –

{#
/**
 * @file
 * Default theme implementation to display a region.
 *
 * Available variables:
 * - content: The content for this region, typically blocks.
 * - attributes: HTML attributes for the region <div>.
 * - region: The name of the region variable as defined in the theme's
 *   .info.yml file.
 *
 * @see template_preprocess_region()
 *
 * @ingroup themeable
 */
#}
{% if content %}
  <div{{ attributes }}>
    {{ content }}
  </div>
{% endif %}

To this –

{#
/**
 * @file
 * Default theme implementation to display a region.
 *
 * Available variables:
 * - content: The content for this region, typically blocks.
 * - attributes: HTML attributes for the region <div>.
 * - region: The name of the region variable as defined in the theme's
 *   .info.yml file.
 *
 * @see template_preprocess_region()
 *
 * @ingroup themeable
 */
#}
{% if content %}
    {{ content }}
{% endif %}
1
  • Note that this effects all regions, not just one.
    – Kevin
    Feb 17 at 21:56

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.