Custom Elements not displayed when editing elements

Beaver Builder
1

Hi,

We are trying to integrate the builder with another theme using shortcodes.
It works perfectly, but we realized the following when adding those

However, for some elements (not all of them, probably use Javascript), when you add them, you get a white display.

But,
0) If you enter the page and enter Page Builder mode, those elements show up perfectly.
See screenshot:
1

  1. But, again, if you add/edit any element, doesn’t matter whichSee screenshot:
    screenshot 2

  2. The elements are gone from display, you need to refresh in Page builder mode
    See screenshot:
    3

Please explain what actually happens when a new element is added or edited.
It would be great if you have any idea how to fix this.

Cheers

2

Hi Elemento,

When you add or edit an element, the html, css and js gets refreshed. It looks like maybe your code for the circles is only firing the first time, but not when the layout is refreshed. I’m leaving town for a few days tonight, but if you email me a copy of the module, I can take a look when I’m back. My email address is justin [at] fastlinemedia [dot] com.

Thanks,
Justin

3

Additionally, you can tap into the fl-builder.layout-rendered event to run JavaScript code when the layout is refreshed. That would be done like so…

$( '.fl-builder-content' ).on( 'fl-builder.layout-rendered', function( e ){
    // Do stuff...
} );

Justin

4

Hi,

Sorry for the late reply.

I created the following demo
http://168.1.67.228/sites/beaver_issue_com/?page_id=74&fl_builder

user: demo
pass: demo

It seems that my code (custom.js) is fires only the first time, yes.

When you say the HTML, CSS and JS get refreshed (layout), in what way and what do you mean?
Would be happy for a bit more technical explanation.

Great to have this event: fl-builder.layout-rendered

Cheers

5

I solved the issue for this element.
Thank you :slight_smile:

6

Great! Thanks for letting me know.

Justin