This totals less than an hour of work. And it’s not a throwaway demo, it’s a fully working and client-ready Drupal site (both back end and front end) that we could use to eventually deliver the project. There is still plenty of work to do, and they do have a budget. But a lot of the work is in getting everyone to agree on what we should build.
I used the drupal_cms_search recipe to get a basic Search API implementation, including the index and view, for all of my content. Then I created a new display with a content type filter for the resource-specific search.
An existing client came to us six months ago about a new website build that they were facilitating on behalf of a larger group of stakeholders from different government agencies. The site seemed relatively simple but the brief was vague enough that we took a conservative approach: providing an estimate for requirements gathering, design and build based on the requirements.
Creating the page was simple using Mercury’s component library, but this is where I hit my first (and only) snag. The facets were appearing in the component preview, but not on the page. This took up an annoying few minutes but turned out to be a bit of a fluke: The wireframe had the facets in the left sidebar, with the results on the right. Known issue with Layout Builder that facets won’t load if they are placed before the view; same goes for Canvas apparently but I’ll deal with that later.
When we did hear back recently, it was clear that they hadn’t made any progress. The budget was a concern, and it was proving difficult to get the individual stakeholders to sign on. The brief hadn’t meaningfully changed, but they wanted to know if we had any suggestions for how to deliver more efficiently.
In my day job, I work at a Drupal agency in Australia. Because most of our work comes from existing clients, on existing websites, I haven’t had much opportunity to leverage the full power of Drupal CMS.
But I didn’t want to wait. Before we finished the call, I spun up a local Drupal CMS instance using the Starter template with Mercury as the theme. In less than 5 minutes, I had the site up and running and created part of the home page.
What a difference six months makes: It’s not that I just didn’t think of this back then. It was still early days for Canvas, and I was still learning not just how to use it but how to adapt my approach to building sites. I’ve since spent a lot of time building site templates, and a few sites, and now it feels like I’ve unlocked something.
| Task | Time | Drupal CMS factor |
|---|---|---|
| Site install and create home page | 5 min | Using the Starter template gave me everything I needed to get straight to building with Canvas. |
| Create an article content type | 2 min | Almost all of the necessary fields were already created for the Utility page content type. I just had to add the existing fields, and create a new Category taxonomy and add that as a reference field. |
| Create a card display (Canvas content template) for the article | 5 min | I used the existing image card in Mercury, and added props for category and date, then mapped the component to the article fields. |
| Create a view of recent articles and add it to the home page | 5 min | Creating a view of the latest four articles is easy. Adding it to the page is too since Mercury includes a section component with a views grid option (2 / 3 / 4 columns) out of the box. |
| Create a resource content type | 5 min | Similar to the article content type, but needed four new taxonomy vocabs and had to create a few terms. |
| Create a card display (Canvas content template) for the resource | 2 min | I did this quickly and in kind of a hacky way, using the group, image and heading components to create the display rather than creating a custom component for this. I would not keep this as-is on a real site, but it is passable and it was fast. |
| Generate sample content | 5 min | Not Drupal CMS related but I used Devel Generate to create sample articles and resources. I had to redo it a few times to get it exactly right. |
| Create a resource search with facets for taxonomy | 5 min |
I updated the layout to put the facets on the right as a workaround. It took a bit of trial and error to get the right config with that combined with the Better Exposed Filter settings to get the checkbox display with submit on select. And what I find most exciting is that we’re not going to spend all of the budget getting it to work, because that’s easy. We can spend it on getting it work well: investing in the user experience, visual polish, and interactions. |
| Add facets module and create facet filters | 5 min | Installed Facets and added the four filters via views exposed filters. |
| Create the resources page with the search and facets | 15 min |
I still don’t know whether we’ll win this project, but this exercise was hugely beneficial for me and has shifted my thinking about how we approach sales in general. But that’s a whole different post! Below is a breakdown of the tasks, how long they took, and why it was much faster using Drupal CMS. |
| Create full content template for article and resource | 5 min | I didn’t need these for the demo, but I quickly created content templates for the article and resource full content display, using existing components, so they didn’t look messy. |
| Updated the heading font to Roboto (from Outfit) | 2 min | The Outfit font seemed a bit too playful for this site, so I swapped it with Roboto. In theory I could use the new Canvas brand kit but it was faster to drop in the files (copied from Byte Theme) and update theme.css. |
My goal with the demo was not to say that we can deliver the project in a few hours. It was to convey that what they want to build is not technically complicated and could be easily delivered using Drupal. By taking that risk out of the equation, I was aiming to get over the technology hurdle so that we could get buy in and get started on the actual hard question: What do we need to make this successful?
The search recipe also includes Search API Exclude and adds this field to existing node types, which is a nice extra that I would not have thought of had I been doing this from scratch.
Two hours later, I had built everything I wanted for the prototype — and I had a one-hour meeting in that time! (I may or may not have done a bit of tinkering during that meeting.)
Looking at the two wireframes they provided, I realised it would be trivially easy to develop a prototype of their desired functionality using Drupal CMS. I proposed in our internal meeting that I could spend up to a day to get something worth showing, and we agreed to run that by the client.
