How to group-by fields in view AND control output via template file

I ‘m hitting a brick wall on this one, so trying to reach out for help. I did try to research this but could not find anything helpful.

What I have: I have a content type of ‘courses’, which have title, code, credits and semester (semester ranges from 01 to 10, and it is a vocabulary and each course is linked to a term from this vocabulary).

What I want: I want to create a view page, which lists all courses, i.e. their title, code and credits, and those courses should be grouped (and sorted) by their semester.

Ideally, I want all this to be presented with an accordion, so for example the final page should be something like:

Course Title     | Course Code     |     Course Credits   {titles}  -- Semester 01 -- [ collapsible accordion header] Course #1 title  | Course #1 Code  |     Course #1 credits Course #2 title  | Course #2 Code  |     Course #2 credits Course #3 title  | Course #3 Code  |     Course #3 credits -- Semester 02 -- [ collapsible accordion header] Course #4 title  | Course #4 Code  |     Course #4 credits Course #5 title  | Course #5 Code  |     Course #5 credits -- Semester 03 -- [ collapsible accordion header] Course #6 title  | Course #6 Code  |     Course #6 credits Course #7 title  | Course #7 Code  |     Course #7 credits Course #8 title  | Course #8 Code  |     Course #8 credits Course #9 title  | Course #9 Code  |     Course #9 credits 

I hope this above sketch shows what I ‘m trying to achieve.

I am new to Drupal and I don’t have a good grasp of Views yet, so this probably adds to my confusion. I feel quite confident with twig and templates, so I tried to do it from there, but hit a problem.

What I did:

Created a new View, where I show content of type courses.

In it, I create a page of unformatted list of teasers and using filename suggestions with the debug mode enabled, I created the file:

node–view–[course_content_type_name].html.twig

I can write the accordion markup in there and everything, the problem is that the ‘semester’ info obviously pops up in every row…

The best I can come up with, is something like:

-- Semester 01 -- [ collapsible accordion header] Course #1 title  | Course #1 Code  |     Course #1 credits -- Semester 01 -- [ collapsible accordion header] Course #2 title  | Course #2 Code  |     Course #2 credits -- Semester 01 -- [ collapsible accordion header] Course #3 title  | Course #3 Code  |     Course #3 credits -- Semester 02 -- [ collapsible accordion header] Course #4 title  | Course #4 Code  |     Course #4 credits -- Semester 02 -- [ collapsible accordion header] Course #5 title  | Course #5 Code  |     Course #5 credits -- Semester 03 -- [ collapsible accordion header] Course #6 title  | Course #6 Code  |     Course #6 credits -- Semester 03 -- [ collapsible accordion header] Course #7 title  | Course #7 Code  |     Course #7 credits -- Semester 03 -- [ collapsible accordion header] Course #8 title  | Course #8 Code  |     Course #8 credits -- Semester 03 -- [ collapsible accordion header] Course #9 title  | Course #9 Code  |     Course #9 credits 

I tried with ‘fields’ instead of ‘content’, added those that I want and ‘excluded’ semester from showing, but that didn’t really help.

I understand that the teaser template runs once for every ‘row’ so there is no way to really ‘group’ results according to semesters, which is what I want.

Is there a way to get all data somewhere and format it in one template file, so I can use loops and ifs etc. to ‘group’ and present my data the way I want ?

Sorry for the ridiculous length of this message .. I wanted to be as specific as possible in order to be easily understood…


This question seems fairly similar, but the very useful and detailed answer mentions a solution if not using a view mode/template. I want to use a template because it helps me control exactly how the data is shown. I ‘ve found other tips and info here and there, but none could be of any real help.

What should I try in order to achieve what I want? Any help would be greatly appreciated, I ‘m really stuck on this one …

Please shed some drupal light towards my way … 🙂

This article was republished from its original source.
Call Us: 1(800)730-2416

Pixeldust is a 20-year-old web development agency specializing in Drupal and WordPress and working with clients all over the country. With our best in class capabilities, we work with small businesses and fortune 500 companies alike. Give us a call at 1(800)730-2416 and let’s talk about your project.

FREE Drupal SEO Audit

Test your site below to see which issues need to be fixed. We will fix them and optimize your Drupal site 100% for Google and Bing. (Allow 30-60 seconds to gather data.)

Powered by

How to group-by fields in view AND control output via template file

On-Site Drupal SEO Master Setup

We make sure your site is 100% optimized (and stays that way) for the best SEO results.

With Pixeldust On-site (or On-page) SEO we make changes to your site’s structure and performance to make it easier for search engines to see and understand your site’s content. Search engines use algorithms to rank sites by degrees of relevance. Our on-site optimization ensures your site is configured to provide information in a way that meets Google and Bing standards for optimal indexing.

This service includes:

  • Pathauto install and configuration for SEO-friendly URLs.
  • Meta Tags install and configuration with dynamic tokens for meta titles and descriptions for all content types.
  • Install and fix all issues on the SEO checklist module.
  • Install and configure XML sitemap module and submit sitemaps.
  • Install and configure Google Analytics Module.
  • Install and configure Yoast.
  • Install and configure the Advanced Aggregation module to improve performance by minifying and merging CSS and JS.
  • Install and configure Schema.org Metatag.
  • Configure robots.txt.
  • Google Search Console setup snd configuration.
  • Find & Fix H1 tags.
  • Find and fix duplicate/missing meta descriptions.
  • Find and fix duplicate title tags.
  • Improve title, meta tags, and site descriptions.
  • Optimize images for better search engine optimization. Automate where possible.
  • Find and fix the missing alt and title tag for all images. Automate where possible.
  • The project takes 1 week to complete.