Tag: Planet Drupal

I had to do a little RTFMing today, and so I thought I'd post about it. First of all, this is how you set up PhpStorm to use ES6 eslint settings. You may find it useful Is the linter getting in your way? The first way to override an eslint setting is inline, disabling it on a one-off basis. If you truly need a new .eslintrc.json file, then you should probably extend the one from Drupal core. Here's how the linter looks for eslint files. TL;DR: like .gitignore files. Finally, here's how the extends property of eslintrc.json…

You may not know this, but support for ES6 was added in Drupal 8.4. It wasn't in the release notes, but I was delighted to learn of it. You have probably landed here because you have gotten the error: Cannot find module 'eslint-config-airbnb'. If you want to see ES6 linting in PHPStorm, you'll need to do a couple of things. (In order to actually use ES6 in your theme, you'll have to configure your own build transpiling task, which is out of scope here…

I had a very strange problem wherein I was not able to affect variables being passed to views-view-grid--my_view.html.twig. function mytheme_preprocess_views_view(&$vars) { if ($vars['view']->id() == 'myview') { $vars['amaaaazingVar'] = '!'; } } Yet, sadly, there was no amaaaazingVar to be found in views-view-grid--my_view.html.twig when I did {{ kint() }}. What did I do? I set a breakpoint in the twig template using this methodology and then looked back through to see what preprocess functions were being called by the theme. And yes... my preprocess function was called. But the variables weren't getting saved. Strange. Why were my variables clobbered…

On the method of disabling a block without recourse to path…

On the method of creating custom breadcrumbs: simply crumble stale bread and dip battered eggs into your bowl. But in Drupal…

I had a devil of a time figuring out where captioning was coming from on my entity embeds. Another team member had set it up, and I was just kind of baffled as to why captions were being offered on my entity embed forms. It turns out that if you turn on captioning, you just get it for free on all of your embeds, and it's not configurable. But... I don't want it for free! Bah. Humbug. Here's how you turn off captioning using hook_form_alter()…

Views has a setting to exclude the current nid from the URL from the listing one is currently viewing. This is essential when you have, say, a list of related nodes that are are defined by a category that includes the current node. If you don't exclude the current node, your current node will be listed in the "related content" block on itself. Well, obviously one is related to oneself, one thinks. First, I tired to accomplish this through the UI with these steps, below. Add contextual filter: Get content ID from URL: Exclude results: Perfect! Except, wait…

It turns out that image style tokens are an easter egg of the regular Token module, ported in from the Imagecache Token module on this ticket. Image style tokens don't show up in the media browser, and so you sort of have to guess at how to use them. I figured it out by studying the merged commit that added the functionality…

Pluralizing and singularizing words got very easy with the inclusion of the Doctrine Inflector class in Drupal 8 core. use Doctrine\Common\Inflector\Inflector; $pluralized = Inflector::pluralize($bundle_singular); $singularized = Inflector::singularize($bundle_singular); You can read more about the Doctrine Inflector class here…

The task at hand here is to allow the client to create a classed wrapper around multiple elements using CKEditor in Drupal 8. The fundamental problem here is the CKEditor's built in "Styles" dropdown classes each individually, while we need a class wrapping them. You could probably make or install your own CKEditor plugin, but that's not what I did. I did this with Javascript…

Client has a bunch of static landing pages that are mobile-friendly and need to remain that way. But what is to be done about srcset? Read on, oh reader, for the solution. First, I created a gulp build task which makes a bunch of different sizes. Install dependencies like this: npm install -D gulp-load-plugins gulp-responsive sharp. The task uses gulp-responsive to generate multiple image sizes from a source directory…

There're a lot of really complicated descriptions of srcset out there. As a result, I thought srcset was more complicated than it actually is. Here's the all-purpose srcset code I used in my static HTML. This covers 1x, 1.5x, 2x, and mobile optimization in a fine-grained way: Explanation In srcset, you're telling the browser the sizes of the images that you have to fill the hole. /images/myimage-100w.png 100w, describes the width of the image myimage-100w.png as 100px. In sizes, you're specifying the size of the image hole to fill based on media queries…

Over the last several days, I've railed in my head against the matroshka structure of Drupal entities. But when I tried to break out some helper functions, and when I realized what each of the different properties each entity had, I realized the complexities of entities were warranted. Life is complex, and thus Drupal is complex. Entity references load a Media Entity, which load an Image from an image field, which load a File. The alt and title are on the Image, while the file URI is on the file…

This function gets all the Media ID's from the database whose names begins with a specific string. I'm using this for an array of default images. You can see I'm using both drupal_static() and \Drupal::cache(). Necessary? I would bet \Drupal::cache() goes to the database to ask for information (unless you're using Memcache or Redis, that is), and thus in a view with multiple content listings calling this function drupal_static() will be faster, because that saves to a PHP variable. Overkill for a little query like this? OK, sue me. I love performance. Here's the code…

