2

I have enabled twig debug. The following source snippet shows that there are some templates has no any suggestions such as views-view.html.twig:

<!-- THEME DEBUG -->
<!-- THEME HOOK: 'block' -->
<!-- FILE NAME SUGGESTIONS:
   x block--saidbakr-content.html.twig
   * block--system-main-block.html.twig
   * block--system.html.twig
   * block.html.twig
-->
<!-- BEGIN OUTPUT from 'themes/saidbakr/templates/block--saidbakr-content.html.twig' -->
<section class="row" id="website_templates">
    <div class="row">
    <div class="col-xs-12 col-md-12">
        <h3>Latest Articles</h3>
    </div>
  </div>    
  <div class="row">
    <div class="col-xs-12 col-md-12">
<!-- THEME DEBUG -->
<!-- THEME HOOK: 'container' -->
<!-- BEGIN OUTPUT from 'themes/saidbakr/templates/container.html.twig' -->
 <div class="views-element-container">
<!-- THEME DEBUG -->
<!-- THEME HOOK: 'views_view' -->
<!-- BEGIN OUTPUT from 'themes/saidbakr/templates/views-view.html.twig' -->
  <div class="js-view-dom-id-e66395c77e6b1af2b2d7c58650cebe72cb3979b5875ff26b9f67fcdf025f6b47 item_container" style="position: relative; width: 338px; height: 220px;">

The question is: why those templates has no suggestions like others? Is there any way to have suggestions for them or even any way to replace them with another templates files for specified place such as, hypothesis name of course, node--article--teaser--view-views

2 Answers 2

6

You can use the theme hook given to create your own theme hook / template suggestions or see additional suggestions that are not showing up in Twig debug, this happens occasionally. (I wonder if this is a bug?)

For example, the theme hook here you are targeting is views_view.

If I do:

function MYTHEME_theme_suggestions_views_view_alter(&$suggestions, $vars, $hook) {
  kint($vars);
}

... If the name of my view is "News" and it's a page display, I see in the theme area printed out in kint:

enter image description here

views_view__news__page_1
views_view__page_1
views_view__news__page
views_view__page
views_view__news

You can take any of these and replace the underscores with dashes and then add .html.twig and you should be good to go.

e.g. views-view--news--page-1.html.twig

Resources:

3
  • 1
    Very good. Is there any way other using kint() in the alter function? i.e is there any way making it print in twig HTML comments in the source?
    – SaidbakR
    Aug 7, 2016 at 16:44
  • 1
    This would usually only happen if you actually create your own new theme hook suggestion, i.e. something like $suggestions[] = 'node__type__' . $bundle . '__' . $view_mode;. For the case above, I am beginning to think it's actually a bug that the other template suggestions don't print in the Twig debug. Possibly related to this: drupal.org/node/2118743 Aug 7, 2016 at 17:46
  • That is good but how do you discover the file name suggestions for the container.html.twig template? In some case I don't need the wrapper div and some other cases I need it. Feb 28, 2017 at 16:24
1

For Views in particular, there is a project which adds some of the templates that didn't make it into core: Views Templates.

If, like me, you just need to add a template for a specific view, you can add a function to your theme that implements hook_theme_suggestions_views_view_alter().

/**
 * Implements hook_theme_suggestions_views_view_alter().
 */
function mytheme_theme_suggestions_views_view_alter(array &$suggestions, array $variables) {
  if (isset($variables['view']->element['#view_id'])) {
    $suggestions[] = 'views_view__' . $variables['view']->element['#view_id'];
  }
}

This would go in your mytheme.theme file of your custom theme. This will then make it possible to add a template that matches your view. EG: for a view named latest_posts, you could create a template: views-view--latest_posts.html.twig to override the core views-view.html.twig template.

1
  • This code does return one suggestion, however according to the docs on api.drupal.org there could be more that could be generated (11 if I counted correctly). This code is only creating a suggestion base on the machine name of the view. To be complete it would need to include suggested names that use the Style, Row Style, and Display and combinations thereof. I have seen code that does this for _suggestion_page_alter() May 1, 2017 at 21:43

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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