Get Started

Community

Documentation

Support

Download & Extend

Marketplace

About

Search drupal.org
Drupal Homepage Log in / Register

Refine your search

Community Documentation
Community Docs Home Installation Guide Administration Guide

Panels 3: Creating a new front page with Views and Panels 3

Last updated May 10, 2012. Created by esmerel on January 6, 2008. Edited by dan3h, Francewhoa, bekasu, VM. Log in to edit this page. When you have tools as useful as Views and Panels 3, you'll want to be able to use them together. To figure out how to use them together, let's create a new front page. Drupal's standard front page is useful, but we want something a little more. Please note that the screenshots are from Panels 2, but are similar to Panels 3. 1. The first thing to do is make sure you have both Views and Panels 3 installed. You don't need all of the Panels modules, but it's easiest to enable them all at once. 2. The next step is to create the views we'll need. The first one we need, the front page view, is a sample view that comes with Views. Let's enable that. 3. Click Views (Site Building > Views). This brings you to the Views management page. On the bottom, under the 'Default Views' heading, find the 'frontpage' default view, and click 'Add'. Note that this screenshot is for Views 1; the Views 2 screen is different, but the frontpage view is still available.

Page status
Needs updating Log in to edit this page

About this page

Drupal version Drupal 6.x Audience Designers/themers, Programmers, Site administrators

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

administrators

Structure Guide
Working with nodes, content types and fields Organizing content with taxonomies Book module: Creating structured documents 4. 5. 6. 7. Click 'Save' at the bottom. Views 2 has an 'archive' view provided by default. Simply enable it. Click 'Save' at the bottom. Now, on to the panel. Before we can create the panel, you need to make sure Panels can "see" the content you've created. Click the 'Settings' tab at the top. (Administer > Site Building > Panels > Settings > Panel pages) Make sure everything under the 'New content behavior' heading is checked, especially the checkboxes next to 'New All Views' and 'New Views Panes Save. Now, to create the panel. Click Panel pages (Administer > Site Building > Panels > Panel Page). Set the Name to: front_page Set the Administrative title to: Home Set the Path to: front (Alternately, you can check the "Make this your home site page" checkbox.) Configuring comments Working with Menus Working with Views Working with blocks (content in regions) Working with links and related content Working with user profile information Presenting content to mobile users Creating complex layouts with Panels Panels 2 Documentation Panels 3 Documentation Panels 3 - Ad Hoc Help Pages Panels 3: Contributed

8. 9. 10. 11. 12. 13.

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

Panels 3: Contributed modules Panels 3: Demo Panels 3: Theme overrides Panels 3: Tutorials Panels 3: Upgrading from Panels 2 to Panels 3 Panels 3: Getting Started: How to setup Panels Display edit tabs on Panels Pages 14. Click 'Continue' at the bottom. 15. Let's select the 'Flexible' layout, which allows us to create our own layout. Panels 3: Creating a custom layout in your theme Panels 3: Creating a new front page with Views and Panels 3 Panels 3: Pane Visibility Rules (Evaluating $contexts Variable) Panels 3: Panels + 960 theme grid system 16. Click Continue. 17. The 'Layout settings' tab that you are brought to looks intimidating, but we're just making a couple changes. One of the benefits of selecting a flexible layout is being able to easily manipulate your panel to have any kind of configuration. 18. Now, we want some custom dimensions for the panel, so we'll need to invoke the Layout designer. Click the "Show Layout designer" button. 19. In the Region menu, select Region settings, and change the region title to "Left". 20. Move up a 'box' to the row. In the Row menu, select "Add region to right". Title this region "Right". 21. Use the slider bar to set the width to 80 on the left, 20 on the right. 22. Click Finish. Panels 3: Using variants to create node layouts. Panels 3: How to use variants and views to create node displays. (D7) Panels Everywhere Documentation Obtaining support for Panels issues

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

23. 24. 25. 26. 27. 28. 29. 30. 31. 32. 33. 34. 35. 36. 37. 38. 39. 40. 41. 42. 43. 44. 45. 46. 47. 48. 49.