Another day learning Drupal 8, but today is troubling. Here's where I'm at. I'm theming search results, and I need to load field values to pass to twig templates—specifically a styled url for img src. Entities values are not loaded on search results, only little snippets, so I have to load them the hard way, because we want images and nice theming on our search results…

Quite the problem—Drupal config management on local and prod. Drupal 8 can be punctilious: it will simply refuse to work if there's a mismatch between database and config objects on the filesystem. So... how do we manage two sets of configurations—one for local, and one for production? The Problem I have modules like varnish installed on production that shouldn't be enabled on local, and modules that are enabled on local that shouldn't be enabled on production. I have uninstalled varnish_purger on local…

Nobody likes iframes. That's because you can't style their innards, and they aren't responsive... or are they?!?! The first thing to know about here is the padding height hack. This allows you to set the height of an object relative to the width, because while height is always as a percentage of the container, padding height is as a percentage of width. So all you have to know is the ratio of height to width and you can make a thing that responsively scales. My first attempt was to use javascript to get the viewport height from the iframe…

Often one finds oneself needing to parse HTML. Back in the day, we used regexes, and smoked inside. We didn't even know about caveman coders back then. Later, we'd use SimpleHtmlDom and mostly just swore when things didn't quite work as expected. But now, we can use PHP's DomDocument, and in Drupal we create them using Drupal's HTML utility. At the top of your file place: use Drupal\Component\Utility\Html; Now, I'm looking for an iframe embed in my HTML, and I want the src, width, and height…

Have you ever wanted to .gitignore a file by branch? The classic example for me here is versioning the generated styles.css file on master (which is deployed to production) but not on develop (which is used for pull requests). Versioning the styles.css file can result in merge conflicts or PRs that are just messy. Here's the script I wrote. Read the comments for installation notes…

Personally, I feel overwhelmed looking at the ocean of metatags presented on the node edit page when the metatag module is installed. How much more overwhelmed would a regular ol' user feel? I created a small modules to hide the extra form elements from the metatag module: metatag_limit.module…

There are many suggestions for how to go about theming field collections and several confusing problems. The most important problem is that there appears to be no preprocess hook for field-collection-item--my-field-collection-name.tpl.php (if someone knows otherwise please correct me in the comments, my tests did not work). Next, using field--my-field-collection-name.tpl.php cascades down to all the fields on the field collection, which results in confusing behavior. There is a very long thread on this subject which would take you time to digest…

The view relationship for Flag module only allows you to set a single flag type as a target, which means only one flag type is available on a views row. My specific use case is adding flag/unflag links to the /admin/content page which I've replaced by a view with the Admin Views module. I ended up digging around quite a bit through Flag module's source code to pop this one out. The heart of it is in a views field template--one of your choosing…

The admin toolbar is a user's first look at Drupal. A complex, cluttered toolbar gives the n00b a sense that things in this site are too much to handle. A clean, well-curated interface that presents content tasks first gives the n00b a sense that Drupal is easy to use. Drupal 8 promises a simplified toolbar that gives the user this cozy sense of belonging. Default Drupal Toolbar The toolbar module is a big improvement over no toolbar at all…

Ever have wanted to import data into your Drupal site from JSON or a big ol' PHP array? You don't need to sweat all the gory details of matching up nodes and fields and coding massive for loops. Let the Drupal Feeds module do that for you. We're going to be uisng the Feeds Extensible Parsers module which provides a JSONpath expression analyzer…