![]() ![]() The final output on your screen should look something like this. I’ll leave the repository as it is, I don’t need keywords, pop my name, oops can’t spell, my name in as the author, and then update the license, 2.0 or later. ![]() I’ll leave that empty, I don’t need a test command. This is to match the WordPress GPL license requirements.Īccept, accept, I’ll leave that empty. You can accept most of the defaults except the license which you will need to specify as GPL 2.0 or later. The command will ask you a series of questions which will be used to create your package.json file. In my case, it’s in development/websites/wordpress/wp-content/plugins/wp-learn-subscribe. Open your terminal and switch to the plugin folder. You will need to create a new package.json file for your existing plugin which manages the necessary dependencies and the different npm scripts. Your first step is to prepare the plugin. Given what you’ve learned by creating a new block with the Create Block tool, you can start adding the required pieces to your existing plugin. You would now like to convert the shortcode into a block so that anyone who installs this plugin can add a subscribe block in the Block Editor. Your plugin code might look something like this adding the shortcode function and rendering the content. It has a div with a custom class, outputs Subscribe in a h2 tag, the content in the paragraph, and the link to the subscribe page. If we inspect the HTML that the shortcode renders this is what it looks like. When you view the post or page the shortcode renders its HTML output, which includes some text and a clickable link to subscribe page. The shortcode can be added to a post or page in WordPress. Suppose you have a plugin which adds a new shortcode called wp-subscribe. In this video, we will cover preparing an existing shortcode plugin for block support, setting up the block registration in PHP, working with the blocks Edit component to render the block in the editor, and working with the block save function to save the block output on a post or page. If you don’t know what the Create Block tool is, I recommend watching the tutorial on using Create Block first and then coming back here. We’ll be using the scaffolded code created by the Create Block tool and applying it to an existing PHP-only shortcode plugin. In this tutorial, you’re going to learn how to convert an existing WordPress shortcode into a block. Hey there, and welcome to Learn WordPress. What React hook is used in the Edit component to pass block properties to the component?. ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |