WordPress 6.6 is changing the game for Custom Fields

Подписаться 2,3 тыс.

Просмотров 8 тыс.

50% 1

WordPress is bringing Custom Fields to blocks. The Block Bindings API is going to change the way we code for postmeta, and WordPress 6.6 is our first glimpse.
👉 All the code: github.com/bac...
🚨 Free Video Series: 7 Tools for Modern WordPress Development 🚨
👉 briancoords.co...
00:00:00 Intro to Block Bindings
00:00:53 Custom Fields and CPTs in 6.6
00:02:14 Post Title Block and Synced Data
00:03:09 Template Preview Mode
00:05:56 Code for Custom Fields
00:08:40 Showing Post Meta in the Block Editor
00:09:31 Next Steps

Развлечения

Опубликовано:

15 авг 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 51

@elliottrichmondwp Месяц назад

Thanks, Brian, this is great. I got super excited about the Block Bindings API in 6.5 as there is finally a logical link to using meta in templates. This is one step closer to what many developers have been wanting to see in block editor development. It's going to be interesting to see how the roadmap develops, especially for more complex data such as conditional statements and loops. I'm not sure how feasible that will be in 6.6, I probably need to revisit it to see how possible it is for things like repeating fields but it's definitely going in the right direction 👏

@BrianCoords Месяц назад

Agreed - it's also great when combined with query loops- developers can lean into custom post types, custom taxonomies, and custom fields and then use that to create repeater-like experiences all with core functionality.

@jzajzz Месяц назад

We need WordPress to basically add ACF to Core..and also a quick way to bulk edit them. in other words they need to focus on the CMS.

@BrianCoords Месяц назад

ACF might be overkill for core - it's good plugin territory. But a UI for managing CPTs and basic Custom Fields from inside core would be amazing.

@jeremyrangel8138 Месяц назад

Honestly, there also needs to be a way to store data for CPTs in their own respective tables. The way that WP stores data is not very scaleable.

@Lukasz-online 24 дня назад

That's cool - being able to add the template blocks in the cpt.

@BrianCoords 17 дней назад

Yeah I'm hopeful it's a feature that will get more attention one day.

@montyksycki4092 2 дня назад

Thank You for sharing!!! :)

@Andy-bris Месяц назад

This is some great new features -- thanks for the explanation, excited about trying this out, as I am a huge fan of CPTs.

@BrianCoords Месяц назад

Nice! Some powerful stuff on the way

@Andy-bris Месяц назад

@@BrianCoords Sweet, thanks Brain -- looking forward to it. =]

@kjroelke7236 5 дней назад

I don’t know if this is covered in a different video, but the way you registered your sidebar is totally different from how I would’ve gone about it! I would love to see you talk through your code choices and where to learn more about it! I’ve never even the `registerPlugin` function before 😅

@BrianCoords 3 дня назад

So I have some demo code for how I do it, but I guess I haven't made a video about it yet! I'll add it to my list. github.com/bacoords/example-post-settings-field

@TheBeeOBee Месяц назад

Great demo! Very thankful that you share these.

@BrianCoords Месяц назад

Thanks!

@wpmarkuk Месяц назад

Great video - thanks for sharing. I can see lots of use cases for this.

@BrianCoords Месяц назад

Agreed- and I bet ACF's going to support this as soon as possible, too. They've been working on Block Bindings as well.

@BrendanOConnellWP Месяц назад

You're on a roll! Good one. 6.6 has so much!

@BrianCoords Месяц назад

Yep. I'm hoping to record some thoughts on some of the new features for block styles this week as well.

@MD_jadaan 29 дней назад

Hi, it would be nice to make video about how to build that all code and what is possible examples to use it Thank for the high quality content you provide ! ... ... KEEP GOING !! love ya

@visualmodo Месяц назад

Very good content!!!

@masterng56 28 дней назад

Thanks, Brian, I need a code

@sb_1389 16 дней назад

This is super helpful; I'm trying to go through your walkthrough and implement for my use case. I really want to be able to add the custom field into the sidebar like you have, as they really get buried in the regular view and it's just not intuitive. My issue is that I want to use a text area, instead of a textbox. I've been trying to use the dev resources but it's not really working out (I'm not technically a developer). Any pointers you can offer?

@BrianCoords 15 дней назад

You can check out the WordPress component storybook for examples of all the different types of input fields they offer. Here's one called TextareaControl which should work for you: wordpress.github.io/gutenberg/?path=/docs/components-textareacontrol--docs

@aishanstha Месяц назад

I m following your video your previous videos and have setup multiple blocks. Is there a way to use the same package to bundle the index.js from src folder if it have No block.json file ?

@BrianCoords Месяц назад

Yes! You need to extend your webpack.config file. Here's an example from one of my repositories where I've added additional entrypoints into the build process: github.com/bacoords/block-pattern-plugin/blob/main/webpack.config.js

@aishanstha Месяц назад

@@BrianCoords it works :) Thanks alot

