My recommendation for hosting your WordPress website is DreamHost and specifically their "Shared Unlimited" yearly plan (the exact plan I've used for 19 years). If you use my link to DreamHost it helps support my UA-cam channel and costs you nothing extra: click.dreamhost.com/aff_c?offer_id=109&aff_id=17231
I prefer to use the Classic Editor in text mode. I am still referring to your theme development tutorials from ten years ago so thank you for keeping them available online.
I still vastly prefer (personally) the classic text editor. I only learn / teach / use the block approaches because that's the direction WordPress is going and I feel responsible to help people learn the new approaches. If I could create a new dream CMS I'd probably have the classic traditional WP editor but instead of short-codes, you'd be able to insert "special blocks" here and there (only for very specialized bespoke features where there'd be no other way to achieve it), but the majority of your content is still just paragraphs and headings etc... I don't know why, but even just h1 - h6 and paragraphs and lists feel clunky to work with in the block editor. Nothing about it feels fast, simple, intuitive, efficient or performant. Even after using the block editor for 5 years it still isn't a part of my muscle memory; it never feels like 2nd nature. ~Brad
@@LearnWebCode Thank you for your prompt, and encouraging, reply. I would like to be able to change some of the preset buttons in the text editor - I use regularly - so that's something I need to research. I wish you success with your courses.
Hi Brad. Thank you for this informative video. Currently I am doing your laravel course. It is really good. But i think It would be more awseome if you add a dedicated section for database where you would show advance topics such as indexing with examples and a section covering small API building project using laravel. I think every entry level laravel job asks for these requirements. Then i think this course will be more fulfilled.
Thanks for the great feedback. I really like your ideas of a DB specific chapter, as well as a decoupled API chapter. I've added those to my todo list for the Laravel course. Other items on that list are v11 updates, Livewire, basics and testing basics. I've been trying to get my WP course updated but Laravel is my next focus to invest heavily into again.
Same... NPM 10.7.0 , node v22.2.0, WP-6.5.3 running twenty twenty-four - block creates and scaffolds, plugin is activated, no sign of block in the editor
@@isheevaa - edit your package.json and set devedepencies "@wordpress/scripts" to "^27.9.0" instead of "^28.0.0" - run npm install - npm start - refresh and edit a page
Wow, big fan. Did your course Become a wp dev (not yet spend enough hours/10 hours). I would love it if you could go into how to go into creating interactive forms, maybe with a custom db table attached to it. Or if someone wants to buy a simple product, that involves a single page checkout (without registration but with the possibility to login later based on one’s e-mail and create a profile later). In any case many thanks for your channel!
You can absolutely register them within a theme. My line of thinking is this; if it's a project for a client where I'm building them a bespoke theme I'll just register the blocks in the theme. If I'm building a generic feature that I might reuse across multiple sites or if I'd share it with others then I'd build it as a plugin. A nice in-between option could be using the "must use" or "mu-plugins" folder.
Hi Brad, I am following your course on Udemy but I am not sure it isn’t reading my JSX. On the admin screen it says ‘This block has encountered an error and cannot be previewed.’ And when I use JSX in the save function, the editor screen goes blank. I have also asked this in the Q/A section on Udemy. Could you please check and guide me?
I think the problem with static (JS blocks) will be fixed with 6.6 and introduction of partially synched pattern. So you will be able to update the pattern in one place and the change will be reflected on all posts. I think the idea for static block si that they are saved and served as static HTML so there is less work on server. Although I doubt there is a big performance difference between the PHP and JS block with the same structure.
Good call; I'm very excited to see exactly how partial synced patterns work. Being able to update the pattern "template" in one place and have all the unique instances of it use those changes and be updated automatically without having to edit posts/pages would be great. I guess for me, if we're already needing to use PHP to query the database for the statically saved HTML string, how many more milliseconds, if any, does it take to use PHP to generate a dyanmic HTML string on the fly. It feels like throwing away one of the main benefits of SSR, and seeing how far out of the way people went to get that in the React / Next.js world, it feels weird for WordPress to essentially volunteer to get rid of something that other tech stacks are fighting to get. That's why I'm so excited for the Interactivity API, it's essentially WordPress admitting that developers want and need SSR (dynamic blocks).
Hi Brad, I am a non-developer. I have a need where I want to slightly modify the core "Post Title" block and create my own custom block. I have used ChatGPT to create the required function and append the main php file. However, I have downloaded the files for the core Post Block from the Gutenberg github. The files are differently named than what the wordpress/create-block created. As I am no developer, no clue how to go about duplicating the core Post-Title block with the modifications I want. Can you guide me how to go about doing this? Thanks.
Thank you Brad! hmmm....would you say this package is a substitute for your, github "brads-boilerplate-block-plugin"?. I mean does this let us code with React?
Great question, and one that I forgot to consider. You just gave me an idea for a video; assuming we use the "npx @wordpress/create-block --variant dynamic" command, what's the easiest way to actually use React on the public front-end? We'd still need to output the block's attributes into the DOM in JSON format for React to be able to use, but I have a feeling that would be easy to do in the render.php file that the boilerplate file gives us. I'll make a video about this! Having said all of that, I'd lean towards using the Interactivity API instead, because it gives us initial real HTML via SSR (like Next.js) which is great for SEO and accessibility.
Thanks for video. Can you explain how to create multiple blocks on a page that should store different information? For example, you have several quiz blocks on a page ... how to make their keys unique depending on how many blocks will be added to the page. *I don't know how many quiz blocks the user will create in the admin, but I need to somehow save the information that the user will send. How to do it?
You're welcome! I think what you're describing would be achieved with state instead of context on the public front-end Interactivity API. And on the admin / Gutenberg side I'd use the strategy I use in the "Featured Professor" block plugin chapter of my big WP course. That would let you see all instances of a block type on a page/post, keep count, have some global data etc...
@@LearnWebCode The question is that there are several of these blocks on the page. How can the answers be separated? Suppose the user creates a questionnaire on the page with two dynamic blocks: 'Name your favorite animal' and 'Name your favorite movie'. These are the same Gutenberg elements. How can the keys that will be written to the metadata be separated?
@@Black1991Star Each "Quiz" block type instance will have a "question" attribute. You could have as many "quiz" block type instances on the page as you want. Depending on what you're trying to create / achieve maybe you need all of the data to be in one instance of a block type, in which case you could have an array of strings saved in one attribute. Like we do for the "answers." You can check my code here github.com/LearnWebCode/interactivity-api-tutorial for this video ua-cam.com/video/49_XlQJYztA/v-deo.html
The problem with dynamic block is that the content of it like text is not visible in excerpt or search so statics blocks have their space - Great and simple example is custom paragraph / heading or quote block.
It is indeed next in my list for new courses, but I do still have a few WordPress, Laravel, and JavaScript course updates to make before I finish / launch Next.js.
I added it to my todo list when I saw your last comment; thanks for the good idea. I need to finish some speed tests so I make sure I'm not just passing on my own anecdotal experiences and that I've actually "measured" what is fastest. Should be a fun video, but probably won't be out for a while.
@@LearnWebCode Awesome! If possible, could you tackle a complex WooCommerce site in your video? Simple sites often speed up easier. It would be awesome if you could cover everything from the ground up, including caching, advanced image lazy loading, rewriting headers and footers with hardcoded CSS, server configuration, and removing unused CSS. Looking forward to it, and thanks for diving deep into this!
🤣 I think I had that to try and match an old recording from 8 years ago for a course lesson, and forgot to switch it back after recording. While I was editing this video my retina's were damaged by that background scheme haha
My recommendation for hosting your WordPress website is DreamHost and specifically their "Shared Unlimited" yearly plan (the exact plan I've used for 19 years). If you use my link to DreamHost it helps support my UA-cam channel and costs you nothing extra: click.dreamhost.com/aff_c?offer_id=109&aff_id=17231
I prefer to use the Classic Editor in text mode. I am still referring to your theme development tutorials from ten years ago so thank you for keeping them available online.
I still vastly prefer (personally) the classic text editor. I only learn / teach / use the block approaches because that's the direction WordPress is going and I feel responsible to help people learn the new approaches. If I could create a new dream CMS I'd probably have the classic traditional WP editor but instead of short-codes, you'd be able to insert "special blocks" here and there (only for very specialized bespoke features where there'd be no other way to achieve it), but the majority of your content is still just paragraphs and headings etc...
I don't know why, but even just h1 - h6 and paragraphs and lists feel clunky to work with in the block editor. Nothing about it feels fast, simple, intuitive, efficient or performant. Even after using the block editor for 5 years it still isn't a part of my muscle memory; it never feels like 2nd nature.
~Brad
@@LearnWebCode Thank you for your prompt, and encouraging, reply. I would like to be able to change some of the preset buttons in the text editor - I use regularly - so that's something I need to research.
I wish you success with your courses.
Hi Brad. Thank you for this informative video.
Currently I am doing your laravel course. It is really good. But i think It would be more awseome if you add a dedicated section for database where you would show advance topics such as indexing with examples and a section covering small API building project using laravel. I think every entry level laravel job asks for these requirements. Then i think this course will be more fulfilled.
Thanks for the great feedback. I really like your ideas of a DB specific chapter, as well as a decoupled API chapter. I've added those to my todo list for the Laravel course. Other items on that list are v11 updates, Livewire, basics and testing basics. I've been trying to get my WP course updated but Laravel is my next focus to invest heavily into again.
Hi Brad, I like this video approach. You tuned on camera and we can see you at the bottom right corner. Superb!!
Thank you so much! 🙏
@5:45 the front ends renders correctly but the content in the admin block doesn't for me. Is it supposed to?
Thanks for sharing Brad!!!
Hello, my block is not appearing in my Post add block
Same... NPM 10.7.0 , node v22.2.0, WP-6.5.3 running twenty twenty-four - block creates and scaffolds, plugin is activated, no sign of block in the editor
Same for me.
WP 6.5.3 + 2024 theme
NPM 10.7.0
Node 20.14.0
Re-started from scratch many times but blocks don't show up inside the editor
I was looking for this comment. I've been experiencing the same for days, I tried everything different environments, node versions etc.
Hi I have the same problem 🤔 I tried everything but the block is not shown in the editor.
@@isheevaa
- edit your package.json and set devedepencies "@wordpress/scripts" to "^27.9.0" instead of "^28.0.0"
- run npm install
- npm start
- refresh and edit a page
Wow, big fan. Did your course Become a wp dev (not yet spend enough hours/10 hours). I would love it if you could go into how to go into creating interactive forms, maybe with a custom db table attached to it. Or if someone wants to buy a simple product, that involves a single page checkout (without registration but with the possibility to login later based on one’s e-mail and create a profile later). In any case many thanks for your channel!
Thank you so much! I like the interactive forms idea; I've added that to my list!
Thanks fot the tutorial! Custom gutenberg blocks MUST be plugins or I can build them inside the Theme folder (old-school WP developer here)?
You can absolutely register them within a theme. My line of thinking is this; if it's a project for a client where I'm building them a bespoke theme I'll just register the blocks in the theme. If I'm building a generic feature that I might reuse across multiple sites or if I'd share it with others then I'd build it as a plugin. A nice in-between option could be using the "must use" or "mu-plugins" folder.
How do you add fields to these blocks so that a user can actually input some data into them?
Hi Brad,
I am following your course on Udemy but I am not sure it isn’t reading my JSX. On the admin screen it says ‘This block has encountered an error and cannot be previewed.’
And when I use JSX in the save function, the editor screen goes blank.
I have also asked this in the Q/A section on Udemy. Could you please check and guide me?
Truly good work!!!
I think the problem with static (JS blocks) will be fixed with 6.6 and introduction of partially synched pattern. So you will be able to update the pattern in one place and the change will be reflected on all posts. I think the idea for static block si that they are saved and served as static HTML so there is less work on server. Although I doubt there is a big performance difference between the PHP and JS block with the same structure.
Good call; I'm very excited to see exactly how partial synced patterns work. Being able to update the pattern "template" in one place and have all the unique instances of it use those changes and be updated automatically without having to edit posts/pages would be great. I guess for me, if we're already needing to use PHP to query the database for the statically saved HTML string, how many more milliseconds, if any, does it take to use PHP to generate a dyanmic HTML string on the fly. It feels like throwing away one of the main benefits of SSR, and seeing how far out of the way people went to get that in the React / Next.js world, it feels weird for WordPress to essentially volunteer to get rid of something that other tech stacks are fighting to get. That's why I'm so excited for the Interactivity API, it's essentially WordPress admitting that developers want and need SSR (dynamic blocks).
Hi Brad,
I am a non-developer. I have a need where I want to slightly modify the core "Post Title" block and create my own custom block. I have used ChatGPT to create the required function and append the main php file. However, I have downloaded the files for the core Post Block from the Gutenberg github. The files are differently named than what the wordpress/create-block created. As I am no developer, no clue how to go about duplicating the core Post-Title block with the modifications I want.
Can you guide me how to go about doing this?
Thanks.
Thank you Brad! hmmm....would you say this package is a substitute for your, github "brads-boilerplate-block-plugin"?. I mean does this let us code with React?
Great question, and one that I forgot to consider. You just gave me an idea for a video; assuming we use the "npx @wordpress/create-block --variant dynamic" command, what's the easiest way to actually use React on the public front-end? We'd still need to output the block's attributes into the DOM in JSON format for React to be able to use, but I have a feeling that would be easy to do in the render.php file that the boilerplate file gives us. I'll make a video about this! Having said all of that, I'd lean towards using the Interactivity API instead, because it gives us initial real HTML via SSR (like Next.js) which is great for SEO and accessibility.
@@LearnWebCode , that would be a great video. That's something I havne't seen on youTube yet. :) Thanks Brad
Thanks for video. Can you explain how to create multiple blocks on a page that should store different information? For example, you have several quiz blocks on a page ... how to make their keys unique depending on how many blocks will be added to the page. *I don't know how many quiz blocks the user will create in the admin, but I need to somehow save the information that the user will send. How to do it?
You're welcome! I think what you're describing would be achieved with state instead of context on the public front-end Interactivity API. And on the admin / Gutenberg side I'd use the strategy I use in the "Featured Professor" block plugin chapter of my big WP course. That would let you see all instances of a block type on a page/post, keep count, have some global data etc...
@@LearnWebCode The question is that there are several of these blocks on the page. How can the answers be separated? Suppose the user creates a questionnaire on the page with two dynamic blocks: 'Name your favorite animal' and 'Name your favorite movie'. These are the same Gutenberg elements. How can the keys that will be written to the metadata be separated?
@@Black1991Star Each "Quiz" block type instance will have a "question" attribute. You could have as many "quiz" block type instances on the page as you want. Depending on what you're trying to create / achieve maybe you need all of the data to be in one instance of a block type, in which case you could have an array of strings saved in one attribute. Like we do for the "answers." You can check my code here github.com/LearnWebCode/interactivity-api-tutorial for this video ua-cam.com/video/49_XlQJYztA/v-deo.html
The problem with dynamic block is that the content of it like text is not visible in excerpt or search so statics blocks have their space - Great and simple example is custom paragraph / heading or quote block.
Brad, Is the Next.js course in your list? Please reply...
It is indeed next in my list for new courses, but I do still have a few WordPress, Laravel, and JavaScript course updates to make before I finish / launch Next.js.
@@LearnWebCode thank you so much 🙏
Still waiting for your WordPress Speed Optimization & Core Web Vitals tutorial😠😭
I added it to my todo list when I saw your last comment; thanks for the good idea. I need to finish some speed tests so I make sure I'm not just passing on my own anecdotal experiences and that I've actually "measured" what is fastest. Should be a fun video, but probably won't be out for a while.
@@LearnWebCode Awesome! If possible, could you tackle a complex WooCommerce site in your video? Simple sites often speed up easier. It would be awesome if you could cover everything from the ground up, including caching, advanced image lazy loading, rewriting headers and footers with hardcoded CSS, server configuration, and removing unused CSS. Looking forward to it, and thanks for diving deep into this!
put the camera on top of monitor, would be much better.
Thanks, I'm trying that for the next one I film.
First🤩
white background?!!! unsubscribing
🤣 I think I had that to try and match an old recording from 8 years ago for a course lesson, and forgot to switch it back after recording. While I was editing this video my retina's were damaged by that background scheme haha
@@LearnWebCode 😅