[Resolved] Toolset popup in Beaver Builder editor broken

[Author]

Posts

[gayleS]

This ticket is to reopen "Toolset Fields & Views popup in Beaver Builder editor broken".

We added the code in the functions.php file that Toolset support suggested in https://toolset.com/forums/topic/toolset-fields-views-popup-in-beaver-builder-editor-broken/#post-2704337, but unfortunately, the issue persists.

[Minesh]

Hello. Thank you for contacting the Toolset support.

I checked and I can see the issue and I will get back to you with my findings as soon as I can.

[Minesh]

I'm able to hook in the required CSS and I can see the popup with better view:

I've added the following hook code to "Custom Code" section offered by Toolset:
- hidden link

function func_enqueue_missing_field_and_text_toolset_shortcodes_css() {
  
  if(!is_admin()) {
       
  wp_enqueue_style( 'toolset-shortcode-css',plugins_url().'/cred-frontend-editor/vendor/toolset/toolset-common/res/css/toolset-shortcode.css', array(), false, 'all');
    wp_enqueue_style( 'toolset-dialogs-overrides-css-css', plugins_url().'/cred-frontend-editor/vendor/toolset/toolset-common/res/css/toolset-dialogs.css', array(), false, 'all');
    
  }
}
add_action( 'wp_enqueue_scripts', 'func_enqueue_missing_field_and_text_toolset_shortcodes_css');

When checking on frontend I can see better layout now:
- hidden link

But, still its not the complete solution as its still not displaying the shortcodes popup correctly like closing button CSS missing etc..etc.

I will take this further in the mean time can you confirm you see improvement with the shortcode popup.

[gayleS]

Hi Minesh,
This code can fix the issue, but it is not an optimized solution because it loads the CSS files for all users, including non-admin users. We need to update the code so that it only loads the CSS files when required. Additionally, the heading and the close button are still broken as you said.

[Minesh]

I've escalated the issue to our next level support. I'll get in touch with you as soon as I see any updates with our internal ticket.

[Minesh]

As a workaround - what if you try to use the following code that should help you to fix the issue:

function func_enqueue_missing_field_and_text_toolset_shortcodes_css() {
  
  if(!is_admin() and  (isset($_GET['fl_builder']) or isset($_GET['fl_builder_ui'])) ) {
      
     wp_enqueue_style('wp-jquery-ui-dialog',site_url().'/wp-includes/css/jquery-ui-dialog.css', array(), false, 'all');
    
      wp_enqueue_style( 'toolset-shortcode-css',plugins_url().'/cred-frontend-editor/vendor/toolset/toolset-common/res/css/toolset-shortcode.css', array(), false, 'all');
    
  }
}
add_action( 'wp_enqueue_scripts', 'func_enqueue_missing_field_and_text_toolset_shortcodes_css');

[Minesh]

In this change between versions 2.7.1.1 and 2.7.2 Beaver Builder removed (not dequeued: they deregistered) a key asset that we need to properly style our shortcodes dialogs.
- https://plugins.trac.wordpress.org/changeset/2960777/beaver-builder-lite-version/trunk/classes/class-fl-builder-compatibility.php

Apparently, given the comment on the line, it was to avoid some compatibility issues with other third party plugins.

I would kindly suggest you to explain this situation to the BB support team and request that they keep the style registered. Third parties, besides us, might be using it, and if it is causing conflicts with their UI then, well, their UI should just play nice with this core style.

The fix should rely on B