@filippotinnirello Месяц назад

How did you get the Vs code primary sidebar to the top left?

@BrianCoords Месяц назад

I think you can right click it and change the "Activity Bar Position" to "top"

@aishanstha Месяц назад

Does version 6.6 of the latest WordPress block theme (Full Site Editing) compile all block CSS into one file? Concerned about potential impacts on load times and optimization if multiple inline CSS styles are used. Please share your thoughts. Thanks

@BrianCoords Месяц назад

All block CSS is combined, but if a block is not present on that page, the block's CSS isn't loaded. But for blocks that are used pretty regularly or might show up on every page (group, navigation, columns, button) you'll can often expect that CSS to be loaded globally,

@aishanstha Месяц назад

@@BrianCoords thanks again for reply in this as well. Is this inline a new trend in web development. Previously, adding inline is treated as a bad practice and can cause unexpectedly styling behaviors and make it more difficult to debug or modify styles. Also and if we need to change some behavior then we need to explicitly add '!important ;' to override the default styling.. What your take onto this? or is there a way to bundle atleast all our custom block styles and Js into one main file ? Thanks

@BrianCoords Месяц назад

I don't mind the inline style tags, but when they put style attributes directly on an element it's annoying. That said, it should only ever be done when you've added that style to a block in the editor, in which case it sort of makes sense. There is a filter to turn that off and get your CSS/JS as one file. The downside is that the inline styles are actually helpful for page speed scores because it can render the top of the page without waiting for everything to load.

@FlorentClaude Месяц назад

Great stuff thanks! Would you have the code that sets a synched pattern as the default book block?

@BrianCoords Месяц назад

So the 'template' argument on register_post_type takes an array of blocks. You can pass it a pattern block or a synced pattern block. I'll just note that I did have some issues with a synced pattern block working correctly like this (especially when combining it with blocks that had bindings) gist.github.com/bacoords/4711fc205898e701eaba36137d71d476

@knightofrohan Месяц назад

At the risk of repeating something you already mentioned, just so that I can be sure I am understanding correctly, in order to make the custom meta fields and display them in the template, you use PHP, but then to show them in the block editor sidebar, you have to re-define the fields in JS? There is no shortcut to just display the previously defined fields in the block editor?

@BrianCoords Месяц назад

Nope, but that's the way WordPress core has always been. You can register a "metabox" but you've always had to write the actual HTML of it yourself. This is actually a step forward because in classic WordPress you had to write the logic to save the postmeta fields as well.

@thebilalafsar Месяц назад

Hello Brian! Could you please tell guide me, I have WooCommerce site built with Elementor page builder and Hello Elementor theme. I have almost 50 active plugins. I want to reduce the plugins drastically from our site btw 10-20. I also want to completely remove Elementor from the site. What method would you suggest? Should I go with custom code or any alternative solution?

@BrianCoords Месяц назад

It's definitely hard to make a recommendation without knowing your specific site. A lot of Woo sites just need a lot of plugins. If you can, make a staging copy of your site and play around with using the TT4 theme and see how close you can get to Elementor.

@simonemaranzana400 Месяц назад

I don’t know if it’s just me, but I see the subtitles from the previous video

@brickslabel Месяц назад

Me too; the transcript as well shows from previous

@BrianCoords Месяц назад

Thanks for the heads up! This is fixed.

@onelook1870 Месяц назад

Creating plugin admin page use react can it be done?

@BrianCoords Месяц назад

Yes! Here's a demo repo, I just haven't gotten around to making the video yet: github.com/bacoords/example-wp-settings

@onelook1870 Месяц назад

@@BrianCoords Thanks will check it out.

@thewebstylist 22 дня назад

Lawd there’s 100 things WP has needed to level up for yearssss SERIOUSLY why are improvements so few and far between

@BrianCoords 17 дней назад

Every release has a ton of improvements, especially outside of GB in things like performance and security. But agree - I think we all would like to see some faster development/iteration.

@SiteStudio Месяц назад

I don't like the fields in the sidebar. It's too small. Would like to see an experience that has more real estate.

@BrianCoords Месяц назад

Yeah agreed, but I also really don't like the old drawer at the bottom of the block editor. There's some new UI coming that'll be a separate screen for this type of stuff, but I would love to be able to swap out the main canvas the way you can for "Code Editor" mode - like a way to jump into "Data Editor" mode that just shows custom fields, title, etc.

@SiteStudio Месяц назад

@@BrianCoords Yeah, definitely not at the bottom. I'm a fan of the ACF Blocks approach with the In-Page field editing experience where you can toggle between the view and the meta fields.

@BrianCoords Месяц назад

Yep - I'd love that to be the case for the entire content area, ability to toggle between 'content' view and 'data' view where I could edit meta info, title, category, etc with much more space.