/ Drupal 7

Creating a four column layout for Panels 3 in Drupal 7

Panels 3 is one of the solution for Drupal sites when you want to do different layouts on front page, node pages, node form or any other kind of pages. Lately one of my clients wants to have a four column front page, so I use Panels 3, took a note here. Reference from here.

So I’ll need a custom layout, named “fourcol”. I’ll create the layout in my theme called “mytheme”.

Step 1, Copy a layout folder to your theme folder

Copy from: /sites/all/modules/panels/plugins/layouts

To your theme: /sites/all/themes/mytheme/layouts/fourcol

Step 2, Rename everything to “fourcol”

We will be creating a four-column layout called “fourcol”. We need to rename the layout folder and all files to “fourcol”, keep the filename extension the same.

Step 3, Edit the theme’s .info file

We need to tell Drupal where the folder with the custom panel layouts for this theme will be located, by adding the following line to the bottom of the file:

; Panels layouts. You can place multiple layouts under the "layouts" folder.<br></br>
plugins[panels][layouts] = layouts```

#### Step 4, Play around the files

Open the tpl.php files and css files, modify them to what you want. Here is the example of four column layout: [fourcol.zip](/content/images/2012/02/fourcol.zip), feel free to use it. (It’s for Panels 3)

It’s how it’s like on administration:  
[![](/content/images/2012/02/panels-layout-4.png "panels-layout-4")](/content/images/2012/02/panels-layout-4.png)

PS. If you would like to implement in a custom module, please [see this post](http://drupal.org/node/495654#comment-4668410).