Working with Drupal themes

I was recently tasked with upgrading jQuery from 1.9 all the way up the latest version of 3.x (3.4). And I seriously thought “There is no way jQuery is on version 3 already!”. How wrong I was. Thankfully I wasn’t the only one thinking this, a few of my colleagues were on my wavelength too! So yes, jQuery is really on 3.x and 1.x is actually really, really old! This article aims to help those of you in the same situation as me with some of the common pitfalls you may encounter. Some of this is semi-specific to Drupal 7...

There's nothing like Drupal's default spinning blue AJAX animation to make you notice that a site's design hasn't been fully customised. The code from my previous article showing how to fetch a link over AJAX to open in a Foundation reveal popup would suffer from this without some further customisation. After clicking the 'Enquire' button, a loading icon of some kind is needed whilst the linked content is fetched. By default, Drupal just sticks that blue 'throbber' next to the link, but that looks totally out of place. Our client's site uses a loading graphic that feels much more appropriate in style and placement, but my point is that you can set up your own bespoke version. Since it's Christmas, let's add some festive fun!

A client noticed the dates on their news articles were not being translated into the correct language. The name of the month would always appear in English, even though all the month names had themselves been translated and showed correctly elsewhere. The problem turned out to be down to the twig filter being used in the template to format the date. This is what we did have:

{% set newsDate = node.getCreatedTime|date('j F Y') %}
{% trans %} {{ newsDate }}{% endtrans %}

So this would produce something like '1 March 2018' instead of '1 März 2018' when...

I was asked at Drupalcamp London how to identify where parts of a panel come from. Whether you need to change something on a site you inherited, are looking to trace your steps back on something you created long ago, or need to understand how to fix a colleague's mistake, it can be helpful to have a toolkit of methods to find out what produces all sorts of mystery content - not just for panels, but also views, blocks, fields, and the like.

Previously on this website I have written about rendering blocks programmatically and adding things to content to be managed alongside fields. It's time to combine the two! On many projects, we find ourselves needing to render a block consistently across all content of a certain type. For example:

• Are you trying to place advertising blocks or fixed javascript code between the fields in the content of a page, not just shoved into regions around the content?
• Do you want to show a standard piece of content (we use the bean module for enhanced content in blocks) to be placed...

This is a real quick one, but so useful! We often want to render a block within content, perhaps as part of a node (maybe in hook_node_view, and then made configurable like a field), but there's no obvious way to do this correctly for any block. Drupal normally renders its blocks per region, so there is no single function to embed a block. I came across this really simple solution by Damien Tournoud in a Drupal core issue, which I feel deserves more exposure:

$block = block_load($module, $delta);
$render_array = _block_get_renderable_array(_block_render_blocks(array($block)));
$output = render($render_array);

That's just three...

Here's a quick post that will be a reminder for us as much as anyone else! Setting the default theme during installation using an installation profile is surprisingly hard in Drupal 6, and easier though not obvious in Drupal 7. In Drupal 6, we used the wonderful Install Profile API module, which allowed us to do it in just a few lines in an install task:

  install_enable_theme(array('my_theme', 'garland', 'rubik'));
  install_default_theme('my_theme');
  install_admin_theme('rubik');

In Drupal 7, here's the code I use in my install task:

  // Any themes without keys here will get numeric keys and so will be enabled,
  //...

A quick post about the Drupal tinymce module and it's tendancy to display all it's buttons in one inflexible line. The following CSS will split the tinymce buttons onto several lines.

.mceToolbarTop * {
  float:left;
}
.mceToolbarTop select {
width:auto!important;
}
.mceToolbarTop option {
float:none;
}

By default the Drupal event module will provide a nice calander block, listing the days of the week accross the top using 3 letter abbreviations (mon, tue etc).

This little theme snippet will override this default behaviour and display the first letter of each day of the week (i.e. M T W) etc.

Pop the following into your template.php file and you should be in business

function phptemplate_event_calendar_month($op, $header, 
$rows, $attributes = array(), $caption = NULL) {
  //run through each item in the old header and just use the first letter 
//instead of the entire word
  foreach ($header as $item){...