Block Lab at Scale with Culture Amp

Nothing is more rewarding than seeing people pick up something you’ve made, use it, and love it. Over the last year, we’ve seen freelancers, agencies, and even bigger companies pick up Block Lab and do some pretty cool things.

Culture Amp is one of these bigger companies. We’ve been in touch with their team as they’ve built some incredible custom Gutenberg blocks.

We sat down with Amin, their lead dev, and asked them a few things about how they, an enterprise company with an in-house WordPress team, are embracing Gutenberg and building with Block Lab. Here’s the Q&A.

Q: Tell us and our readers a little about Culture Amp and how you are helping businesses around the world.

A: Culture Amp facilitates improving the workplace by enabling HR leaders to make better decisions, demonstrate impact, and turn company culture into a competitive edge by making it easy to collect, understand and act on employee feedback.

The on-demand platform is designed to help customers build an employee feedback program that will work within their organizations, allowing them to tap into the creativity and experience of over 2,500 innovative companies who use Culture Amp to put culture first.

Q: Where did your personal experience with WordPress begin?

A: I started developing for WordPress a number of years ago as a freelance web developer. It served me well as a great middle-ground for myself to develop while allowing clients to manage and add content as needed. Also playing around with Javascript and CSS to handle a number of interactivity was a great bonus since it allowed me the opportunity to apply new updates at a faster pace than normal. I also was using the WP API more extensively to create headless instance of the projects I was working on to best leverage data coming in and out of the websites I was working on.

Q: How has WordPress been a part of the tech strategy for Culture Amp?

A: As our needs and demands for our corporate website grew, a solution was needed that could not just meet the web development aspect but also allow our content marketers to build landing page and make edits on the fly. Coupled with a desire to run A/B tests at a faster pace, we looked into moving our site away from just being a static website to one being run under a CMS platform. WordPress was chosen for its ease of use for content marketers and with the release of Gutenberg, for the web developers, it allowed for faster builds, easy setup, and getting into a modular approach when writing code. Coupled with moving our hosting to WPEngine, we were able to establish staging environments for all web instances for use by our content marketing team.

Q: How have you and your team navigated the transition to the new Block Editor (Gutenberg)?

A: To be honest, we just got right into it. We were aware of how it changed the development of assets and the initial block offering was ok, but it wasn’t until we started using Block Lab that the development and ideation of functionality took off.

Q: You’re using Block Lab on your site! Could you share with us how? And perhaps the most interesting custom block you built?

A: When we started prepping up the WordPress-ization of our website, we initially used ACF in conjunction with WordPress page templates. It was a good solution but had its pitfalls as we started getting deeper and more complex with functionalities that we needed. At that time, we came across Block Lab and gave it a test run. This test run lasted a mere hour and we immediately started added it to our development tool kit, slowly migrating away from the ACF/template approach.

As we got deeper into using Block Lab and listening to the needs/demands of our content developers, the web dev team began building swiss army knife blocks allowing for a wide range of customizations still within our brand guidelines. Some of these blocks are for hero headers, CTA containers, and Hubspot form blocks, to name a few.

Another little thing we needed Block Lab to do was to visually display in the editor blocks would look (more or less) when published. We solved this by adding the specific block’s CSS inside the block. Now whenever a block is used on a page, it’s able to pull the corresponding CSS and give the content marketers a very good idea on how the block will look when published.

Q: What’s a “top tip” you can give for anyone working with Block Lab for building custom blocks?

A: Keep your code clean & simple and know what you want the blocks to do function wise before you start. It’s easy to build blocks but time consuming if you need to consolidate them later down the road.

Q: In your opinion, what does Gutenberg need to do better?

A: Per our findings, creating a clear break of items needed when logged in vs when you’re not. If there was a tool or method to have non-logged users view the website but not get loaded

Q: What feature or tool do you want to see introduced the most in Block Lab?

A: On the top of our ‘we really really want’ list is having conditional functionality within the block editor to show/hide fields. We’ve created a number of super blocks (aka swiss army knife style blocks) that allow our content marketers to use a specific block that can be configured for specific uses with only one block.

Leave a Reply

Your email address will not be published. Required fields are marked *