Question

I'm new to Drupal (having used Perch CMS and PHP for years). Forgive me if I bumble the terminology a bit. I've been furiously going over documentation and tutorials. Sorry in advanced for being verbose.

Using Drupal 9 with a Bootstrap 5 template I'm developing - I'm looking to create a page that has a listing of downloadable PDFs that are categorized into groups and subgroups - these will eventually be placed in nested accordions on a page:

DOCUMENT LIBRARY

== Category A

==== Sub Category AA

====== Content: Has title, image and file link

==== Sub Category AB

====== Content: Has title, image and file link

== Category B

==== Sub Category BA

====== Content: Has title, image and file link

====== Content: Has title, image and file link

==== Sub Category BB

What I've done so far: I've setup a vocabulary tree that matches the structure I need. I also created a content type that meets the needs of each content item and have added taxonomy to the content form display. Created a view that show the content type.

What I need to do: Cycle through the taxonomy tree structure to create the accordions, showing the taxonomy term name and then nest each content item that matches the taxonomy term.

What I need from the community: Make sure I'm going down the right path and that I'm not misusing Drupal in this way. Also, any tips and/or things I should search for would be helpful. I'm pretty comfortable with theming (twig).

Was it helpful?

Solution

One way to implement this, assuming that you will show the entire document library as a block.

I'll build this in reverse order because in Drupal, there is no "tree" structure; philosophically, Drupal adopts a "tag" (multivalue) structure, so you have to nudge the tags into a tree structure.

This can seem like a disadvantage coming from a tree-based system, but it's one of Drupal's strengths because tags allow for multiple parents.

So first, for each sub category, create a view mode called "Show documents".

View mode creation path: /admin/structure/taxonomy/manage/MY_VOCAB_MACHINE_NAME/overview/display, scroll down and choose "Manage view modes" under "Custom settings."

After adding the view mode, go back to /admin/structure/taxonomy/manage/MY_VOCAB_MACHINE_NAME/overview/display, check the box for "Use custom display settings for the following view modes" and press Save.

Now you can edit this view mode to get the display of content you want.

For that, I would create a view. This view should use a contextual filter to get the current taxonomy term, and then it should use fields to list the title, image, and file link. The display mode should be block.

After you create the view, enable the Layout Builder module. This will allow you to completely customize the layout per view mode.

Now, you can go back to the view mode page and attach the block showing the content to the term. Depending on how you implement the accordions, you should be able to adjust the CSS classes in Layout Build and the Views UI (for the block) to get what you want. Using a view mode will also let you target a theme template specifically to that view mode.

Finally, you can make another view (block) of the sub categories, this time grouping them by parent. And then set the view to show the display mode of the sub categories to the view mode that you created earlier, which will automatically bring in all the accordions.

This is not the only way to do this; another way is to use the embed feature of views, which lets you embed one view inside another.

Licensed under: CC-BY-SA with attribution
Not affiliated with drupal.stackexchange
scroll top