Support » Plugin: Block Lab » Nested blocks / custom HTML

  • Resolved blockathon

    (@blockathon)


    Some of the core Gutenberg blocks allow nesting other blocks within them, like layout

    Would it be possible to do this in Block Lab maybe by having a ‘Custom HTML’ field type that functions like the core Gutenberg one?

    Ultimately if one could add custom blocks they’ve made or core Gutenberg ones, within others blocks they’re making that would open up a whole bunch of possibilities.

    For e.g. I’ve made a slightly enhanced accordion block with a badge in the heading. The template file’s contents look like this, look at the comment in the accordion text:

    <div class="panel panel-default">
     
        <h5 class="panel-heading">
            <a class="" role="button" data-toggle="collapse" href="#<?php block_field( 'id' ); ?>" aria-expanded="true" aria-controls="collapse-3">
                <?php block_field( 'title' ); ?> 
                <span class="badge pull-right"><?php block_field( 'badge' ); ?></span>
            </a>
        </h5>
    
          <div id="<?php block_field( 'id' ); ?>" class="collapse in" aria-expanded="true" style="">
            <p class="panel-body">
            <?php block_field( 'content-text' ); ?> 
            <!-- this is a textarea field type -->
            <!-- In editing mode could we click into it and have a '+' to add another custom block like gutenberg does? -->
            </p>
          </div>
    
    </div>

    In your recent blog post you’ve achieved something similar with gravity forms by using

    gravity_form( $form_id , false, false, false, '', true, 12 );

    in the template and referencing the form ID, this was possible because gravity form allows embedding by calling a PHP function and also it feels kind of hardcoding one instance of the form block into our custom block.

    Would it be possible to have a field type that allows this in Block Lab?

    • This topic was modified 1 year, 3 months ago by blockathon. Reason: more details
    • This topic was modified 1 year, 3 months ago by blockathon. Reason: blog example
    • This topic was modified 1 year, 3 months ago by blockathon.
Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author stino11

    (@stino11)

    Hey @blockathon

    Nesting blocks, both within the Block builder experience and the actual editor experience, is something that a few people have asked for, or at least talked about. It’s on our radar, but not something we’ve started solution yet. We’ll eventually get to looking at it, but may not be for a little while yet.

    For your accordion example, are you talking more about having a _repeater_ style field? If so, this is something we’ll be looking at much sooner.

    Cheers

    I think this would be fantastic! In example, a section block with a background image, padding settings etc. Inside this section block will reside the actual blocks.

    So the structure would be something like this:

    [section_block]
    [block1][block2][block3]
    [/section_block]

    Does this make sense? I’d purchase the yearly access for this 🙂

    You could always just use a 1 column Gutenberg “Columns” block for now and manually assign it a class in the “Advanced” settings. And just make your accordion block a single block (I.e 1 block per toggle/panel not a repeater) and use Gutenberg to add as many accordion blocks as you need.

    • This reply was modified 1 year, 2 months ago by .

    Hi @takeok I see what you’re saying, it still doesn’t do a nesting of blocks and to do the 1 column gutenberg blocks, with more blocks inside for doing the badge like I have above just feels clunky.

    Nesting of blocks would be very cool

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Nested blocks / custom HTML’ is closed to new replies.