Custom Sources with the WordPress Block Bindings API (yes, you can)

[@alvarogois]

Great video. Thank you for showing some basic usage of this powerful feature. Just in time for a project I'm working, now I definitely have to try it!

[@perezcarreno]

Thank you, Alvaro! I'm glad it helped! I find myself reaching for it more and more.

[@jenniferp4137]

In your final example at the end you return a string with html markup. I'm doing the same thing with a custom binding source callback but the output is not rendered as an element in the browser and it shows the markup and text. Has this been your experience as well? We have a number of fields that contain html markup so having this work would be wonderful. Otherwise, we'll be back to custom blocks and variations, sadly.

[@jastos]

Really interesting. How would this work with a block with context? For instance, I need a button inside of a query loop to link to the post url of the post. If I register_block_bindings_source, what would my $post object be? Can I get the individual values for the post inside of the query loop?

[@perezcarreno]

That's a great question! The context will be whatever the loop is at the moment. Let's say you have a query loop, and you have a 'likes' block binding for instance. The 'likes' that appear will be for the each post within the query loop.

[@jastos]

@@perezcarreno Yes, this worked well for binding the post url to a button in the query block. I've found it annoying in the past that I couldn't use a button in the query block that linked to the post. I had to manually style the "Read More" link to look like a button. The next thing I want to figure out, is a good way to hide the block if the binding source is empty or returns a certain value. With a button, I can target an empty href, but how do you hide a if the binding is empty?

[@perezcarreno]

@@jastos return an empty string in the block binding if you want it to disappear. Returning null shows the fallback text instead.

[@jastos]

@@perezcarreno Thanks again! It looks like for the button block, the text attribute determines whether the block is visible or not. So to bind the url, you need to bind the url & text. Looking forward to more development on this!

[@lachieyoung1374]

Feels like shortcodes with extra steps lol

[@perezcarreno]

Similar in the sense that you can write code to output content, but more powerful within the context of blocks because you can use all the native block settings in core blocks, while pulling in custom data.