❌

Reading view

3 new components

Quick update; the Utility Components module now has 3 new components:

  • Styled text: Single line of text with support for font size, style and weight, letter spacing (tracking), line-height (leading), and capitalisation. It's good for those little colourful labels of all-caps text that AI likes to add to designs, or for extra large text (e.g. in a "key numbers" row).
  • Carousel: Displays multiple slides of content, one or more at a time. Choose between a "slide" and "fade" animation. Navigation between slides can be automatic, or controlled via swiping, scrolling, or arrow buttons. Built using Splide.
  • Marquee: Displays elements like images or text in a continuously-scrolling bar. Can be paused, and has controls for things like speed, gap, direction, etc. Built using Marquee6k.

They're vanilla and mostly independent, so you can just copy them into your existing theme if you want instead of installing the module. Just make sure to copy the relevant library if you do.

submitted by /u/dane_websites
[link] [comments]
  •  

Module of UI components for Canvas

Hi everyone. Last week I posted about a new module I made for the Canvas layout builder called Layout Components (it has a beta release now).

Today I've just published the complimentary module to it: Utility Components (also beta release).

It contains a bunch of components that are quite popular in most layout builders: • Cover • Expander • Heading • Hero • Icon • Image • Image card • Image beside text • Line • Quote • Text

I made them with the same philosophy; Super simple and lightweight, so that they can easily work with existing themes; independent, so that you can just copy-paste the ones you want to use into your own theme; and completely hand-made (no AI).

I've set up live demo pages to check them out: Layout Components demo and Utility Components demo

I hope they're useful 😄

submitted by /u/dane_websites
[link] [comments]
  •  

New module: Layout Components (for Canvas, etc.)

New module: Layout Components (for Canvas, etc.)

Hi everyone. While exploring the excellent new Canvas page builder, I realised the need for some components that provide layouts I can use in my landing pages. I build my themes from scratch, so using components from an existing theme didn't seem like a good fit.

Because I couldn't find any modules that provide the components I wanted, I made one 😄

The module includes the following components: Columns, Row, Grid, Container, Sized container, Expander, Tabs. Each one is explained on the module page. They utilise various props and slots of Canvas components, so they feel fully native to Drupal.

I've made them as nicely responsive as possible, so for example, a 4-column layout becomes 2 columns on smallish screens (e.g. iPads) and 1 column on small screens (phones).

I rarely use AI, and I really wanted these to be super simple and lightweight, so I coded them myself. They're almost entirely just twig (HTML) and CSS, and only 1 of the 7 layouts actually even ships any JavaScript (Tabs; and it's minimal).

It turns out that single-directory components (SDCs) like these can be used in more than just Canvas; they can be used directly in the theme without a page builder (e.g. by referencing them from the traditional twig templates), and the upcoming version 4 of the Gutenberg module will has first-class support for SDCs. For now they don't work with Layout Builder, but I'm not sure how much demand there is for it any more...

Oh and the each component is completely independent, so if you want to use just one, you can just copy it straight into your theme without even installing the module; that's the beauty of open source.

Let me know what you think, and if you have any requests 😊

submitted by /u/dane_websites
[link] [comments]
  •  

A really hard problem to solve

I've been making Drupal sites for about 12 years, so it's rare that I get stumped when trying to figure out a good solution to a problem, but this one is tricky...

Okay so this is quite a big site (approx. 5000 nodes), with like 10 taxonomy vocabularies. One of them is Tags, with like 2000 tags.

And for almost all of those vocabs, the standard Taxonomy Term view (that appears on route /taxonomy/term/%) that appears on their term pages is just fine.

But for one of the vocabs - called Organisations - I need to use a different view. This view needs to have different fields and filters, and a different treatment for the Title override.

My first thought was to use a unique alias pattern (from Pathauto) to show those term pages at different URLs (e.g. /organisations/*), and then make the new view and make it show on the same route. However that doesn't matter, because the Taxonomy Term view shows on the route /taxonomy/term/%, so it applies to the Organisations pages no matter what I make their URLs / aliases.

And that Taxonomy Term view still applies even if I add a filter that excludes the Organisations taxonomy. In other words, the filter only reduces the results, but it doesn't affect whether the view is applied to that page or not.

Then I though perhaps I could make new pages for each organisation, then place block views on those pages to simulate the term fields and the grid of tagged content, similar to the other term pages. But this doesn't really work, because for those block views, they have to get their "contextual filter" value of the term ID from somewhere. The Taxonomy Term view just gets it from the URL, but with these new pages, the term IDs wouldn't be in their URLs (or I could put the ID in the URL, but that would look bad).

Do you have ideas on how to solve this in a practical way?

submitted by /u/dane_websites
[link] [comments]
  •  

Short video tour for devs curious about Drupal

Short video tour for devs curious about Drupal

Drupal deserves to be way more popular than it is, given how much better it is for making sites than most other software out there. Most of the time when I mention it to clients (or random people I'm chatting to), they've never heard of it, and those that have tend to think it's difficult to use - which I think is kind of incorrect.

So I've decided to start making video shorts, and I'm starting with making them for people who are curious about Drupal, or haven't heard of it but who might benefit from using it over the other site building options.

If you were brand new to it, would this video help you get started with Drupal? And if I make the next few videos as intros to features (like how to get started making Views), is there anything I should do differently?

submitted by /u/dane_websites
[link] [comments]
  •  
❌