• Extend the WordPress Customizer Using JavaScript


    Did you know that you can create Customizer Sections and Panels in JavaScript? Did you know that you can also register Customizer Settings and Controls in JavaScript too? You can do all that and more, with code similar to the following: Note that in our text control we have used the setting wholesomecode_wholesome_plugin_example_text, unfortunately we […]

  • Have you ever wondered how you can perform an action on save when using Gutenberg? Are you looking for a hook or a filter so you can perform an action when saving a post? Good news, you can easily hook into the save with Gutenberg with the following code. Just add the following to your […]

  • In our last guide we looked at creating a settings page using WordPress Block Editor (Gutenberg) components. In this guide we are going to take it even further and use Gutenberg components inside the WordPress Customizer. The Customizer with Gutenberg Components Prerequisites Create an Entry Point in webpack Following on from the Add Entry Points […]

  • We have previously looked at storing options and settings using the WordPress Block Editor (Gutenberg), and expanding the Create Block Script to allow for extra end points. In this guide we are going to put them all together to create a settings page using Gutenberg components. The settings page we are about to build But […]

  • When you first create a block with the WordPress create block script using npm init @wordpress/block it provides you with an entry point to /src/index.js, that you can use to compile all of your block based assets and styles. Sometimes you want to add other entry points, for example, you may want to use WordPress […]

  • The first question you might have is “why would I need to create custom meta boxes with the Block Editor (Gutenberg)?“, you can still implement meta boxes with PHP, and add controls to the block, post, or even a custom sidebar in Gutenberg. There are a few reasons why you might want to do this, […]

  • When you register and store attributes in the WordPress block editor (Gutenberg) you have the option to store them as post meta, instead of the usual block attributes. Using this method, you could have a setting in your block that can control something post wide, or on the template. An Important Note About Rendering Post […]

  • When you create a block in the WordPress Block Editor (Gutenberg) you can create an area that allows other block types to be nested inside your block. You do this with the InnerBlocks component. In our other guides we previously explored block patterns and block templates. This guide looks at creating a template for nested […]

  • In my previous guide I explored the power of block patterns. Block templates are similar, but instead of relying on your client to insert block patterns into the editor, it gives them a full layout as soon as they insert a new post. Prerequisites Create your Block Template In this example I am going to […]

  • If you are new to the WordPress Block Editor (Gutenberg) you may be wondering how to get started with creating your own plugin. Luckily the WordPress development team have a handy npm script for you to create a block plugin that creates a starter block so you can quickly get up and running. By default […]