Visual Composer Grid with do_action shortcode is not working

Question

I have visual composer which is packed with total theme. When I put the following grid short code in my page in the editor it works correctly.

[vc_basic_grid post_type="post_type" max_items="10" item="masonryGrid_SlideFromLeft" grid_id="vc_gid:1458178666639-80ebf3775500c87d35de078c3422fe96-10" taxonomies="555"]

However, when I call the exact same code using do_action it gives the following javascript error. I checked the html output and it is the same using do_action like putting the short code in editor.

Error: Syntax error, unrecognized expression: {'status':'Nothing found'} s

Any help is greatly appreciated.

Answer 1

Well, you can't output contents directly in your templates by using core shortcodes of VC like that.

1. Problem:

For security, besides nonce, VC uses page_id and shortcode_id to check AJAX request/respond data.

The shortcode_id is automatically generated by VC, you can not harcode it.

For example, this is the shortcode you see on admin editor screen:

[vc_basic_grid post_type="post_type" max_items="10" item="masonryGrid_SlideFromLeft" grid_id="vc_gid:1458178666639-80ebf3775500c87d35de078c3422fe96-10" taxonomies="555"]

Let say the page ID is 4269, this is the generated HTML code on front-end:

<!-- vc_grid start -->
<div class="vc_grid-container-wrapper vc_clearfix">
    <div class="vc_grid-container vc_clearfix wpb_content_element vc_masonry_grid" data-initial-loading-animation="zoomIn" data-vc-grid-settings="{"page_id":4269,"style":"all-masonry","action":"vc_get_vc_grid_data","shortcode_id":"1458178666639-80ebf3775500c87d35de078c3422fe96-10","tag":"vc_masonry_grid"}" data-vc-request="http://example.com/wp-admin/admin-ajax.php" data-vc-post-id="4269" data-vc-public-nonce="0641473b09">
    </div>
</div>
<!-- vc_grid end -->

Now, if page_id and shortcode_id don't match each other, {'status':'Nothing found - $shorcode_id'} will be throw out and no contents will be displayed.

You can find out more inside vc_grid.min.js file.

2. Solution:

• Generate a fake page with VC, then copy generated html code to your template file.
• Create a template with VC directly.
• Use Shorcode Mapper to create your own shorcode.

Answer 2

First you build a new page and add a grid post on it, then we get

_vc_post_settings

post meta , and try to build a new one then update post meta data now we can by pass VC Ajax security check in the following code "1513628284966-37b8c3ca-d8ec-1" is VC generated guid you should change it to yours .

$meta = get_post_meta(1365,'_vc_post_settings');
 $settings = array();
 #$settings['vc_grid_id'] = $meta[0]['vc_grid_id'];
 $key = random_int(1513628284966,9513628284966);
 $settings['vc_grid_id']['shortcodes'][''.$key.'-37b8c3ca-d8ec-1'] = $meta[0]['vc_grid_id']['shortcodes']['1513628284966-37b8c3ca-d8ec-1'];
 $settings['vc_grid_id']['shortcodes'][''.$key.'-37b8c3ca-d8ec-1']['atts']['custom_query'] = "tag=shop";
 $settings['vc_grid_id']['shortcodes'][''.$key.'-37b8c3ca-d8ec-1']['atts']['grid_id'] = ''.$key.'-37b8c3ca-d8ec-1';
$n = add_post_meta(1365,'_vc_post_settings',$settings);


return do_shortcode("[vc_basic_grid post_type=\"custom\" show_filter=\"yes\" filter_style=\"dropdown\" item=\"5959\" grid_id=\"vc_gid:".$key."-37b8c3ca-d8ec-1\" filter_source=\"post_tag\" custom_query='tag=".$tag."']");