Settings Sidebar:: Add Block Text, Image and Checkbox Fields - WordPress Gutenberg Block
Add new controls in the WordPress Gutenberg Block Settings Sidebar. We add Block Text, Image and Checkbox Fields using the native Javascript/React Components. We learn how to handle the Block Editor JSX and build on the first plugin we did in the previous video.
VIDEO CHAPTERS
00:00 Saving Block Settings in Sidebar
01:03 Navigating the WordPress Block Editor Library
02:03 JSX & The Block Editor
04:56 The Blocks Inspector Control
05:49 WordPress Block Panel
07:11 Using the Blocks Checkbox Control
10:29 Add Block TextArea Controls
12:52 Upload Images with MediaPlaceholder component
13:52 In-depth MediaPlaceholder component
15:07 Next video
HOW TO SUPPORT THE CHANNEL
=============================================
Do you like what I am doing?
- Buy me a coffee through https://www.buymeacoffee.com/techiepress
- Give via PayPal: https://paypal.me/laurencebahiirwa
- Buy Scalable WordPress Hosting -----https://omukiguy.com/kinsta
- Buy Low cost Hosting ----------------------https://omukiguy.com/bluehost
- Build no code website with Elementor -- https://omukiguy.com/elementor
- Enhance Elementor with Crocoblock --- https://omukiguy.com/crocoblock
- Automate API Requests & Webhooks -- https://omukiguy.com/integromat
- Screen Record with your computer ----- https://omukiguy.com/screenflow
- Make Awesome forms with WPForms ----- https://omukiguy.com/wpforms
- Build Advanced with Gravity Forms --- https://omukiguy.com/gravityforms
I am social too:
Facebook: / techiepress-100149655032583
Twitter: / omukiguy
Blog & Newsletter: https://omukiguy.com
Github: https://github.com/yttechiepress
-------------------------------------------------------------------------------
LEARN MORE IN THE WELL CURATED PLAYLISTS BELOW
--------------------------------------------------------------------------------
Learn how to build a plugin from scratch: • Plugins Vs Functions.php - Where shou...
WooCommerce E-Commerce customizations
== Build Free Custom E-commerce Online Shop using WooCommerce - • WooCommerce customizations - Free Wor...
== Build Free Custom Theme for E-commerce Online Shop using WooCommerce -
• Woocommerce Restaurant Shop - Custom ...
====== Build Dynamic Websites with Elementor ======
== Learn the Elementor basics - • Elementor Beginner Tutorials
== Build a custom Elementor Widget from Scratch - • Build Custom Elementor Widgets from s...
====== How to use WordPress Gutenberg Block Editor ======
WordPress 5.4 Gutenberg Blocks Updates
== • WordPress 5.4 Gutenberg Blocks Updates
WordPress Gutenberg blocks for Designers
== • WordPress Basics Training: Gutenberg ...
Gutenberg WordPress Block Editor tutorials for beginners
== • WordPress Basics Training: WordPress ...
Custom WooCommerce Gateway Development from Scratch
== • Build Custom WooCommerce Payment Gateway
WordPress Custom REST API Namespaces, Endpoints and Examples from Scratch
== • Create Custom WordPress REST API POST...
====== WordPress Plugin Development from Scratch ======
Build Most Popular & Most Commented Post Plugin
== • Build WordPress Most Popular & Most C...
Build SMS Plugin with External WordPress API Integration using custom WordPress Databases
== • Build SMS Plugin - External WordPress...
WordPress External APIs Integration Plugin Development
== • WordPress External APIs Integration P...
Convert WordPress to mobile App in Headless WordPress
== Convert WordPress Sports Website into Mobile Application - https://www.youtube.com/playlist?list...
Make GraphQL API endpoints with WordPress Headless CMS WPGraphQL Plugin
== • Make GraphQL API endpoints with WordP...
Customize Your WordPress & ClassicPress
== Build Custom REST API Endpoints with WordPress or ClassicPress - • Build Custom REST API Endpoints with ...
Custom Dashboard Widgets
== • Custom Dashboard Widgets WordPress & ...
Build Custom Admin
== • Custom Admin for WordPress or Classic...
Learn Git
== Git tutorial for writers + software developers for beginners - • Git tutorial for beginners - writers ...