| Drupal
Use Views to Display Fields inside Panels

One of our members had a problem. They wanted to display a large number of images inside a Panel.

The images were all uploaded to a node and they were displaying vertically.

Our recommendation was to use Views. This allows you to take much greater control over how the images are displayed.

In this tutorial, I'll show you how to use Views to control the display of fields inside a Panel.

  • First, make sure you have Views and Panels installed, and that you have enabled "Views content panes".
  • Upload the images to a content item:
Use Views to Display Fields inside Panels
  • Go to Structure > Views and create a new view.
  • This View will be a Grid and we'll choose to show only the image field:
  • Under "Context Filters", add a filter for "Node: ID". This will allow your view to show only the images on the node being viewed.

If you haven't done so, we'll need to create a Panel layout for our content type.

  • Go to Structure > Pages
  • Click "Enable" for "Node template".
  • Create a new variant for the node template. The most important thing is to choose "Selection rules" and make sure "Node: type" is set for your content type:

Once your content type is using Panels, we can now insert the view.

  • Click the icon to add content to the panel.
  • Click "Views" and then choose your view.
  • Save your panel and your view will appear, together with the images from the node you're viewing:

About the author

Steve is the founder of OSTraining. Originally from the UK, he now lives in Sarasota in the USA. Steve's work straddles the line between teaching and web development.