I'm using a table to display fields data in views 3. Within this i've got a field selected to group these items which produces a heading and then a table for each group. All good up to this point. The issue i'm trying to solve is a way to manipulate all these tables - so i'd like to add a container, with an id to style accordingly. I'm able to access the wrapper for the whole via https://api.drupal.org/api/views/theme%21views-view.tpl.php/7 and the template for the table which in my instance is views-bootstrap-table-plugin-style.tpl.php (which allows me to markup for each table) What i'm looking is where the loop occurs for the grouped field so i can put a wrapper round the loop. Any suggestions?

EDIT: here is a grab of my view https://www.dropbox.com/s/a2mb85m1lo2oxr4/views-display.png The region i am trying to wrap is below the exposed filters form. I am using Display Suite > Views Displays to layout the view with exposed filters and views content in the left column and the map as an attachment in the right column.

EDIT: removing the view having its template defined via DS Views has given a result with markup with a .view-content wrapper around the tables (which is good) but isn't entirely helpful as i still need to split the view into two columns (which is why i was using DS).


Whilst creating a custom template to do this by modifying an existing DS template and making a region specifically for my grouped table seems the quickest way to solve this, it certainly seems a bit messy as this will need to be done for every time i set to use grouped fields.

  • So you want one wrapper around all your grouped tables? Apr 20, 2016 at 17:50
  • thats exactly what i'm trying to do. so far i have the following: h3 table h3 table h3 table and would like to wrap it all in a div. Apr 21, 2016 at 10:13

1 Answer 1


You can add classed to your regions within Display suite:

Add CSS classes to regions Now that you have defined regions you can define custom CSS classes for them.

  • Go to Administration > Structure > Display Suite > CSS Classes (admin/structure/ds/classes)
  • Enter custom class names in the fields "CSS classes for regions” (one per line). You can provide a human friendly class name by using a pipe ("|”), e.g.,: class_name_1 class_name_2|Class two extravagant|Extravagant subtle_emphasis|Subtle emphasis
  • Click "Save”
  • Go to Administration > Structure > Display Suite (admin/structure/ds/layout) and choose "manage display” for the desired entity.
  • Choose the tab "Custom classes” to assign the classes to the regions
  • Click the tab "Extra classes for regions”. Assign the defined classes to the regions.
  • Click "Save”
  • You can check the source code of your web page to see the new classes and start styling them in your CSS.

From Manage displays.

You can use above steps to add a class to your Display Suite region. Depending on how Views renders the View, explore the DOM to see if you need to select additional classes.

  • Very helpful although the notes don't quite match whats going on in that latest 2.* release of DS or actually solve my issue. It has lead to the solution being made by just creating a custom DS layout and assigning a specific region that i can drop my tables into allowing me to wrap it and scroll. Apr 22, 2016 at 16:14

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.