• Resolved Darrin

    (@darringoodman)


    Hi, one of our users contacted me to ask for help with a page she was working on. Only the first tab was being displayed, and the other tabs were showing up as headings within the body of the text.

    This is a large WP Multisite network of websites, and uses the block editor. She had used the shortcode block to add each of the [tabby title=””] sortcodes as well as the [tabbyending] shortcode.

    I activated the Classic Editor plugin and removed all references to beginning/ending block code, and it restored proper Tabby Tabs functionality. I was not able to make it work with the block editor code.

    Here is an example of the code:

    <!-- wp:shortcode -->
    <p>[tabby title="Overview"]</p>
    <!-- /wp:shortcode -->
    
    <!-- wp:paragraph -->
    <p>Page content information goes here....</p>
    <!-- /wp:paragraph -->
    
    <!-- wp:heading -->
    <h2 id="h-contact-the-agent">Contact the Agent</h2>
    <!-- /wp:heading -->
    
    <!-- wp:group -->
    <div class="wp-block-group"><!-- wp:heading {"level":4} -->
    <h4>Name, Title</h4>
    <!-- /wp:heading -->
    
    <!-- wp:paragraph -->
    <p><em>Email: </em></p>
    <!-- /wp:paragraph -->
    
    <!-- wp:paragraph -->
    <p><em>Phone:</em></p>
    <!-- /wp:paragraph -->
    
    <!-- wp:shortcode --> [tabby title="Upcoming Events"] <!-- /wp:shortcode -->
    
    <!-- wp:paragraph -->
    <p>Information about event goes here...</p>
    <!-- /wp:paragraph -->
    
    <!-- wp:shortcode --> [tabbyending] <!-- /wp:shortcode --></div>
    <!-- /wp:group -->

    Once I removed the beginning/ending references to blocks, the tabs worked fine. I was wondering if there is currently a better way to use Tabby Tabs with the block editor, or if it is only compatible with the Classic Editor?

    Thanks!

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author cubecolour

    (@numeeja)

    The plugin has been working with no issues on the sites I have tested it on using the block editor with the [tabby] & [tabbyending] shortcodes in shortcode blocks.

    Thank you for including your code listing I have noticed a couple of things that might be relevant:

    <!-- wp:shortcode -->
    <p>[tabby title="Overview"]</p>
    <!-- /wp:shortcode -->

    The tabby shortcodes should not be contained within paragraph tabs.

    There appears to be a group block defined which starts after the first [tabby] shortcode, and ends after the [tabbyending] shortcode. This is likely to produce incorrectly nested html which would prevent the tabs displaying correctly. The group block should contain either the entire tabgroup or only the content of a single tab.

    • This reply was modified 2 years, 3 months ago by cubecolour.
    Thread Starter Darrin

    (@darringoodman)

    Great, thank you! I will re-implement the block editor and try this again, using your suggestions. Thanks!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Not Working with Block Editor’ is closed to new replies.