Error editing components when Elementor is active

Beta
#1

I have a site that I am wanting to slowly migrate from Elementor to Cornerstone, which means having both builders active at the same time.

For regular pages, this works fine, and I am able to edit them in Cornerstone whilst also having access to edit the Elementor pages too.

However, I am unable to access and edit the Component sets in Cornerstone whilst Elementor is active. Instead, it just loads an uneditable homepage and shows the ‘No suitable preview area found.’ error:
image

I did some digging in the hooks and filters applied by Elementor and Cornerstone, and after some tinkering I have found that the problem is in the filters being added to the_content during the template_redirect action.

This filter is added in the class cornerstone/includes/classes/Services/Preview.php at line 167
add_filter( 'the_content', [ $this, 'output_content_zone' ], -9999999 );

And that is being overridden by the filter below which is called via add_content_filter() from elementor/includes/frontent.php on line 1061
add_filter( 'the_content', [ $this, 'apply_builder_in_content' ], self::THE_CONTENT_FILTER_PRIORITY );
THE_CONTENT_FILTER_PRIORITY resolves to 9

To fix this, it was possible to just change the priority of the output_content_zone to anything higher than the 9 of the Elementor content filter.

However, to try and avoid any conflict that might cause, I put the following code just after the isComponent() conditional, as the error is only happening when trying to edit components in Cornerstone whilst Elementor is active:

if ( did_action( 'elementor/loaded' ) && !empty( $this->state['docTypeInfo']) && !empty( $this->state['docTypeInfo']['regions']) && in_array( 'content', $this->state['docTypeInfo']['regions'], true ) ) {
    remove_filter( 'the_content', [ $this, 'output_content_zone' ] );
    add_filter( 'the_content', [ $this, 'output_content_zone' ], 10 );
}

Obviously this is not a sustainable fix as I am editing Core Theme files. However, I wonder if it would be possible for you to look into this and see if a more sustainable fix can be implemented to allow Elementor and Cornerstone to work together a bit more? Especially to help people migrate away from Elementor over to Cornerstone and make full use of all the wonderful features available with Components :wink:

I have tried to fiddle a way of getting the Elementor filter removed via an action in my child theme functions.php, or re-adding the Cornerstone output_content_zone function with higher priority via my child theme functions.php, but I have had no luck.

If there is a way to implement this in the core theme, or a better way to add it to the child theme, that would be amazing!

#2

This wasn’t happening to me on an Element + Pro site. Did you have any special Elementor settings? I think I’m just going to give you a filter to change that priority number. I’ll keep you updated on what it’s called.

#3

Unfortunately this is a website that we are inheriting and wanting to migrate over to Cornerstone, so I’m not sure exactly how the setup differs from a vanilla install.

I will continue to investigate if there is a specific setting that causes the issue.

A filter is a great solution as well, much appreciated!

1 Like
#4

I decided on the name cs_preview_output_zone_priority. You’ll see it in Pro 6.5.4. Have a great day.

add_filter('cs_preview_output_zone_priority', function() {
  return 11;
});
1 Like
#5

Fantastic, thanks for adding this in! It’s much appreciated, and I hope it helps others too!

1 Like