| 1 |
<?php |
| 2 |
/** |
| 3 |
* Blocks Initializer |
| 4 |
* |
| 5 |
* Enqueue CSS/JS of all the blocks. |
| 6 |
* |
| 7 |
* @since 1.0.0 |
| 8 |
* @package CGB |
| 9 |
*/ |
| 10 |
|
| 11 |
// Exit if accessed directly. |
| 12 |
if ( ! defined( 'ABSPATH' ) ) { |
| 13 |
exit; |
| 14 |
} |
| 15 |
|
| 16 |
/** |
| 17 |
* Enqueue Gutenberg block assets for both frontend + backend. |
| 18 |
* |
| 19 |
* Assets enqueued: |
| 20 |
* 1. blocks.style.build.css - Frontend + Backend. |
| 21 |
* 2. blocks.build.js - Backend. |
| 22 |
* 3. blocks.editor.build.css - Backend. |
| 23 |
* |
| 24 |
* @uses {wp-blocks} for block type registration & related functions. |
| 25 |
* @uses {wp-element} for WP Element abstraction — structure of blocks. |
| 26 |
* @uses {wp-i18n} to internationalize the block's text. |
| 27 |
* @uses {wp-editor} for WP editor styles. |
| 28 |
* @since 1.0.0 |
| 29 |
*/ |
| 30 |
function wordpress_cgb_block_assets() { // phpcs:ignore |
| 31 |
// Register block styles for both frontend + backend. |
| 32 |
wp_register_style( |
| 33 |
'wordpress-cgb-style-css', // Handle. |
| 34 |
plugins_url( 'dist/blocks.style.build.css', dirname( __FILE__ ) ), // Block style CSS. |
| 35 |
array( 'wp-editor' ), // Dependency to include the CSS after it. |
| 36 |
null // filemtime( plugin_dir_path( __DIR__ ) . 'dist/blocks.style.build.css' ) // Version: File modification time. |
| 37 |
); |
| 38 |
|
| 39 |
// Register block editor script for backend. |
| 40 |
wp_register_script( |
| 41 |
'wordpress-cgb-block-js', // Handle. |
| 42 |
plugins_url( '/dist/blocks.build.js', dirname( __FILE__ ) ), // Block.build.js: We register the block here. Built with Webpack. |
| 43 |
array( 'wp-blocks', 'wp-i18n', 'wp-element', 'wp-editor' ), // Dependencies, defined above. |
| 44 |
null, // filemtime( plugin_dir_path( __DIR__ ) . 'dist/blocks.build.js' ), // Version: filemtime — Gets file modification time. |
| 45 |
true // Enqueue the script in the footer. |
| 46 |
); |
| 47 |
|
| 48 |
// Register block editor styles for backend. |
| 49 |
wp_register_style( |
| 50 |
'wordpress-cgb-block-editor-css', // Handle. |
| 51 |
plugins_url( 'dist/blocks.editor.build.css', dirname( __FILE__ ) ), // Block editor CSS. |
| 52 |
array( 'wp-edit-blocks' ), // Dependency to include the CSS after it. |
| 53 |
null // filemtime( plugin_dir_path( __DIR__ ) . 'dist/blocks.editor.build.css' ) // Version: File modification time. |
| 54 |
); |
| 55 |
|
| 56 |
/** |
| 57 |
* Register Gutenberg block on server-side. |
| 58 |
* |
| 59 |
* Register the block on server-side to ensure that the block |
| 60 |
* scripts and styles for both frontend and backend are |
| 61 |
* enqueued when the editor loads. |
| 62 |
* |
| 63 |
* @link https://wordpress.org/gutenberg/handbook/blocks/writing-your-first-block-type#enqueuing-block-scripts |
| 64 |
* @since 1.16.0 |
| 65 |
*/ |
| 66 |
register_block_type( |
| 67 |
'cgb/block-wordpress', array( |
| 68 |
// Enqueue blocks.style.build.css on both frontend & backend. |
| 69 |
'style' => 'wordpress-cgb-style-css', |
| 70 |
// Enqueue blocks.build.js in the editor only. |
| 71 |
'editor_script' => 'wordpress-cgb-block-js', |
| 72 |
// Enqueue blocks.editor.build.css in the editor only. |
| 73 |
'editor_style' => 'wordpress-cgb-block-editor-css', |
| 74 |
) |
| 75 |
); |
| 76 |
} |
| 77 |
|
| 78 |
// Hook: Block assets. |
| 79 |
add_action( 'init', 'wordpress_cgb_block_assets' ); |
| 80 |
|
