[Resolved] Use Generate Elements as layout

[Chris]

Hey,

I am building an ACF block. For the layout of that block, I’d like to use a GeneratePress Element: Block to determine what layout I have. Then I can edit it visually.

Is there documentation on doing this? If not, how could I set my layout to pull in the block?

[Leo]

Hi Chris,

I’m not exactly sure what you are trying to do here or if it’s possible.

Can you explain a bit more?

[Chris]

I’d like to create an element Block. I’d add dynamic heading fields to it. Make it look pretty.

Then, I’ll choose this as a hook location. I want to use a custom hook for my ACF block layout.

How do get this block element to work with my ACF layout?

Does this make sense or should I whip up some diagrams?

[Elvin]

Hi Chris,

I believe you’re trying to make a “template” that takes in ACF values AND THEN hook it into a part of the page?

If this is the case, I think that’s possible.

This requires GenerateBlocks (for dynamic headline block).

Steps to do:
– Create a Block Element
– Set its Hook.
– Set its Display rule location.
– Create your layout. (Use GB Headline block for dynamic values)
– On the GB Headline block’s dynamic value, set the dynamic value – https://share.getcloudapp.com/yAuyE2l9
– – (Post meta for single post pages, Term meta for taxonomy archive pages)
– Save it.

But I’m not exactly sure I understood what you mean by ” I want to use a custom hook for my ACF block layout.”.

If you want to add a custom hook within the Block Element as well but you’ll have to use a PHP snippet for it.

See my suggestion here for setting portable hooks – https://generatepress.com/forums/topic/inserting-custom-php-html-into-gutenberg-or-site-container/#post-1713422

[Chris]

I’m talking about this, see #3: https://www.advancedcustomfields.com/blog/acf-5-8-introducing-acf-blocks-for-gutenberg/

Render the block. I want to set the layout by using a GP Element. Would the portable hook work for this? Or how would I tell my PHP template to render using the Block element?

[Elvin]

Ah I see.

I think it’s pretty straight-forward.

I believe you just need to create the ACF blocks as instructed by ACF’s documentation and you’re already set.

The blocks you create should automatically appear on the Gutenberg Block list when you’re editing a Block Element’s layout.

As for the layout of the block element itself, it’s really up to you.

Now if the question is for Block Element types, here are the documentations for the Block element types.
https://docs.generatepress.com/article/block-element-archive-navigation/
https://docs.generatepress.com/article/block-element-post-navigation/
https://docs.generatepress.com/article/block-element-post-meta-template/
https://docs.generatepress.com/article/block-element-page-hero/
https://docs.generatepress.com/article/block-element-content-template/

and Leo also uploads demo videos on our GeneratePress YouTube channel from time to time
https://www.youtube.com/channel/UCoHk-JZFs1N-iI2DQlIKVnA

[Chris]

Getting closer.

Now, how to set the design/layout in the Block Element Content Template video to the ACF render?

The ACF render isn’t a content area. I may put my ACF block on the middle of a page. But I don’t see a way to apply the design/layout to my ACF block.

I know you said to follow the instructions ACF gives, but I don’t want to – I want to build the render template visually in block editor. I am asking how to do so with a block element.

[Chris]

The ACF block render can use a call back function. Is there a way to call the block element so it will render the design for my block?

[David]

Hi there,

couple of things:

1. The Block Element Content Templates can only be hooked into the theme templates, NOT displayed in the post content.
2. Dynamic Data in a Block Element requires the ‘data’ to be stored in the post_meta tables. But ACF Blocks save them in the content which is inaccessible via post_meta. Another of our users provided an ACF related snippet for storing its data in the post_meta here:

https://generatepress.com/forums/topic/custom-field-in-archive-element/page/2/#post-1940622

If you apply #2 which requires custom development, although if you understand ACF it should be pretty simple to convert the snippet to your needs, and then use the Block Element to hook into your content you should be able display your content using block elements

[Chris]

That was super helpful, David.

I think I got it now.

[Chris]

Lastly, can you point me to the documentation on using the block element as my custom layout>

[David]

Glad to hear that.
Heres a list of the Block Element docs:

https://docs.generatepress.com/?s=block+element

All of the ones with a postfix eg. – Page Hero show how Dynamic Data works.

[Author]

Posts