How to Install and use Panels for Drupal

The Panels project for Drupal allows you to easily create customized layouts for your website and then use its drag-and-drop functionality to rearrange the layout, add and remove content and different page elements to it. You can download it from the official Panels project page.

This tutorial covers the following topics

Install Panels in your Drupal site

You can install Panels as any other Drupal module. For detailed information on how to do that, please refer to our tutorial on how to install Drupal modules.

However, there are few required modules that you need to install and enable the cTools module to your site before you can add Panels.

Create a custom layout page

Once you have Panels installed, you can have start creating a new type of content. Once you go to Content -> Add Content, you can now select Panel as an option. np1

Next, you can choose one of the pre-set layout types or Builders -> Flexible to make your own layout. We will do the second for the purpose of this tutorial.

np2

Now, select a title for that page, enable it’s menu item and click the Save at the bottom of the page.

np3

Next, you need to add the actual content of your page. To do this, click on the Panel content -> Gearbox icon in the panel -> Add content

np4

On this screen, select the New custom content option. The possibilities here are endless but we will try to do the most basic page with Panels so you get the idea. Once the module logic becomes clear to you, you will be able to make amazing things with it.

np5

Simply fill in the Title and Administrative title fields and then the actual content of your page and hit Finish.

np6

Now that you have a page, you can edit the layout. Go to the Panel layout tab and select for example a 2-column layout from the available ones. Then, click Next to proceed.

np7

You can now see the new layout of this page. Click Save to proceed.

np8

Now, you can go back to Panel content and you will see two content columns instead of one. Add to them whatever you want – widgets, menus, content, etc. Once done, hit Save.

np9

Now, navigate to the new page you’ve just created and you will see the new layout filled in with the content you created and an advanced search widget we’ve added for the purpose of this tutorial.

np10

FastWebHost Tutorials

How to Install and use Panels for Drupal

Company

Web Hosting Services

Help & Support

Related Articles