Now we need to add a menu item. Click the 'Menu' tab on the left. Click the checkbox next to 'Normal menu entry'. Set the Weight to: -10 and the Title to 'Home'. Click 'Update' at the bottom. Click the 'Content' tab on the left. Click the gear icon in the left pane. Under the 'Views' heading, find and select the 'frontpage' view we added earlier. Select the display you wish to use (try page if it's available.) Click Continue. Click the checkbox next to 'Link title to view'. Click the checkbox next to 'Provide a "more" link that links to the view'. Click 'Finish' at the bottom. Click the gear icon in the right pane. Under the 'Activity' heading, find and select 'Who's new'. Click 'Finish' at the bottom. Click the gear icon in the right pane. Under the 'Activity' heading, find and select 'Who's online'. Click 'Finish' at the bottom. Click the gear icon in the right pane. Under the 'Views' heading, find and select 'archive'. Use the block display. lick Continue Click the checkbox next to 'Link title to view'. Click 'Finish' at the bottom. Click the gear icon in the right pane. Under the 'Activity' heading, find and select 'Recent comments'. Click 'Finish' at the bottom. Click 'Save' at the bottom.

issues

Drupals online documentation is 20002013 by the individual contributors and can be used in accordance with the Creative Commons License, Attribution-ShareAlike 2.0. PHP code is distributed under the GNU General Public License. Comments on documentation pages are used to improve content and then deleted.

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

50. Now, one last thing to do; we still have to make our front page the front page. Go to the 'Site information' menu (Administer > Site configuration > Site information). 51. Set the Default front page to: front 52. Click 'Save configuration' at the bottom. 53. Click the 'Home' menu item we added on the menu. 54. Voila, we have overriden the front page with a panel!

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

 Rounded corner color and Panels background color

Login or register to post comments

up

Panels 3: Pane Visibility Rules (Evaluating $contexts Variable)

Looking for support? Visit the Drupal.org forums, or join #drupal-support in IRC.

Comments
A few revisions
Posted by Sheldon Rampton on September 20, 2009 at 12:20am

In working through this tutorial, I've noticed a few things that should be changed to make it more clear:

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

Currently step 1 says, "The first thing to do is make sure you have both Views and Panels 3 installed." I recommend revising this to be more precise about which modules are needed: "First, install the Views, Panels 3 and Chaos Tools projects, and make sure you have the necessary modules enabled. The necessary modules from the Views project are Views and Views UI. From the Chaos tools suite, you will need to enable the Chaos tools, Views content panes, and Page manager modules. From the Panels project, enable the Panels module. Also, make sure the Comment module from Drupal core is enabled." Step 3 uses a screenshot from Views 1. Since Panels 3 is only compatible with Views 2, the screenshot should be updated. Also, the written instructions refer to interface details that pertain to Views 1 and not Views 2. Instead of "On the bottom, under the 'Default Views' heading, find the 'frontpage' default view, and click 'Add'," it should say, "Find the 'frontpage' default node view and click its 'Enable' link." Step 11 should be reworded from "Set the Name to: front_page" to "Set the Machine name to front_page." Step 17 is unnecessary. It says, "The 'Layout settings' tab that you are brought to looks intimidating, but we're just making a couple changes. One of the benefits of selecting a flexible layout is being able to easily manipulate your panel to have any kind of configuration." Actually, I didn't find the page that I was brought to intimidating. It's a very simple-looking form. Also, it isn't named "Layout settings." It's named "Basic settings Choose layout Panel content." In any case, step 17 isn't a "step." It doesn't tell the user to DO anything. It's simply commentary intended to reassure the reader and explain why the next few steps are necessary. In step 18, "invole" should be changed to "involve." Step 28 should be changed from "Click the gear icon in the left pane" to "Click the gear icon in the left pane and select 'Add content.'" Step 38 should be changed from "Click the gear icon in the right pane" to "Click the gear icon in the right pane and select 'Add content.'" Step 41 should be changed from "Click the gear icon in the right pane" to "Click the gear icon in the right pane and select 'Add content.'"

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

In step 43, "lick" should be changed to "Click." Step 46 should be changed from "Click the gear icon in the right pane" to "Click the gear icon in the right pane and select 'Add content.'" One final thought: I think this tutorial would work better as a video than as a written narrative.
---------------IT consultant, web designer, writer and researcher http://www.sheldonrampton.com/portfolio Login or register to post comments

~
Posted by mattyoung on September 20, 2009 at 1:16am

>The necessary modules from the Views project are Views and Views UI. From the Chaos tools suite, you will need to enable the Chaos tools, Views content panes, and Page manager modules Views content panes is what I need. One small hiccup for me: after I got all working and preview showing up, when I visit my front page, it's blank. Turns out I have both the path set to '/front' and "This is your site home page" checked. After I uncheck "This is your site home page", it all worked. Thanks!
-HdDigitalworks.comLogin or register to post comments

frontpage empty
Posted by pmathur01 on August 18, 2011 at 6:57pm

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

Posted by pmathur01 on August 18, 2011 at 6:57pm

Thanks for the great tutorial.. works as expected.. Prerna

Prerna. Login or register to post comments

Thank you
Posted by lhugg on September 28, 2009 at 4:52pm

Thanks for adding that detail. I was going crazy because I didn't have Views Content Page enables on Chaos tools. Even a modicum of documentation goes a long way.
Login or register to post comments

thanks, this was driving me

Posted by nixar on August 17, 2011 at 8:29pm

thanks, this was driving me crazy!

Login or register to post comments

Thanks!
Posted by alan.br on June 23, 2010 at 7:21pm

I should have read your review before starting the whole process. It took me a while to figure out that I should have the specific modules enabled even though I had the "main" ones already up and running. It could have saved me precious time. Thanks!
Login or register to post comments

Not sure if this is any use

open in browser PRO version
Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

Posted by undersound3 on December 21, 2010 at 8:58pm

Not sure if this is any use but I noticed my home menu item only showed up as active when using "" instead of "front"
Login or register to post comments

14.Click 'Continue' at the

Posted by runeveryday on October 15, 2009 at 3:09am

14.Click 'Continue' at the bottom. when i did this step,the page was always waitting.could't advance to the 15 step.why? anybody happen to this? any help would be appreciated!
Login or register to post comments

Question
Posted by cobraw3 on October 21, 2009 at 9:20pm

On step 11 where you say set Name to front_page, when I get to the panel pages which is: /admin/build/pages/add --> this seems correct Anyways when I get there it asks for an Administrative title and Machine name. Step 11 says the name. Is this Machine name?
Login or register to post comments

Good tutorial
Posted by FrederickFortin on January 27, 2010 at 2:22pm

Very good tutorial, everything works as expected! thanks for that!

Frederick Fortin

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

Login or register to post comments

Step 21: Use shift key when dragging the slider bar
Posted by Michali on March 15, 2010 at 9:24am

For step 21 "Use the slider bar to set the width to 80 on the left, 20 on the right.", it would be helpful to note that using the shift key when dragging changes the value in whole units.
Login or register to post comments

Missing slide bar

Posted by robatk on June 15, 2010 at 10:59pm

This step perplexes me, as I can't find anything remotely resembling a slide bar. Perhaps this has been removed?
Login or register to post comments

28. Click the gear icon in the left pane.

Posted by escoles on April 5, 2010 at 2:27am

There is no gear icon in the left pane.

Login or register to post comments

Need a tutorial on "Selection

Posted by Vc Developer on May 10, 2010 at 11:59pm

Need a tutorial on "Selection Rules". I Need to be able to select panels base on type and etc...
_____________________________________________

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

Coding is like a box of chocolates!... openSUSE 12.1 NVIDIA GeForce 9500 GT Intel(R) Core(TM)2 Quad CPU Q9550 @ 2.83GHz Login or register to post comments

on Step 8. u talk about the

Posted by tomtone on June 15, 2010 at 8:52am

on Step 8. u talk about the panels settings and checking the 'New All Views' and 'New Views Panes'. i enabled all modules i need to do this, but there is no option called like taht. u might know how to fix it?
Login or register to post comments

Facing the same problem

Posted by GoddamnNoise on June 23, 2010 at 4:27pm

I've the same problem with the 6.x-3.5 version of Panels module and Drupal 6.16. In addition, at 29 step there is no "Views" heading at all!!. I think it's an integration problem between Panels and Views modules. I can't see any view when adding content to a panel. Does anybody have any clue about why this could be happening?. How can i integrate Views and Panels modules. I've enabled all the Panels, Views and Chaos Tools modules and i've followed this tutorial step by step but there is no "Views" heading at all when trying to add content at step 29.
Diseo Web, Aplicaciones Web y Software Empresarial en Galicia - Karakana Factora TIC Login or register to post

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

Login or register to post comments

SOLVED !!
Posted by GoddamnNoise on June 23, 2010 at 4:45pm

I reply to myself hoping this can help to tomtone or anybody else facing the same problem. All the problems have gone when I cleaned up the Drupal cache pushing the "Clear cached data" button from "Administer > Site configuration > Performance".
Diseo Web, Aplicaciones Web y Software Empresarial en Galicia - Karakana Factora TIC Login or register to post comments

Thxs
Posted by renoproc on July 2, 2010 at 1:58pm

this trick helps a lot, thanks.

Login or register to post comments

You're welcome
Posted by GoddamnNoise on July 8, 2010 at 8:03am

you're welcome
Diseo Web, Aplicaciones Web y Software Empresarial en Galicia - Karakana Factora TIC Login or register to post comments

Modules and Panels

Posted by froezibaer on July 13, 2010 at 3:43pm

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

Hi all, i really can't find much about how i can make my custom modules output their content through panels. How is this done? As an example: I wrote a small gallery module fitting our needs which has to spit out main content, sidebar content and additionally there should be default sidebar content which appears elsewhere on the website, too. the whole site is based on panels 3. how can i tell the module to use panels for output? any help is appreciated thx in advance michael
Login or register to post comments

Incorporating your content into a page panel

Posted by debplatt on August 2, 2010 at 9:55pm

I am new at this myself, but so far this is what I have discovered (I'm using Drupal 6.14). If you have already created a panel-based page, and you want to add some of your existing content to it, here's how you go about it. First you have to bring up your exisiting page ( Site building > Pages > List). Find your existing custom page and click on the Edit link. Go to Content (beneath Variants on the left). Locate the panel to which you want to add the content, then click on the gears icon for that panel. Then click the top menu item, which says, Add Content. I currently know three ways of adding pre-existing content: Block Select Widgets, and you should be able to find your pre-exsiting block listed among the choices. Select your block and you will return to the Content view of your page.

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

If you select Update and Preview, the content in your block should now be visible in the panel. Save. (BTW I also found my same block listed under Miscellaneous) View If you are trying to incorporate content that's generated by a pre-existing view, after clicking on Add Content, select Views. Your previously created View should now be visible in the list. I had a View which has three displays (the default display, a block display, and a pane content display). Interestingly only the block display and the default display were available from which to choose. By selecting the "block" display of my view, I ended up with pretty much the same results as I did in the previous step by selecting the same block via the Widgets menu item. Content Pane After clicking on Add Content, the name of the category to which I had assigned my custom content pane appears among the choices on the popup window to the left (it is in same colums as Views and Widgets). Select this category, and then your specific content pane should be lifted among the other items to which you've assigned the same category. Select your specific content pane and you will then return to the Content view of your page.

Deleting your content from a panel

Since I was experimenting, I tried adding content in a number of ways to one of my page's panels. Once I was done, I wanted to delete the unwanted content. This ended up being a bit more difficult than it should have been because the menu item wasn't visible on my screen. But here's how you get around that. Go to the block, content pane or view that you want to eliminate. Click on the gear icon associated with that content (it should be on the upper right for that block). This causes a drop-down menu to appear. The Remove item on this menu isn't visible when I'm working on my laptop because the menu drops beneath the bottom of my screen. To access it, hover over the top of the menu, then use the Down arrow on your keyboard. This will get you to the bottom of the menu so that you can select Remove.
Login or register to post comments

hi guys. please help about

Posted by wer0ckz on August 10, 2010 at 11:44pm

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

hi guys. please help about installing or creating panels. i followed the instructions i installed views, ctools and panels yesterday but im stucked from step 3. there is no "Site Building > Views" i tried logging in as ADMIN then go to Administer > Site Building I cannot find Views. I can only see under Site Building these: Blocks Bulk Exporter Menus Mini panels Modules Pages Panels Themes I double check views module is enabled and also ctools and panels. please help. thank you
Login or register to post comments

Permissions
Posted by davethedruper on September 12, 2010 at 6:12pm

Hello wer0ckz, You've probably figured it out already but in case you didn't have you checked to see if the permissions have been set correctly. Administer > User Management > Permissions > Views Module
Login or register to post comments

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

Problem to choose a layout for Panels Page

Posted by ihliu on September 28, 2010 at 10:41pm

I followed the steps described on this site and several Drupal Panels video to setup the Panels module and other required modules (Views, Ctools) on Drupal 6. When I started to create a new Panels page, after entering the Admin Name and Machine Name, when the "Choose Layout" screen is displayed (as step #15 above), instead of having multiple layouts for selection, I have different screen contents as below: (1) The path is: Basic Setting >> Panel Setting >> Panel Content However, on all the examples I saw, the path is always: Basic Setting >> Panel Content (there is no Panel Setting) (2) Instead of having several layouts to choose from (as shown in step #15 on this site), I only got one layout (three columns Flexible layout) and also on my screen, it shows the following Drop-Down box: Category: which has a drop-down box with four values "Builders", "Column 1", "Column 2" and "Column 3" I have checked my Panels settings, which is correct (with multiple layouts enabled). I wonder if I have done anything wrong that causes this problem, or if anyone has ever had same problem? Thanks.
Login or register to post comments

.
Posted by Michelle on September 28, 2010 at 10:59pm

Recent versions have the layouts separated by type. Nothing wrong... Just a new feature. Michelle
----Shell Multimedia - My sporadically updated mostly Drupal blog.

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

Login or register to post comments

Just in case FYI

Posted by davethedruper on October 4, 2010 at 1:58am

PS: If you go to "Builders" you will see the flexible layout that you may want to use.
Login or register to post comments

Thanks.
Posted by cancerian7 on November 9, 2010 at 7:55am

Thanks.
Login or register to post comments

Well almost works

Posted by headdragon on October 3, 2011 at 4:37am

I have all of Dupla Core 7.8 on except: Blog, Content Translation, Forum, Locale, Open ID, Poll and Taxonomy. CTools is 7.x-1.0-rel1 Advance Help 7.x-1.0-beta1 Panels 7.x-3.0-alpha3 Views 7.x-3.0-rc1 When you add content in the left the View that was added early is not a usable selection. There is no View pane in add content.
Login or register to post comments

Set "pane style" -- Where did you go??

open in browser PRO version
Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

Posted by bbedford on January 18, 2012 at 6:16pm

Panels 3, Drupal 7: After content has been added to a Panels Region, an option normally exists, to apply styling, such as using "system-block" styling, or "rounded-corners". This option is normally available from the drop-down menu accessed by clicking on the gear in the upper-right corner of a Content Pane. However, on a particular installation I'm working with, I appear to have lost "Style", and can only access "Visibility Rules", and "Caching". "Styles" has disappeared, and my panel panes need to inherit the system-block theming. How might somebody who is new to Panels resolve this? Thanks for any help!
Login or register to post comments

Only User 1 can administer styles

Posted by bbedford on January 18, 2012 at 6:43pm

Problem solved! Log in as user1. Otherwise, the patch is here: http://drupal.org/node/1313642

Login or register to post comments

Great article
Posted by govindtotla on February 29, 2012 at 9:31am

I was searching for load more functionality and just solved with the help of this article. Great Work.

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

Login or register to post comments

Drupal 7
Posted by m4v3rick on June 28, 2012 at 1:52am

Hello, excellent tutorial! However I haven't been able to achieve this on Drupal 7. Once I finish all the steps I see the original home page with my "new front page" inside it (as if I have posted new content to frontpage) :( anyone has a clue for this? Thanks!!
Login or register to post comments

Drupal News Planet Drupal Association News Social Media Directory Security Announcements Jobs

Community Getting Involved Services, Training & Hosting Groups & Meetups DrupalCon

Get Started Documentation Home Installation Guide Site Building Guide Support api.drupal.org

Download & Extend Drupal Core Modules Themes Distributions

About Druplicon The Drupal Association Advertise About Drupal.org Web accessibility

Drupal is a registered trademark of Dries Buytaert.

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com