Site Building

Movie Project: Create a Custom Layout with Panels for Drupal 7

Last updated
Categories
Up-to-date with minor version
7.x

This page is archived

We're keeping this page up as a courtesy to folks who may need to refer to old instructions. We don't plan to update this page.

In this exercise you will demonstrate knowledge of Panels, and create a layout for the Top Ten List page, and create and configure content within Panel Panes.

Goal

Create a layout for the Top Ten List page using the Panels module.

Prerequisites

You will need the following knowledge and skills. If you need a review, check out the Additional resources section at the bottom of this page.

  1. Create and configure a panel page.
  2. Create a view and place it within a panel page.

Wireframe reference

You will need to refer to the wireframe collection PDF.

  • Top 10 Lists
  • Top 10 Lists index page

Screenshot of Top 10 listing page:

Image

Screenshot of Top 10 index page:

Image

Tasks

Install the Panels and Panelizer modules.

Create the Top Ten Films content type, with Panelizer enabled.

Configure the Panelizer content for the default content area and embed the body field and referenced films.

Create a view for the Top Ten Lists landing page.

Hints

  • Analyze the Top Ten List page to help design the content type.
  • Remember to use sensible naming conventions.
  • Remember to configure the Panelizer settings from the admin/structure/content-types section.

Recap

  • Panels enables us to create a specific layout of content for a page; Panel Panes can contain a multitude of content elements.

Further your understanding

Additional resources

Creative Commons License

Drupal Training Resources by Damian Robinson are licensed under a Creative Commons Attribution-ShareAlike 4.0 International License. Based on a work at http://www.damianrobinson.co.uk.

Hands-On Exercises: Movie Project