1

I want to make a page which has one top part, a row of two or more horizontal tabs beneath it, and alternative bottom parts which appear beneath that and can be selected by clicking on the tabs.

For example, imagine a page that someone might write about their cat. The top half is a photo of the cat and some text. At the moment, it's static, but I might later add a Twitter feed. Under it are tabs labelled "Poem", "Photo", and "Blog". The bottom half that gets selected when the user clicks on "Poem" is a poem, static HTML. That which gets selected when clicking on "Photos" is also static HTML, another image. And that which gets selected when clicking on "Blog" is dynamic: a blogroll implemented as a View.

Just to make sure that’s unambiguous, there are pictures of the top half and the three bottom halves at http: //www.j-paine.org/dobbs/kitty_page_top_264.gif, http: //www.j-paine.org/dobbs/kitty_page_poem_257.gif, http: //www.j-paine.org/dobbs/kitty_page_photo_296.gif, and http: //www.j-paine.org/dobbs/kitty_page_blog_279.gif. Apologies for the deformed HTML, but this thing only lets me post two links.

I’ve found quite a lot of methods that on first sight, may do what I want. These include the modules Quick Tabs and Node Tab, as well as the trick with views menus that Ron Golan describes in "Views Menu Tabs Quick Guide" (see https://www.urbaninsight.com/2013/11/01/views-menu-tabs-quick-guide). There are also assorted PHP code hacks. But I can't find recommendations about which solution is best for reliability and maintainability. It does appear that some of the techniques were written for older versions of Drupal, and may have been superseded.

One thing is that unskilled site administrators should easily be able to find all the content (tops, tabbed menus, and alternative bottoms). That might rule out of some of the modules: I can’t find the reference again, but at least one of them is said to implement its own special interface for keeping track of tabbed content rather than extending the standard Drupal interface.

This problem raised another question. How should I think about Drupal when working out how to do this? It’s well known that programming needs three key concepts, used both in describing control and describing data: sequencing, alternation, and repetition. If I were programming the problem in Pascal, I would represent the page as a record. The first field would represent the top half of my page; the second would represent the bottom halves. Because these require alternation, I’d represent them as a discriminated union. I’d also need some pragmatic information saying that the union is to be displayed using tabs and giving the tabs’ labels.

Now, it’s clear that some of the built-in Drupal menus implement that kind of alternation. I get the impression, actually, that they’re more important than the content itself, because users on various discussion groups have wondered why they couldn’t see their content, then been told by an expert that this was because it’s not attached to a menu. But I don’t think the Drupal documentation says this anywhere. A formal semantics of Drupal would be good, but I can’t find one. So when designing a structure like my page with one top and multiple bottoms, where should I start? What’s the equivalent of C.A.R. Hoare's famous essay "Notes on Data Structuring" that every computer scientist will know from the classic Structured Programming?

  • Is this meant to be a one-off page? Or is this a pattern that you wish your content editors to be able to apply to a certain type of page? Or is this a pattern that content editors should apply arbitrarily to any page they might choose? As you note, there are a lot of ways to do things in Drupal with subtle pros/cons depending on your needs. – Aaron Aug 3 '15 at 20:43
  • Pierre, C.A.R. is his initials. See this Oxford University biography . Maybe I should make it clear that I'm talking about the computer scientist, Tony Hoare. Although he started working on computing in the fifties, his papers and essays are still worth reading, because he worked on showing that programs are correct. The essay I mentioned, "Notes on Data Structuring", does that for data represented using records, arrays, and unions. Drupal, and indeed any Drupal-like CMS, ought to have some equivalent. – Jocelyn Ireson-Paine Aug 4 '15 at 12:23
  • Aaron, it's a pattern needed for a maximum of ten pages on the site. The implementors know in advance which pages they are. Having said that, we all know that specifications change, so I suspect it would be very useful for content editors to be able to come along later and restructure existing pages to fit this pattern. – Jocelyn Ireson-Paine Aug 4 '15 at 12:30
1

Looks like you need to look at some of the typical "page layout" modules, such as these ones (excerpts from their project pages):

  • Display Suite.

    ... allows you to take full control over how your content is displayed using a drag and drop interface. Arrange your nodes, views, comments, user data etc. the way you want without having to work your way through dozens of template files. A predefined list of layouts (D7 only) is available for even more drag and drop fun!

  • Panels.

    ... allows a site administrator to create customized layouts for multiple uses. At its core it is a drag and drop content manager that lets you visually design a layout and place content within that layout. Integration with other systems allows you to create nodes that use this, landing pages that use this, and even override system pages such as taxonomy and the node page so that you can customize the layout of your site with very fine grained permissions.

Not sure if Display Suite will be sufficient for all your needs, but Panels will pretty sure be helpfull. Possibly also with 'mini-panels' added to that.

Be prepared however to invest some time in learning about these amazing modules. A great resource for learning about Panels is the (free) video training about Learn Page manager. Panels uses 'Page manager', which is one of the sub-modules of Chaos tool suite (ctools)).

  • Good answer. Would add that Display Suite definitely isn't a good solution if you're building this as a one-off page. For that, Panels is the right answer. Probably combined with Quick Tabs or Panels Tabs. Panelizer is another important module that can bring the page layout power of Panels to every single entity in your system. – Aaron Aug 3 '15 at 21:52
  • Pierre, Aaron, thanks for those. Why do you say that Display Suite isn't the right solution? – Jocelyn Ireson-Paine Aug 4 '15 at 13:41
  • @JocelynIreson-Paine : "I" am not sure if Display Suite (=DS) is "sufficient", because of the various "needs" I noticed in the question. Nevertheless, I personally appreciate DS a lot, and use it quite often in various sites. My rule of thumb: at least DS is usefull in many situations. But if requirements get tougher (more demanding), then it's probably a good moment to start considering the Panels module. DS's major advantage over Panels, I think, is the overhead (required resources), performance, etc that come with Panels. So if DS is enough, just stick with that. Just my 2 cents ... – Pierre.Vriens Aug 4 '15 at 13:46
  • I'm reading Steve Persch's Explaining Panels. At the end, Matt Hicks commented "We're moving away from this approach and towards using shortcodes (drupal.org/project/shortcode) - the less abstract and cumbersome the process of getting HTML into the page the better. If there was ever a complex abstract way of doing things, it's panels. They have their uses but for the most part there are better ways of doing things now." Perhaps his problems are different from mine, but it doesn't make panels sound good. – Jocelyn Ireson-Paine Aug 4 '15 at 13:56
  • Hm, valid (great) points! And thank you for the shortcode mention. Didn't know about that module, but will digest it in more detail later on (16K reported installs can't be wrong ...)! – Pierre.Vriens Aug 4 '15 at 14:09

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.