a working react/php dynamic wordpress block example integrated with the Vite build process
This commit is contained in:
@@ -6,6 +6,7 @@
|
||||
|
||||
namespace App;
|
||||
|
||||
// Add the badegg block category
|
||||
add_filter( 'block_categories_all' , function ( $categories ) {
|
||||
|
||||
// Adding a new category.
|
||||
@@ -19,29 +20,70 @@ add_filter( 'block_categories_all' , function ( $categories ) {
|
||||
return $categories;
|
||||
});
|
||||
|
||||
// add_action('init', function () {
|
||||
// $blocks = glob(get_theme_file_path('resources/blocks/*/block.json'));
|
||||
// Auto register WP blocks
|
||||
add_action('init', function () {
|
||||
$blocks = glob(get_theme_file_path('resources/views/blocks/*/block.json'));
|
||||
|
||||
// foreach ($blocks as $block_json) {
|
||||
// register_block_type($block_json, [
|
||||
// 'render_callback' => function ($attributes, $content, $block) {
|
||||
// $slug = basename($block->name);
|
||||
// $view = "blocks.{$slug}.render";
|
||||
foreach ($blocks as $block_json) {
|
||||
$slug = basename(dirname($block_json));
|
||||
|
||||
// if (\Roots\view()->exists($view)) {
|
||||
// return \Roots\view($view, [
|
||||
// 'attributes' => $attributes,
|
||||
// 'content' => $content,
|
||||
// 'block' => $block,
|
||||
// ]);
|
||||
// }
|
||||
// Editor JS
|
||||
$editor_js_path = "resources/views/blocks/{$slug}/index.jsx";
|
||||
if (file_exists(get_theme_file_path($editor_js_path))) {
|
||||
wp_register_script(
|
||||
"{$slug}-editor-script",
|
||||
\Vite::asset($editor_js_path),
|
||||
['wp-blocks', 'wp-element', 'wp-editor'],
|
||||
null,
|
||||
true
|
||||
);
|
||||
}
|
||||
|
||||
// return $content;
|
||||
// }
|
||||
// ]);
|
||||
// }
|
||||
// });
|
||||
// Editor SCSS (compiled to CSS)
|
||||
$editor_css_path = "resources/views/blocks/{$slug}/editor.scss";
|
||||
if (file_exists(get_theme_file_path($editor_css_path))) {
|
||||
wp_register_style(
|
||||
"{$slug}-editor-style",
|
||||
\Vite::asset($editor_css_path),
|
||||
[],
|
||||
null
|
||||
);
|
||||
}
|
||||
|
||||
// Frontend SCSS (compiled to CSS)
|
||||
$style_css_path = "resources/views/blocks/{$slug}/style.scss";
|
||||
if (file_exists(get_theme_file_path($style_css_path))) {
|
||||
wp_register_style(
|
||||
"{$slug}-style",
|
||||
\Vite::asset($style_css_path),
|
||||
[],
|
||||
null
|
||||
);
|
||||
}
|
||||
|
||||
register_block_type($block_json, [
|
||||
'editor_script' => "{$slug}-editor-script",
|
||||
'editor_style' => "{$slug}-editor-style",
|
||||
'style' => "{$slug}-style",
|
||||
'render_callback' => function ($attributes, $content, $block) {
|
||||
$slug = basename($block->name);
|
||||
$view = "blocks.{$slug}.render";
|
||||
|
||||
if (\Roots\view()->exists($view)) {
|
||||
return \Roots\view($view, [
|
||||
'attributes' => $attributes,
|
||||
'content' => $content,
|
||||
'block' => $block,
|
||||
]);
|
||||
}
|
||||
|
||||
return $content;
|
||||
}
|
||||
]);
|
||||
}
|
||||
});
|
||||
|
||||
// Disable most of the core blocks
|
||||
add_action('allowed_block_types_all', function(){
|
||||
$blocks = array_keys( \WP_Block_Type_Registry::get_instance()->get_all_registered() );
|
||||
$blacklist = array_diff(block_blacklist(), block_whitelist());
|
||||
@@ -76,7 +118,3 @@ function block_all()
|
||||
|
||||
return array_values($enabled_blocks);
|
||||
}
|
||||
|
||||
add_action('wp_footer', function(){
|
||||
echo '<pre>',print_r(block_all()),'</pre>';
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user