Adding Rich Text Content & Registering Block Format Types in the Gutenberg Block Editor Development

Опубликовано: 21 Февраль 2023
на канале: TechiePress
1,583
23

The Gutenberg Block Editor is an essential tool for creating dynamic and interactive content in WordPress. If you're a developer, you can take your content creation capabilities to the next level by learning how to add rich text content and register new block format types in the Gutenberg Block Editor.

In this video, we'll explore the process of adding rich text content and registering new block format types in the Gutenberg Block Editor. We'll start by discussing why Rich Text is important in the Gutenberg Block Editor and the benefits of using it, including how it's used in Gutenberg rich text blocks.

Then, we'll dive into how to register new block format types using the RegisterBlockType Gutenberg API, which allows developers to create custom block types. This is a clear Gutenberg block example to illustrate how to use the API to add custom formatting options in the daily content creation usage.

By the end of this video, you'll have a comprehensive understanding of how to add rich text content and register new block format types in the Gutenberg Block Editor using the Gutenberg block API. Whether you're a seasoned developer or a newcomer to WordPress, this video is a must-watch for anyone looking to take their content creation capabilities to the next level. Let's dig in!

Chapters
00:00 Adding Rich text to the Block editor Challenge
02:03 Scaffold plugin with wp-scripts
02:58 Cleanup Plugin setup files
05:07 Register Format Type for Block Content
06:38 Check for Registered Format Types in WP
07:29 Adding a Rich Text Toolbar Button
09:19 Use onChange events to add new button markup
12:17 Register Multiple Format Types
13:01 Unregister Format Types in Block Editor
14:24 Complete registry of multiple Block Format Types
18:04 Conclusion

The usable plugin can be found here:
WordPress Repo: https://wordpress.org/plugins/simple-...
Github: https://github.com/bahiirwa/simple-ht...

HOW TO SUPPORT THE CHANNEL
=============================================
Do you like what I am doing?
Join channel membership to get access to perks:    / @techiepress   Buy me a coffee through https://www.buymeacoffee.com/techiepress
Give via PayPal: https://paypal.me/laurencebahiirwa
Visit https://omukiguy.com/support-my-work/

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...

Learn Git
== Git tutorial for writers + software developers for beginners -    • Git tutorial for beginners - writers ...  


Смотрите видео Adding Rich Text Content & Registering Block Format Types in the Gutenberg Block Editor Development онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь TechiePress 21 Февраль 2023, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 1,58 раз и оно понравилось 2 людям.