October 9, 2019
I've worked on several sites recently where the site search form is hidden by default and displayed by activating a button. This pattern caused me a bit of confusion about where to put the role="search" attribute, which is important for accessibility.
According to the W3C specification the search role is:
A landmark region that contains a collection of items and objects that, as a whole, combine…
Accessibility: where to put the search role when your search form is hidden
October 3, 2019
I'm working on a website which has a list of products, displayed in a View. Each product has an "provider" who produces it, associated with the product content type by an entity reference field to a Provider content type and displayed in the view. The client wanted contact information for the providers to show up in the list as well.
It would have been a bit bulky and repetitive to have the…
Show complementary information in a View based on exposed filter choice - Drupal 8
October 2, 2019
Hatticus is a fun, cabled hat with a pointed top and pom-pom knit in super-bulky yarn. Due to the giant yarn and needles, it's a super-fast knit.
Feel free to leave a comment here or send me a message with any questions or corrections.
Hatticus: Free Super Bulky Cabled Knit Hat Pattern (PDF)
Hatticus: Free super-bulky cabled knit hat pattern
September 23, 2019
Recently, I was creating an event registration Webform. I created a custom composite field with the fields needed for each registrant: first name, last name, and a set of three radio options for their organization status: member, non-member, membership fee included in event registration. Each status has a different registration fee.
I then wanted to create a computed Twig field that would…
Calculate a value from options field in Webform custom composite element with Twig - Drupal 8
June 7, 2019
A common pattern for websites is a list of content, for example news, with one (or more) featured items, followed by a list of a few more items, excluding the featured one(s). This seems like it should be simple to do, but it's not as straightforward as it seems.
Here's an example of how to achieve it with Views in Drupal 8. There are many ways of flagging featured content. In this case, we want…
How to create a View with a featured item and a list that excludes the featured item, Drupal 8
May 21, 2019
I've been working on a site with events, and tearing my hair out over how to print formatted dates with the correct timezone value in Twig templates, specifically node.html.twig and views-view-fields.html.twig.
The issue was first, getting the formatted date to display in the template; and secondly, when I managed to get it displaying, it was not in the correct timezone; it was off by several…
Print formatted date with correct timezone from datetime or daterange field in node and Views templates - Drupal 8
May 17, 2019
I'm working on a website which has icons on file upload links, like so:
This works for people who can see the icons, but what about those who can't? Accessibility means giving all users an equivalent experience, regardless of how they're accessing the site.
If the icons were inline images, we could add alt text with the filetype. However, in this case, they're background images.
So, we want to…
Add file type indicator to file field links for accessibility - Drupal 8
April 23, 2019
By default, the label for the core Search module text input in Drupal 8 is invisible, that is, it's present but visually hidden so users of assistive technology can read it. But what if you want to display it visually?
There's no way to do it through configuration, and little to no information about how to do it with code. I found where the visibility was being set, in SearchBlockForm.php in the…
How to make core search block form label visible - Drupal 8
April 17, 2019
Let's say, for example, we have a site with a menu whose links have a different background colour depending on what category they belong to, cats or dogs. The HTML might look like this:
<ul class="menu"> <li class="menu-item"> <a…
How to add title as data attribute to menu links in Drupal 8 and Twig
March 26, 2019
(Note that this method will strip any HTML in the text fields. It…
Truncated expanding text field with "show more" link in Drupal 8 & Twig