Support

Account

Home Forums General Issues Restricted-InnerBlocks example: content doesn\'t display

Solving

Restricted-InnerBlocks example: content doesn\'t display

  • Hey guys.
    I wanted to understand the new beta features, the innerblocks. So I copied the Code from here:

    https://www.advancedcustomfields.com/blog/acf-5-9-exciting-new-features/

    but nothing is working.

    function.php
    require get_template_directory() . ‘/enqueue/enqueue_blocks.php’;

    enqueue_blocks.php

    <?php
    
    /*Test*/
    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 restricted block.
            acf_register_block_type(array(
                'name'				=> 'restricted',
                'title'				=> 'Restricted',
                'description'		=> 'A restricted content block.',
                'category'			=> 'formatting',
                'mode'				=> 'preview',
                'supports'			=> array(
                    '__experimental_jsx' => true
                ),
                'render_template' => get_template_directory_uri() . '/template-parts/blocks/restricted/restricted.php',
                'enqueue_style' => get_template_directory_uri() . '/template-parts/blocks/restricted/restricted.css'
            ));
        }
    }

    restricted.php

    <?php
    /**
     * Restricted Block Template.
     *
     * @param   array $block The block settings and attributes.
     * @param   string $content The block inner HTML (empty).
     * @param   bool $is_preview True during AJAX preview.
     * @param   (int|string) $post_id The post ID this block is saved to.
     */
    
    // Create class attribute allowing for custom "className" and "align" values.
    $classes = '';
    if( !empty($block['className']) ) {
        $classes .= sprintf( ' %s', $block['className'] );
    }
    if( !empty($block['align']) ) {
        $classes .= sprintf( ' align%s', $block['align'] );
    }
    
    // Load custom field values.
    $start_date = get_field('start_date');
    $end_date = get_field('end_date');
    
    // Restrict block output (front-end only).
    if( !$is_preview ) {
        $now = time();
        if( $start_date && strtotime($start_date) > $now ) {
            echo sprintf( 'Content restricted until %s. Please check back later.
    ', $start_date );
            return;
        }
        if( $end_date && strtotime($end_date) < $now ) {
            echo sprintf( 'Content expired on %s.
    ', $end_date );
            return;
        }
    }
    
    // Define notification message shown when editing.
    if( $start_date && $end_date ) {
        $notification = sprintf( 'Content visible from %s until %s.', $start_date, $end_date );
    } elseif( $start_date ) {
        $notification = sprintf( 'Content visible from %s.', $start_date );
    } elseif( $end_date ) {
        $notification = sprintf( 'Content visible until %s.', $end_date );
    } else {
        $notification = 'Content unrestricted.';
    }
    ?>
    <?php echo var_dump($start_date);?>
    
    <div class="restricted-block <?php echo esc_attr($classes); ?>">
        Test
    
        <span class="restricted-block-notification"><?php echo esc_html( $notification ); ?></span>
        <InnerBlocks  />
    </div>

    restricted.css

    .restricted-block{
        padding: 15px;
        background-color: #0c5460;
        border: 12px solid #20c997;
    }
    
    .restricted-block-notification
    {
        background-color: #43494e;
        padding: 5px;
        float: left;
        color: white;
    }

    I checked the Path – as I saw, the restricted.css file is loading. (network analysis, 304) Also the Data-Blocks is showing up on the right side.

    But the var-dump doesnt show anything and even when I messed up the .php, there doesn’t come a fatal error. But the Path is the Same as the CSS.

    I also made sure, that I downloaded the beta-version.

    so… what i am doing wrong?

    • NickDA

    • August 2, 2020 at 1:27 pm

    Did you create a Field Group with the start_date and end_date fields?

    • Essk

    • August 9, 2020 at 12:03 am

    I’m having this problem too, both with the copied example code (I have created the associated fields and supplied them with values) and also with a simplified block that should only show an <InnerBlocks /> component.

    The block insertion area isn’t showing up in the editor and when I inspect where it should be, I see
    <innerblocks></innerblocks>
    Custom blocks created from scratch substitute a bunch of markup in there so it’s almost as if the '__experimental_jsx' => true setting isn’t doing anything. Not sure what I’ve missed. Help?

    • NickDA

    • August 9, 2020 at 2:39 am

    This is from experience… If you did everything that you were supposed to and you get some results you can’t explain, especially right after updating WP, themes, or plugins, clear the cache, to get rid of the locally stored CSS and especially any js files, and get the new ones. In chrome you can do so very easily with Ctrl + F5… It happens to me almost every time I update ACF, or Gutenberg.

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

We use cookies to offer you a better browsing experience, analyze site traffic and personalize content. Read about how we use cookies and how you can control them in our Cookie Policy. If you continue to use this site, you consent to our use of cookies.