0

Problem

I have a one-page layout that displays an accordion looking WP menu of my page titles. I'm using AJAX to load and display the corresponding page's WP content into a div thats get's inserted into the menu's list items, which is working.

The problem I have is this: I cannot get the third-party shortcodes to process using the AJAX call, instead they are rendered in their original state (ex: [buzzsprout]).

Something interesting to note, however, is that the native WP shortcodes seem to render fine (ex: [audio] as seen in the Latest Message tab). So it appears this is limited only to third party shortcodes from plugins.

Lastly, I've read multiple places that this may be a limitation due to the WP AJAX url not having access to all of WP environment, only the Admin as its called, but others have said this isn't true.

So, I'm curious...


Questions

  1. Is there any way to have AJAX process and render the third-party shortcodes used in a WP page's content?
  2. What is the best way to do that?

Here is my code...


JS

$("#tabs li a").click(function() {

    var id = ($(this).attr("data-id"));

    $.ajax({
        type: 'POST',
        url: ajax_object.ajax_url,
        data: {
            'action' : 'fetch_ajax_content',
            'id' : id
        },
        success:function(data) {
            $('.ajax-content').remove();
            $('#tabs li').removeClass('active');
            $('[data-id=' + id + ']').parent().append(data).hide();
            $('[data-id=' + id + ']').parent().addClass('active');
            $('.active').slideToggle();
        }
    });

});

PHP

if ( ! function_exists( 'vwo_enqueue_scripts' ) ) {

    function vwo_enqueue_scripts() {
        wp_enqueue_script( 'vwo-scripts', get_template_directory_uri() . '/js/scripts.js', array( 'jquery' ), '1.0', true );
        wp_localize_script( 'vwo-scripts', 'ajax_object', array( 'ajax_url' => admin_url( 'admin-ajax.php' ) ) );
    }

}

add_action( 'wp_enqueue_scripts', 'vwo_enqueue_scripts' );

 

function fetch_ajax_content() {

    if ( isset( $_POST ) ) {
        $id = $_POST['id'];
        $page = get_page( $id );
    ?>

    <div class="ajax-content">
        <?php echo apply_filters( 'the_content', $page->post_content ); ?>
    </div>

    <?php
    }

    die();
}

add_action( 'wp_ajax_fetch_ajax_content', 'fetch_ajax_content' );
add_action( 'wp_ajax_nopriv_fetch_ajax_content', 'fetch_ajax_content' );

Any help would be greatly appreciated, thanks!

  • 1
    you'll have to look at the plugin code to see how the shortcodes are registered. it's possible there's a check for some condition that isn't true on an ajax request. the other thing to note is that many shortcodes that rely on a javascript component won't work when not loaded in the context of a full page render. – Milo Aug 7 '17 at 16:43
  • @Milo, Thanks. You're probably in the right direction as the shortcodes not loading are in fact JS dependent in some way or another. So, is there a better way you're aware of to go about achieving this? Thanks again. – Aaron Lynch Aug 7 '17 at 17:09
  • If the shortcode is the ONLY thing in "the_content" you could try running the function do_shortcode instead of the filters. Also, as a troubleshooting step, I would try echoing the_content without ajax first, to make the shortcode works under normal circumstances – gdaniel Aug 7 '17 at 18:59
  • @gdaniel unfortunately the spec calls for mixed content to be used here. Thanks for the tip of outputting the_content without AJAX first, I hadn't done that in my initial troubleshooting. – Aaron Lynch Aug 7 '17 at 19:16
1

In general, sshortcodes are not a programming construct, they are content macros. As content macros, their viability in being used outside of their content context is limited. Simplistic shortcodes, like the gallery/audio/video (and I am not sure even about them) might "render" without context, but advanced ones will need a properly set loop, and calls to wp_head and wp_footer.

There is no simple general way to use shortcodes in situations they were not designed to be used in, and each individual shortcode you might want to force into "working" might require a good understanding of its own code, and enviroment requirements, something that you might be able to achieve if you build a site, but is probably hopeless task if you are trying to creat some general theme or plugin.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.