Tag: gutenberg

  • A word counter for Gutenberg blocks

    One of the main goals of – albeit slowly – setting up this blog, is writing more. And I also want to keep track of the length of the posts I make (I’d love to be able to call them articles one time 😉).

    That’s why I implemented a word counter today, that displays the words you’ve written, in the editor, as you type. I based the functionality on the code found here. It didn’t work anymore, but after some research I managed to make it work again.

    Turns out the Gutenberg editor (aka Block editor) is often running in an iframe. Which makes it a tiny bit harder to access the blocks in the editor with javascript.

    Screenshot of the editor with the counter in the top right displaying: 34 words.
    Screenshot of the Block editor with the counter in the top right displaying: 34 words.

    Download the WordPress plugin

    You can find the WordPress plugin here on Github.

    What’s next?

    I want to improve this functionality with a post-wide counter that displays the total amount of words over every block in the post.