How to Add JavaScript and CSS to Gutenberg Blocks

As Gutenberg gets closer, more and more people are trying to wrap their head around it. Zac Gordon’s Gutenberg development course is perfect if you’re really getting into it. But if you’re just looking into how to get started, this blog post he made a few months ago is as relevant and accurate as ever.

I love how succinctly he starts as well:

How do I enqueue my block JavaScript and CSS to work with the Gutenberg Editor?

The short answer is there are two ways:

  • enqueue_block_editor_assets – For enqueueing JavaScript and CSS in the admin editor only.
  • enqueue_block_assets – Enqueues on both the frontend of the site and in the admin editor (unless !is_admin() is used then it just enqueues on the frontend only).

If you come to the post with that exact question, this “TL;DR” may be enough for  you. And if you need more detail, he goes into it. It make for a much more handy quick reference than many articles. Including *cough* my own *cough*. Something I should consider doing… ?


Add a Comment

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

The WPShout Pro Community is here! One-to-one help. Never be stuck again. Master WordPress development. Take a look
Hello. Add your message here.