Can we make reusable gutenberg blocks in Pinegrow WP?

Pinegrow WP
1

Is it possible to create reusable blocks for gutenberg directly from Pinegrow?

2

Never mind, I bought ACF pro which includes the new ACF blocks framework for making gutenberg blocks with PHP. It integrates perfectly with Pinegrow. I highly recommend it!

3

yes, there is a video.

4

Could you perhaps link to it? Because I can’t find it anywhere.

5

That’s odd cause I googled “pinegrow blocks wordpress” and used youtube to search:

6

There is a guy on this forum that makes and sells blocks… I bumped his thread a little while back.

I cannot recommend him more! I know for a fact that he can get you up and running.

Here is the bump:

7

This is not what I’m looking for. I know this video but this is about bootstrap blocks, not wordpress gutenberg blocks. Thanks anyway though.

8

Hello Roel, I would like to do the same, add ACF block.
Can you explain me how to have it integrated perfectly in Pinegrow?
How do you specify the path for the file of the render_template for example?
Thank you in advance

9

It is a little tricky but once you got the procedure memorized it’s fairly easy.

Step one is to create a new html file. Technically it doesn’t really matter where you create it but the best approach in my opinion is to put it in the same directory that the block will exported to, this one: template-parts/blocks/block-name.

Step 2 is to define a tempalte part on the element that will become the block (which can be a div, a section etc…) and set the html file itself to not export (so only the template part will export). In the define template part action you can specify the directory but if the html file is already in that directory, just the filename will do. Defining a template part is necessary because just saving the file and exporting it as a PHP file will mess up the block since the head and body tags will still be in there. When you’ve done that you just have to build the block the same way as you would build any webpage and use any pinegrow action inside of it (like for instance a post loop). You can also add ACF fields (you don’t need them for the block to work but when you’re using ACF blocks I assume you would want to use them in some way) which is done by simply using the supported ACF field action (for more complex ACF functions the ACF field action is not sufficient. WIth that I mean repeaters and flexible content. It is fixable by using the PHP code action and adding the necessary PHP code manually. It is a little more tricky but possible.

Apart from that, the block needs to be registered in the functions.php file. There is no way to do this through pinegrow, so you’ll have to do that manually. It is very easy to do though. Just copy and past the following code into the function.php file (best accessed through the project folder of the pinegrow project instead of the actual file in the wordpress installation), right below the comment /* Pinegrow generated Include Resources End */ :

add_action('acf/init', 'my_acf_blocks_init');

function my_acf_blocks_init() {

// Check function exists.
if( function_exists('acf_register_block_type') ) {

    // Register a block.
    acf_register_block_type(array(
        'name'              => 'block-name',
        'title'             => __('block-title'),
        'description'       => __('An ACF block'),
        'render_template'   => 'template-parts/blocks/block-name/block.php',
        'category'          => 'Formatting',
));
    }
}

You can find additional information here: https://www.advancedcustomfields.com/resources/blocks/

If you have any other questions, let me know.

3 Likes
10

Well, I have never needed to, nor know how to do this sort of thing, but what a well composed response! It seems excellent and I would be happy to (blindly) follow these sorts of instructions!
Cheers for helping out around here @Roel

1 Like
11

My pleasure :slight_smile:

12

@Roel Thanks for posting this info :raised_hands::raised_hands: I’ve been meaning to dive into making Gutenberg Blocks to transition my client sites away from using Elementor and into something less dependent on paid plugins so this will be a good start on that path. Much appreciated :+1::+1:

1 Like
13

Well, apparently my reply was the inspiration for a new feature in Pinegrow :slight_smile:

2 Likes