Jul 06 2016
Jul 06

Google Summer of Code (GSoC) is into the next phase of coding after the mid-Term evaluations which got over by June 27th. This also reminds students to speed up the coding activities to complete the projects within the schedules provided in the proposal.

I am porting Search Configuration module to Drupal 8 as part of this year’s summer of code. GSoC is definitely turning out to be a venue for the young students from universities around the world to work on real-world projects under the experience of well-known developers, learning new technologies, making use of version control systems, with regular meetings and finally building up a software which is going to help a large section of the society.

I blog regularly, sharing my project progress. If you would like to have a glimpse of my past activities on this port, please visit this link.

Drupal 8 has introduced the concept of Html twigs in place of the PHP templates. So, the PHP template files have to be now ported to the Html environment. The .tpl.php template file is replaced by the .html.twig file for the module templates.  Templates are simply text files which can give outputs in Html, Latex, CSV or XML formats.

To print some data, we usually take the service of echo statements in PHP.  The print statements are replaced by {{ }} in Html twigs.

<?php echo t(‘Let’s start the process.’); ?>

is replaced by:

{{ ‘Le’s start the process’|t }}

The variable names have to be converted to simple names. For instance,

$page[‘title’]

becomes

{{  title }}

The PHP logics have to be replaced by {% %} syntax. This is applicable to all the logical statements.

<?php if ($page[‘title]): ?>

…..

<?php endif; ?>

is transformed as:

{% if form %}

……

{% endif %}

Also, the variables are replaced by simple names.

<?php if ($logo): ?>

is transformed as:

{% if logo %}

These were some of the basic transformations to get started into created the HTML twigs.The use of the Html twigs has made the templates look very simple and easily understandable. It is really easy to get the templates converted to the Html twigs. This is always one of the crucial requirements of porting modules from Drupal 7 to Drupal 8.

Stay tuned for further updates on this port process.

Sep 19 2011
Sep 19

Columns. While it may seem like a good idea to a graphic designer, the idea of newspaper-style columns strikes fear in the hearts of themers everywhere. In particular, you may run into an instance where you need a list view to be A-L in the first column, then M-Z in the second column. I'll walk you through a method for doing just that, using a little PHP. Note that this is for Drupal 7, but is easily adaptable for Drupal 6.

I will note first that there are a couple other quickie options that might work for your situation.

1. There are several javascript solutions available, which finds a midpoint in the text and wraps the chunks in divs. This works, but if a user has a plugin like NoScript enabled, this solution does not degrade gracefully.

2. There IS a CSS3 multicolumn solution, but it is largely unsupported. Currently it is only supported by Firefox 1.5+ and Safari 3.

So, eventually, there will be a simple CSS solution, but, for the time being, the cleanest option is server-side, using PHP.

In my example here, we'll look at theming a list view to have multiple columns.

Say you have a view with a some items that we want to display in two columns. Views generates HTML that looks something like this:

<div class="view-columns">
  <div class="view-content">
    <div class="views-row views-row-1 views-row-odd views-row-first"> ... </div>
    <div class="views-row views-row-2 views-row-even"> ... </div>
    <div class="views-row views-row-3 views-row-odd"> ... </div>
    <div class="views-row views-row-4 views-row-even views-row-last"> ... </div>
  </div>
</div>

Here's what that looks like just floating each row to the left. Looks like columns, but they are not in the order we want.

floated rows

Instead, we want something that looks like this:

newspaper style columns

To make this themable with CSS, we need the markup to look like this instead:

<div class="view-columns">
  <div class="view-content" id="leftcol">
    <div class="views-row views-row-1 views-row-odd views-row-first"> ... </div>
    <div class="views-row views-row-2 views-row-even"> ... </div>
  </div>
  <div class="view-content" id="rightcol">
    <div class="views-row views-row-3 views-row-odd"> ... </div>
    <div class="views-row views-row-4 views-row-even views-row-last"> ... </div>
  </div>
</div>

The solution to building this markup is with PHP in a views template. The next trick is to choose the right one! Editing your view, click on the Advanced tab, then on Theme: Information. We want to use the Display output template. So, for example, mine is called: views-view--columns--page.tpl.php.

First, we'll make a preprocess function in our template.php file specific to that views template file that finds the number of view results and the halfway point.

This first function here is a helper function for Drupal 7 so you can add preprocess functions to specific views on the fly:

<?php
 
function THEME_preprocess_views_view(&$vars) {
    if (isset(
$vars['view']->name)) {
     
$function = 'THEME_preprocess_views_view__'.$vars['view']->name;
      if (
function_exists($function)) {
      
$function($vars);
      }
    }
  }
?>

And here's the preprocess function:

<?php
 
