search

WordPress / Learn

WordPress.org Learn - The canonical source for the code and content behind https://learn.WordPress.org
260 stars 89 forks source link

Block Variations #2277

Closed cynthianorman closed 1 month ago

cynthianorman commented 6 months ago

Details

Learning Objectives

The learning objectives are to:

Relevant Links

github-actions[bot] commented 5 months ago

Lesson Development Checklist

cynthianorman commented 3 months ago

@jonathanbossenger or someone who is available to assist, I have a summary for the description of a block variation. Could you please confirm its accuracy before I create the video.

jonathanbossenger commented 3 months ago

@cynthianorman, I'm going to reply with the same numbered points you have used to help with clarity

  1. Huh, yes, I never really thought about it this way, but calling it an alternative block also applies. Essentially, it's creating an alternative to the block on which it's based.
  2. Could you confirm what you mean here? A block variation does have an attributes object that can override the attributes of the block it's based on, so it seems to me that it is possible to create a variation that doesn't use a specific attribute from the original.
  3. This gives me pause to ponder. If it were me, I'd showcase a variation that uses both a build process and without, but that's mostly because I know there is a build process lesson later on in this course. So yes, I'd agree to go with code that doesn't need a build step. If we decide to update the lesson later on with "buildable" code, we can do so.
  4. Oh, I was not aware of this. In that case, the concept of must-use plugins has yet to be introduced. So maybe it's better to mention that, as you've pointed out, you can't use variations in themes hosted in the theme directory. If you are building a theme for the directory, you'd have to include the variation via a plugin that your users would install separately. This lesson could include a link to the introduction to plugins in the beginner learning pathway.

Lastly, if you need any help with testing code examples or reviewing things before you hit record, please do let me know. This does border on the block developer side of knowledge, which I do know you are learning 😁

cynthianorman commented 2 months ago

@jonathanbossenger thank you so much for your feedback

  1. Could you confirm what you mean here? A block variation does have an attributes object that can override the attributes of the block it's based on, so it seems to me that it is possible to create a variation that doesn't use a specific attribute from the original.

This is what I got from the Hallway Hangout at 7:11

Also, in this blog post, the definition of attributes implies to me that we can't add new attributes.

  1. This gives me pause to ponder. If it were me, I'd showcase a variation that uses both a build process and without, but that's mostly because I know there is a build process lesson later on in this course. So yes, I'd agree to go with code that doesn't need a build step. If we decide to update the lesson later on with "buildable" code, we can do so.

This is what I got from the Hallway Hangout at 10:39

Nick speaks about building a block variation which doesn't require a build process

  1. Oh, I was not aware of this. In that case, the concept of must-use plugins has yet to be introduced. So maybe it's better to mention that, as you've pointed out, you can't use variations in themes hosted in the theme directory. If you are building a theme for the directory, you'd have to include the variation via a plugin that your users would install separately. This lesson could include a link to the introduction to plugins in the beginner learning pathway.

This is what I got from the Hallway Hangout at 15:55 You don't have to place a variation in a plugin, this was Nick's suggestion IF you were developing a theme that wasn't going to be submitted to the WP theme directory.

Lastly, if you need any help with testing code examples or reviewing things before you hit record, please do let me know. This does border on the block developer side of knowledge, which I do know you are learning 😁

Ok, awesome

My revised definition (so far unless you have anything else to add @jonathanbossenger):

  1. A block variation is an alternative block you can add to your theme using the Block Variations API
  2. You would use the attributes already assigned to the block you are creating a variation from
  3. You wouldn’t require a build process as you can choose to enqueue your custom JavaScript file from functions.php along with passing through a few dependencies
  4. You can choose to place your block variation within a plugin or within your theme files
jonathanbossenger commented 2 months ago

@cynthianorman that all looks great!

cynthianorman commented 1 month ago

https://youtu.be/7lKc-fYM_vU

This Intermediate Theme Developer Learning Pathway Lesson is ready to be reviewed. Please follow the steps listed under Guidelines for reviewing content. Thank you for your contribution! ✨

cynthianorman commented 1 month ago

https://youtu.be/7lKc-fYM_vU

This Intermediate Theme Developer Learning Pathway Lesson is ready to be reviewed. Please follow the steps listed under Guidelines for reviewing content. Thank you for your contribution! ✨

jonathanbossenger commented 1 month ago

https://youtu.be/Su5EIT-c_S4

cynthianorman commented 1 month ago

@jonathanbossenger

YouTube chapters

(0:05) Learning objectives (0:23) Describe block variations (1:27) Differentiate between block variations and block styles (2:46) Add the JavaScript file to your theme (3:02) Register a block variation. (3:38) Next steps

cynthianorman commented 1 month ago

//publish