1

I would like to design my view in this way:

EXPOSED FILTER1             EXPOSED FILTER2

                            MyView resulting output...........
EXPOSED FILTER 3            ............................


EXPOSED FILTER 4

Which is the cleanest way to do it? I would like to avoid to absolute positioning items in css.

2 Answers 2

3

Another way to do this is using Panels or cTools Page Manager (comes with cTools, you'll find the Page Manager UI under Structure > Pages in D7). It takes a bit of learning but, like Views, it's very powerful and once you're used to it you won't want to go back. Here's the basic step by step:

  • Give your view a Context view display. A "Context view" is a type of View Display like a "View block" or a "View page" or an "Attachment view" etc. Create one with the "Add" button at the top of the View edit page.
  • Load it as a Context in Panels or Page Manager. These are systems for placing content that you can think of as like a smarter, more powerful version of Drupal's Blocks system. The thing that is special about Context views, is that systems built on cTools contexts (like Panels and Page Manager) can load the view early on in the process, analyse it so they know what types of data to expect, and do smart things with that fine-grained data. In the Contexts page for your Page Manager page or Panel, add a context, choose Views, then find the right view.
  • Choose a layout on the Layouts page. In your case, a "2-column layout" should allow you to create the exact layout you are looking.
  • Place each part of the view as Content. Because cTools is loading the View as a context, and because cTools knows what Views are and how to make sense of them, it knows exactly what elements of the view it's going to get (unlike a Views block where it can only dump down the whole rendered block as one unit). When you go to Content in the Panels / Page Manager interface, you'll find a 'Views Context' vertical tab with various bits of your view in it, including th exposed flters. You can place each of these anywhere in your view (multiple times if needed), and configure them where appropriate. Some things this allows you to do:

    • (as per the question) Place each individual exposed filter anywhere you want on the page, seperate to the 'View row' option which contains the View results. For your layout, if you chose a 2-column layout, you can add three exposed filters using the cog icon on the left column, add the fourth to the right column, then add "View row" (no limit or offset in settings page) to get the results of the view. All this is editable: you can drag and drop, disable and enable, edit, add CSS classes, etc
    • Place the Header or Footer of a view anywhere on the page seperate to the View content
    • Build sophisticated grids with your Views content, placing the Views Row content type lots of times with different limits and offsets. For example, you can have a column showing the first row with custom classes making it highlighted, then a column showing rows 2-5, then alongside that column a column showing rows 6-10...
2

You can write your own template file and place it in your theme.

Please refer this documentation for the proper approach to theme exposed fields.

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.