Theming Panels and Views

We chose to use the 'flexible' layout for all of the panels on MyPlay. Flexible allows the admin to set exact width units (%, em or px) in the layout settings for the total page as well as individual columns. Pixel-based column widths were essential for the new design, specifically for browser compatibility as safari tends to read % and em differently than other browsers. This is another big advantage of Panels 2 as Panels 1 is all percentage-based.

Virtually every view we use has a custom theme function that allows us to recycle the view but change look and feel based on where/how the view is being called. We also account for this in the node tpl files as needed. Examples follow:

http://myplay.com/artists/britney-spears
and
http://myplay.com/music/britney-spears

use the same standard linked image/linked title list view for the music block:

In our theme function (in template.php) for "function mytheme_views_view_list_myview($view, $nodes, $type) {"
we break up the $output displays via:

// artist nodepanel needs only 1 image
if (arg(0) == 'artists' && !is_null(arg(1)) && is_null(arg(2))) {
(make look this way)
}

elseif (arg(0) == 'music' && !is_null(arg(1)) && !is_null(arg(2))) {
(make look that way)
}

Another handy trick is sniffing for views in the node.tpl file via:

<?php global $current_view; ?>
<?php if ($current_view->name == 'some_view' || $current_view->name == 'another_view'): ?>

    (whatever you want here)

<?php elseif ($teaser): ?>

    (format the teaser)

<?php else: ?>

    (full node view)

Pane-specific node tpls

Panels 2 has tools for very fine-grained theming control. Using our example above of Argument 2 - Video Node Title, there is a unique node tpl file for the video content type when called via this panel. Steps for using this method (in Drupal v 5.x) are as follows.

In the panel/content tab for Node Name 2 Video - node content pane we have the Identifier set as:

Next, in your template.php file, specifically the section for _phptemplate_variables - $hook == 'node', add the following code:
<?php

if (!empty($vars['node']->panel_identifier)) {
$vars['template_files'][] = 'node-'.$vars['node']->panel_identifier;
}

...note that if your template.php file does not have a section for this check the Zen theme for examples to copy.

Finally, create your node tpl file. In our case this file is named: node-video_node_pane.tpl.php
This can be themed as any other node tpl file.