One Drupal Themers Path for Defining a New Panel
My next evolution was to use 960.gs with panels. I love the flexibility and flow of panels so now I need to create my own panel with specific mark-up for 960.gs, and so that it will fit into my “Mothership”. At the time of this blog post I am using Panels 6.0-3-alpha4. My plan is to create a 3 panel layout that is large, medium, and small. For 960.gs using the 12 grid, I am creating a grid_5, grid_4, and grid_3. Here we go…
Finding Nemo (tpl files)
As a themer I feel very fortunate that merlinofchaos uses timplefifs (morten) almost as a philosophy. I found the files I wanted to work /panels/plugins/layouts This is my first go at this, so I didn’t want to fuss with the flexible layout, and I didn’t want to add or guess at any extra variables, so I decide to start with one of the three column layouts (threecol_25_50_25)My First Path
I copied all of the files into a new folder called panelcool
I renamed the files.


Then I dug right into what I know best first… the tpl file, and here is where I make my mark-up changes, the new code looks like this.
<div class="container_12" <?php if (!empty($css_id)) { print "id=\"$css_id\""; } ?>>
<div class="grid_5 alpha">
<div class="inside"><?php print $content['left']; ?></div>
</div>
<div class="grid_4 alphaomega">
<div class="inside"><?php print $content['middle']; ?></div>
</div>
<div class="grid_3 omega">
<div class="inside"><?php print $content['right']; ?></div>
</div>
<div class="clear"> </div>
</div>
<div class="clear"> </div>Now it’s time to suck it up and work with the function. The function can be found in the renamed file (panelcool.inc) here is the BEFORE and AFTER…
BEFORE
function panels_threecol_25_50_25_panels_layouts() {
$items['threecol_25_50_25'] = array(
'title' => t('Three column 25/50/25'),
'icon' => 'threecol_25_50_25.png',
'theme' => 'panels_threecol_25_50_25',
'theme arguments' => array('id', 'content'),
'panels' => array(
'left' => t('Left side'),
'middle' => t('Middle column'),
'right' => t('Right side')
),
);
return $items;
}AFTER
function panels_panelcool_panels_layouts() {
$items['panelcool'] = array(
'title' => t('Panel Cool'),
'icon' => 'panelcool.png',
'theme' => 'panelcool',
'theme arguments' => array('id', 'content'),
'panels' => array(
'left' => t('Left side'),
'middle' => t('Middle column'),
'right' => t('Right side')
),
);
return $items;
}Optional Stuff
I changed the png image so I could see the changes :)I didn’t mess with the css for this because the 960.gs css is already in my theme, so the layout will be controlled by that file, but if you want to add the css file add 'css'=> 'panelcool.css', to the array $items['panelcool'] = array(, that will get it loading for you.
Head back to a panel layout screen and BAMO!


Next week we’ll make our new Panel into a module so we don’t hack Panels2 by leaving our directory in there… it’s in alpha after all, we don’t want to move and replace the file every time.



Comments
A module should take...
just about 60 seconds, and you'll spend most of it on the .info file =)
just implement the directories hook, tell it what directory you want your layouts in and copy your layout directory over to your module. Finis.
Or stick it in your theme, if you like. That's barely documented so far, but your theme can provide layouts too.
this blog is kawaii XD チラシ
I want to specify much like
Abercrombie Jeans
you know評判管理?
Handbags
You probably spent quite a
You probably spent quite a
Module inspiration
I've actually created a module that provides a few new layouts without messing around with files in the Panels module – it is, however, for Panels 3, but feel free to take a look:
http://github.com/kdb/bibliotek.kk.dk/tree/4a4494273ea92c921be46d9fe0087...
page doesn't exist
Can you provide another link for this? Thanks in advance.
Nintendo DS Lite Nintendo
Great Articles………….. thank
Added to DrupalSightings.com
Added to DrupalSightings.com
Please write the followup to this article
This is really cool and would be even cooler if it could be wrapped into a module so that panels wouldnt need to be hacked...
Is the process for this the same with panels 3?
really looking for the right way to do this and it feels like you are so going in the right direction
great article, thanks
I am using Drupal two years
I am using Drupal two years and I love it.Great tutorial.
wedding dresses,wedding
A friend wholesalewalk
A friend wholesalewalk
communication with the public
World of Warcraft offers ten
The next part of the
2009 was a pretty good year
2009 was a pretty good year
replica Rolex Yachtmaster
Thanks for the function mod
replica Rolex Yachtmaster
wow gold
replica Rolex Yachtmaster
replica watches
replica Rolex Yachtmaster
Post new comment