0

I created a View to list a custom entity content.
I'd like to add my custom CSS file to the generated page.
I tried to use a Text Area in the footer with {{ attach_library('amap/yyy') }} where amap is my custom module and yyy is my custom library.
And of course, the CSS is not loaded...
Any idea why?

1
  • Because text area IS NOT TWIG. When it's get displayed it will go through twig, but your "content" will be "escaped". You can't use twig expressions from database. (and that's where it's coming from). Always think of hooks / events first. Drupal is a heavily hook based framework.
    – ssibal
    Commented Jun 28, 2016 at 8:04

2 Answers 2

6

You will need hook_views_pre_render().

And here is an example:

/**
 * Implements hook_views_pre_render().
 */
function base_views_pre_render(ViewExecutable $view) {
  if($view->id() == 'this_is_my_view_with_no_css' && $view->current_display == 'page_1') {
    $view->element['#attached']['library'][] = 'base/test';
  }
}
4
  • I have this error:Recoverable fatal error: Argument 1 passed to amap_views_pre_render() must be an instance of ViewExecutable
    – gbmapo
    Commented Jun 28, 2016 at 8:19
  • Yes. If you used a normal IDE (phpstorm, eclipse) it would already give you at least a WARNING, that it has absolutely no idea where "ViewExecutable" is coming from. (how should it now it?..). You have to use: "use Drupal\views\ViewExecutable;" at the top of the file. (but above <?php). I suggest you to read this: stackoverflow.com/questions/10542012/php-namespaces-and-use
    – ssibal
    Commented Jun 28, 2016 at 8:21
  • indeed, it works better that way ;-)
    – gbmapo
    Commented Jun 28, 2016 at 10:15
  • awesome, I removed the condition about display because I want it on all pages of my view. Works great! thanks.
    – powpow12
    Commented Jun 12, 2017 at 22:26
0

Is your custom css loaded with you theme? I might be misunderstanding you question, but if you trying to apply your custom CSS to your view's result and your CSS is loaded with your theme then, in editing the view, click on the field you want to edit. Click 'Style Settings' and you'll see options for adding HTML and CSS to the field. Click 'Create a CSS class'. Enter a new CSS class name. Set the class names to those in your custom theme CSS file you want to use. Clear your cache and check the view. note: the preview will not show CSS changes.

If you are not loading your custom css with your theme, I suppose you could include it in the .info for Views. Though you would have to redo that each time views updated.

3
  • No, my custom css is not loaded with the theme.
    – gbmapo
    Commented Jun 28, 2016 at 7:43
  • I think you misunderstood him. He wants to attach his own Library to a View page.
    – ssibal
    Commented Jun 28, 2016 at 7:49
  • Exactly! It's why I tried to add attach_library in a text area of the footer using twig syntax...
    – gbmapo
    Commented Jun 28, 2016 at 7:55

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.