2

Is there a way to move vertical tabs in node forms to a right side column like in Drupal 8? I know one option is Renderable Elements module but last commit was 1 year ago and it says it is an expiremental module.

EDIT: I want to transform vertical tabs into accordions (like the ones in Drupal 8) because once the vertical tabs are in the right column they look awful.

EDIT 2: I just found an interesting sandbox project that does what I want: Responsive Vertical Tabs. However, it's not stable and breaks my ckeditor fields.

Thank you!

|improve this question
0

You can use a combination of the Node form columns module and the Renderable elements modules.

Node Form cols separates the node forms into two columns and a footer.

This module alleviates some of the problems with the mile-long node forms in Drupal. Other than that it gives you the possibility to use different weights and collapsed states for your forms than for your presentation.

Renderable elements is more complicated to use but lets you split out the parts of the vertical tabs part of the node edit form. For example, after enabling these two modules, do the following for the article content type:

  1. Visit node/add/article to add a new article content type
  2. Click the new link at the top of the form which says "Manage Form Display"
  3. Tick all the items you want to break out of the vertical tabs. As an example choose "Publishing options", "Published", "Promoted to front page" and "Stick at top of lists"
  4. Click save
  5. Goto Structure -> Content types -> Article -> Manage form
  6. Set the "Publishing options (Field group)" and "Save" to be in the right region and press save. nb. I had to use the drop downs here, it didn't seem to rememebr my region choices if I used drag and drop.
  7. Visit node/add/article and see the collapsing publishing options block on the right.
|improve this answer
  • Thank you so much! I like this module because is much simple than Renderable Elements and Display Suite. However, do you know how to make vertical tabs look like the ones in Drupal 8? I mean, having accordions instead of vertical tabs? I know this is possible because there is a screenshot here hugowetterberg.github.io/nodeformcols I really need this because vertical tabs now look awful on the right column. – Roger May 13 '14 at 7:01
  • I forgot to let you know that the column "Options" that appears in the screenshots of the module it appears to me but it contains checkboxes with label "Hide" and not with label "Show collapsed" as I expected. In order to accept your answer I need to know how to transform vertical tabs into accordions like the ones in Drupal 8. Thanks! – Roger May 13 '14 at 8:18
  • I had a go at converting the vertical tabs out with renderable elements module and it looks like the combination of the two modules do an OK job. rel module is a bit clunky though! – John May 14 '14 at 17:03
  • Thanks for your answer John. However, Renderable Elements is an experimental module and I want something stable for production site. Also, It creates a lot of fields and it's crazy. Finally, I was also finding a responsive solution. Thanks anyway! – Roger May 15 '14 at 20:55
0

To transform vertical tabs into accordions, you could download Easy Responsive Tabs to Accordion, a JQuery plugin which supports vertical tabs. Add this lightweight script to your theme and call the easyResponsiveTabs() function on your HTML tabs markup.

If you use it out of the box, it will gracefully switch from tabs to accordion according to the screen width. In order to display only accordions, just edit the width breakpoint of the script and set it to a high value.

If you use Panels, have a look at Panels responsive tabs to accordion, a sandbox project which provides a Responsive Tabs to Accordion Panel style.

|improve this answer
  • I tried the jQuery plugin you suggested but I could not make it work. I have found a solution myself and that's why I haven't tried Panels approach. Thanks anyway! – Roger May 15 '14 at 21:01
0

Thanks for all your answers. However, I found two better solutions myself which are responsive:

1) (Best option) I've written my own module to responsify vertical tabs on admin pages: Vertical Tabs Responsive

2) "Responsive Vertical Tabs" could be useful if you don't use "Fieldsets" and "Horizontal tab groups" in your forms. More information in my issue on drupal.org.

|improve this answer

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.