function THEME_preprocess_views_view__columns(&$variables) {
   
$view = $variables['view'];
   
// Create a variable that divides number of results in half and add one.
   
$variables['half'] = ceil((count($view->result) / 2) + 1);
  }
?>

Once you have determined the $half variable, which is row number that starts the second column.

So let's add the markup to the views tpl file.

Replace the lines:

<div class="view-content">
  <?php print $rows; ?>
</div>

with:

<?php
 
// remove white space in html
 
$rows = preg_replace('~>\s+<~', '><', $rows);
 
// add the </div><div> in at the halfway point to separate the columns
 
$search = '<div class="views-row views-row-' . $half;
 
$replace = '</div><div id="rightcol" class="view-content"><div class="views-row views-row-' . $half;
 
$rows = str_replace($search, $replace, $rows); //
?>

<div class="view-content" id="leftcol">
  <?php print $rows; ?>
</div>

This will wrap the first half of your results in a leftcol div and the second half in a rightcol div. From there, float your columns and add the necessary padding. Enjoy!

Nov 11 2010
Nov 11

Many of my favorite websites offer a nice little feature, immediately following the body of the page, that highlights 3-5 "possibly related" stories or blog posts. I wanted to do this on OSC and some other sites, but found that it's difficult to add regions inside of nodes—the closest I could get with the default theme/block behavior is to have it appear after comment section, which is too far down the page to be relevant.

I decided to use the Featured Content module to create my blocks, as it offers a good amount of customization as to what kind of algorithms it uses to find related nodes... performance considerations aside. There are other ways to go about creating lists of related nodes, but this was quick and easy.

Adapting a solution I found here, I created a simple function inside my template.php file that allowed me to print a block from inside my node.tpl.php template.

Inside template.php:

<?php
/**
 * Helper function for retrieving block code for insertion into templates.
 *
 * @see http://drupal.org/node/753516#comment-2769068
 */
function osc_block_retrieve($module, $delta) {
 
$block = (object) module_invoke($module, 'block', 'view', $delta);
 
$block->module = $module;
 
$block->delta = $delta;
  return
theme('block', $block);
}
?>

Inside node.tpl.php:

<?php
 
<?php if ($page): ?>

    <div class="block-in-node">
      <?php print osc_block_retrieve('featured_content', '1'); ?>
    </div>
  <?php endif; ?>
?>

I chose to rank related nodes first by similar taxonomy terms, then by how many views the node received (I'm using the statistics module on this site).

Alternatively, you could do one of the following to accomplish the same kind of thing:

  • Set up a region inside your nodes, in the node.tpl.php file. This seems to be a little burdensome, though, unless you're planning on doing many different things inside said region(s).
  • Use the Panels module to add blocks inside of nodes, or in a different kind of page layout.
Jun 29 2010
Jun 29

The Drupal template override system is very intuitive: find the template you want to alter, copy it to your theme folder and adjust it. The handbook page on d.o about overriding themable output is even one of the most complete and appealing I've seen. So I was surprised when I wanted to override the core poll module's "Most recent poll" block, and found out it simply wasn't working. Try as I might the altered poll-results-block.tpl.php that was sitting in my custom theme folder wasn't being recognized, no matter how many times I cleared the registry or double-checked the paths and filenames. I had my Eureka moment want I came across this d.o issue about how themes can't use node-story.tpl.php without node.tpl.php. John Albin explains the history of this issue (and why it won't be fixed in Drupal 6) in comment #48.

The issue is fixed in Drupal 7 but just so you know in Drupal 6...

  • if you want to override poll-results-block.tpl.php you need to copy poll-results.tpl.php as well.
  • if you want to override comment-blog.tpl.php you need to copy comment.tpl.php as well.
  • if you want to create a Zen subtheme with region-sidebar-first.tpl.php you need to copy region.tpl.php as well.
Apr 20 2010
Apr 20

I scheduled the "tpl.phps are not real templates" session and discussion as a BoF session on Wednesday at 11am in room 212 at DrupalCon San Francisco.

From my original post;

"Drupal's template files (*.tpl.php) are not really templates. This is what my DrupalCon core developer summit submission is about. The slides briefly explain why tpl.phps are not real templates, what real templates are, why this is a problem for the Drupal project and community, and mentions some possible solutions to the problem. It also provides some basic guidelines as a starting point for tpl.php standards, should that be pursued."

Links

About Drupal Sun

Drupal Sun is an Evolving Web project. It allows you to:

  • Do full-text search on all the articles in Drupal Planet (thanks to Apache Solr)
  • Facet based on tags, author, or feed
  • Flip through articles quickly (with j/k or arrow keys) to find what you're interested in
  • View the entire article text inline, or in the context of the site where it was created

See the blog post at Evolving Web

Evolving Web