Breaking News: Grepper is joining You.com. Read the official announcement!

wordpress plugin sidebar (slotfills)

chifarol answered on August 12, 2022 Popularity 5/10 Helpfulness 1/10

answer wordpress plugin sidebar (slotfills)

wordpress plugin sidebar (slotfills)

Comment

#in plugin-sidebar.js
(function (wp) {
	var registerPlugin = wp.plugins.registerPlugin;
	var PluginSidebar = wp.editPost.PluginSidebar;
	var el = wp.element.createElement;
	var TextControl = wp.components.TextControl;
	var useSelect = wp.data.useSelect;
	var useDispatch = wp.data.useDispatch;
	var MetaBlockField = function () {
		var metaFieldValue = useSelect(function (select) {
			return select("core/editor").getEditedPostAttribute(
				"meta"
			)["sidebar_plugin_meta_block_field"];
		}, []);
		var editPost = useDispatch("core/editor").editPost;
		return el(TextControl, {
			label: "Meta Block Field",
			value: metaFieldValue,
			onChange: function (content) {
				editPost({
					meta: { sidebar_plugin_meta_block_field: content },
				});
			},
		});
	};
	registerPlugin("my-plugin-sidebar", {
		render: function () {
			return el(
				PluginSidebar,
				{
					name: "custom-panel",
					icon: "palmtree",
					title: "My plugin sidebar",
				},
				el("div", { className: "plugin-sidebar-content" }, el(MetaBlockField))
			);
		},
	});
})(window.wp);

#in plugin-sidebar.css
	.plugin-sidebar-content {
    	padding: 16px;
	}



#in plugin.php
	function sidebar_plugin_register() {
    	wp_register_script(
        	'plugin-sidebar-js',
        	plugins_url( 'plugin-sidebar.js', __FILE__ ),
        	array( 'wp-plugins', 'wp-edit-post', 'wp-element', 'wp-components', 'wp-data' )
    );
    	wp_register_style(
        	'plugin-sidebar-css',
        	plugins_url( 'plugin-sidebar.css', __FILE__ )
    	);
	}
add_action( 'init', 'sidebar_plugin_register' );
function sidebar_plugin_post_meta_register() {
    register_post_meta( 'post',     'sidebar_plugin_meta_block_field', 
    array(
        'show_in_rest' => true,
        'single' => true,
        'type' => 'string'
    ) );};
add_action( 'init', 'sidebar_plugin_post_meta_register' );
 
function sidebar_plugin_script_enqueue() {
    wp_enqueue_script( 'plugin-sidebar-js' );
    wp_enqueue_style( 'plugin-sidebar-css' );
}
add_action( 'enqueue_block_editor_assets', 'sidebar_plugin_script_enqueue' );

Popularity 5/10 Helpfulness 1/10 Language whatever

Source: Grepper

Tags: sidebar whatever wordpress

Link to this answer
Share Copy Link

Contributed on Aug 12 2022

chifarol

0 Answers Avg Quality 2/10

wordpress plugin sidebar (slotfills)

Contents

More Related Answers

wordpress plugin sidebar (slotfills)

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.