Support » Plugin: WordPress Page Builder - Beaver Builder » Ajax nav strips accordion function and styling in BB?

  • deeve

    (@deeve)



    Hi just wondered how to deliver an accordion using BB within an AJAX driven site as it seems to strip all JS function & CSS styling. I read somewhere that the required scripts are compiled into the output BB code but feels like they therefore need to be enqueued when using AJAX to deliver content.

    Any suggestions?

Viewing 15 replies - 1 through 15 (of 15 total)
  • Plugin Author Justin Busa

    (@justinbusa)

    Hey @deeve!

    It sounds like you’re trying to load a BB layout via AJAX, is that correct? If so, you’ll need to send along the scripts and styles too (similar to shortcodes that enqueue assets).

    There are a number of ways to do that. I haven’t tested this but something like it should work…

    FLBuilder::enqueue_layout_styles_scripts_by_id( $post_id );
    
    ob_start();
    wp_print_styles();
    wp_print_scripts();
    $assets = ob_get_clean();

    Let me know if you have any questions about that!

    Justin

    • This reply was modified 9 months ago by  Justin Busa.
    deeve

    (@deeve)

    Hi @justinbusa, many thanks for your reply.
    Yes, I am trying to use AJAX to load pages as I need to have a constant div audio player on my site & the only way I can find to enable this is to load all page content with AJAX.
    I read somewhere BB compiles page/module specific scripts into the META? Where would your code to enqueue need to be placed? Normally in WP it’s functions.php?
    Thanks,

    deeve.

    Plugin Author Justin Busa

    (@justinbusa)

    Hey @deeve,

    Could you post your AJAX code? I can take a look at that and see about working in the css/js logic for you.

    Justin

    Hi @justinbusa, I’m using the Advanced AJAX Page Loader plugin and thought I could possibly enqueue the required scripts/css per module or even globally?

    I’ve done a lot of searching online for an answer to this scenario & can’t believe I’m the first person to encounter this problem?

    deeve

    Plugin Author Justin Busa

    (@justinbusa)

    Thanks, @deeve. Since you’re fine with enqueuing them globally, you could try doing this…

    add_action( 'wp_enqueue_scripts', function() {
        FLBuilder::enqueue_layout_styles_scripts_by_id( $post_id );
    } );

    Just replace $post_id with the post ID for your Beaver Builder layout and the css/js should get enqueued.

    Let me know how that goes!

    Justin

    Hi @justinbusa, many thanks for that. Just tried and yes, it did load the Tabs/Accordion correctly (visually) on first load but thereafter none of the functions worked – links were dead. I’ve also noted that on several other pages the CSS styling is no longer there and the slide in/out function on the nav pane of the hamburger menu no longer slides in or out after the page loads.

    I would share a link with you but unfortunately this is on a live site & I have to pick my moments to perform these tests.

    deeve

    Plugin Author Justin Busa

    (@justinbusa)

    Hey @deeve,

    This is going to be tricky without being able to see what the issue with the site is. Do you have a staging site we can check?

    Justin

    Hi @justinbusa, there wasn’t one made by the original designer so I’ll put one together to show you what’s not happening. Will let you know on here when I’ve managed to get one sorted.

    deeve

    Plugin Author Justin Busa

    (@justinbusa)

    Hey Steve,

    Sure thing. I’ll shoot you an email.

    Justin

    Moderator Jan Dembowski

    (@jdembowski)

    Brute Squad and Volunteer Moderator

    Please don’t post email addresses in these forums. If the author likes, he can post a contact URL or even his own email address. Though I’d go with a URL myself.

    Apologies. I would have contacted Justin directly on here via a pm, had the forum offered that ability.

    Moderator Jan Dembowski

    (@jdembowski)

    Brute Squad and Volunteer Moderator

    PM? It’s not really that complicated. The plugin page has a link to the author’s site.

    https://wordpress.org/plugins/beaver-builder-lite-version/

    Visit that link and on the author’s site you’ll see “Contact” on the top right of that page. You don’t need PM here as the author already publishes a simple way to contact them.

    @jdembowski I think you’ll find that contact form is for support for the paid program as opposed to the WordPress free plugin, of which this forum happens to be listed as the specific support forum on the plugin page itself. Or am I wrong?

    • This reply was modified 8 months, 1 week ago by  deeve.
    Moderator Jan Dembowski

    (@jdembowski)

    Brute Squad and Volunteer Moderator

    You’re wrong. 😉

    Greenshot 2018 04 10 07 15 13

    Here’s the thing: you want the author to contact you. You posted an email. I asked you not to do that. You replied there’s no PM. I replied we don’t need PM. Here we are.

    I review lots in these forums and the plugin author for this plugin is amazingly responsive and open to contact. But my original point (which we’re going in circles about here) is really simple.

    Don’t post email addresses in these forums. Theme and plugin author’s may in their sub-forum if they choose but a contact URL usually makes more sense.

    Plugin Author Justin Busa

    (@justinbusa)

    Hey @deeve,

    Thanks for the example. I’ve got a good idea what’s going on now. The JS for the accordion is being loaded and runs on first page load. If the accordion HTML isn’t present then the click events for the tabs won’t be set when the JS loads.

    So unfortunately, loading the JS globally isn’t going to work here. You might ask the plugin author if there is a hook available so you can send along the CSS/JS with the HTML using the example in my first reply. Let me know how that goes!

    Justin

Viewing 15 replies - 1 through 15 (of 15 total)
  • The topic ‘Ajax nav strips accordion function and styling in BB?’ is closed to new replies.