Working with Drupal themes

Rendering Drupal block plugins can be tricky. In this article we explain how to render them and how you might go about finding the correct ID to pass into createInstance(). We also have a handy tips and tricks section at the bottom which is worth checking out alone!

Using Sass >= 1.80 and wanting to shush those @import deprecation notices with minimal effort? Or ready to upgrade towards 3.0.0 ? There was a nice clear notice, with a decent explainer. But you want a quick 1-2-3, so keep reading!

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...

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: ```twig {% set newsDate = node.getCreatedTime|date('j F Y')...

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...

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...

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...

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; }