Wie Visual Composer während der Verwendung von AJAX in WordPress geladen werden

Question

Ich verwendete eine AJAX-Anfrage in Wordpress, um den Inhalt eines Beitrags zu erhalten, in diesem Beitrag habe ich den Visual Composer verwendet. aber der Inhalt zeigt nur die VC mit Kurzwahlnummern, um sie auf den realen Inhalt zu ändern .. Das ist der Code, den ich verwenden

add_action('wp_ajax_drpk_custom','drpk_custom'); 
add_action('wp_ajax_nopriv_drpk_custom','drpk_custom'); 
function drpk_custom(){ 
if(isset($_REQUEST)){ 
    $id = $_REQUEST['id']; 

    $query = new WP_Query(array('p'=>$id)); 
    if($query->have_posts()): 
     while($query->have_posts()): $query->the_post();?> 
     <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
     <h4 class="modal-title" id="myModalLabel"><?php the_title() ?></h4> 
     </div> 
     <div class="modal-body"> 
     <?php the_content() ?> 
     </div> 
     <?php endwhile; 

    endif; 
} 
wp_die(); } 

Und dieser Code jQuery

$('.cart-item').find('a').on('click',function(){ 
    var postID  = $(this).data('id'), 
     ajaxContent = $('.modal-content'); 
     $.ajax({ 
      url: ajaxUrl.url, 
      data: { 
       'action' : 'drpk_custom', 
       'id': postID 
      }, 
      beforeSend: function(){ 
       // $load.fadeIn(500); 
      }, 
      success: function(data){ 
       // $load.hide(); 
       ajaxContent.html(data); 
      } 
     }); 
    }); 

kehrt aber wie die

[vc_row][vc_column width=”1/4″][vc_single_image image=”389″ img_size=”full” alignment=”center” onclick=”custom_link” img_link_target=”_blank” link=”#”][/vc_column][vc_column width=”1/4″][vc_single_image image=”390″ img_size=”full” alignment=”center” onclick=”custom_link” img_link_target=”_blank” link=”#”][/vc_column][vc_column width=”1/4″][vc_single_image image=”391″ img_size=”full” alignment=”center” onclick=”custom_link” img_link_target=”_blank” link=”#”][/vc_column][vc_column width=”1/4″][vc_single_image image=”392″ img_size=”full” alignment=”center” onclick=”custom_link” img_link_target=”_blank” link=”#”][/vc_column][/vc_row] 

Answer 1

Seit Version 4.9 Visual Composer hinzugefügt Shortcode Lazy Loading. VC Shortcodes auf AJAX Inhalt zu verwenden, um diese Funktion vor dem Drucken des Inhalts WPBMap::addAllMappedShortcodes();

add_action('wp_ajax_drpk_custom','drpk_custom'); 
add_action('wp_ajax_nopriv_drpk_custom','drpk_custom'); 
function drpk_custom(){ 
if(isset($_REQUEST)){ 
    $id = $_REQUEST['id']; 

    $query = new WP_Query(array('p'=>$id)); 
    if($query->have_posts()): 
     while($query->have_posts()): $query->the_post(); 
      WPBMap::addAllMappedShortcodes(); 
     ?> 
     <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
     <h4 class="modal-title" id="myModalLabel"><?php the_title() ?></h4> 
     </div> 
     <div class="modal-body"> 
     <?php the_content() ?> 
     </div> 
     <?php endwhile; 

    endif; 
} 
wp_die(); } 

Answer 2

if(class_exists('WPBMap') && method_exists('WPBMap', 'addAllMappedShortcodes')) { // 1.17c. FIxes issues with ajax hopefully. 

       WPBMap::addAllMappedShortcodes(); // this is needed to ensure wc shortocdes come out right. 

      } 

Dies wäre, was Sie tun wollen würde zu. Ich weiß nicht, warum persönlich, aber es funktioniert so lange, wie Sie eine Methode und Klassenprüfung vor dem Einleiten des Anrufs verwenden. Meine Vermutung wäre etwas mit den Filtern/Hooks vor dem Ajax-Callback ausgeführt werden.

Außerdem sollte beachtet werden, dass wenn Sie eine Schleife außerhalb der Hauptabfrage über Ajax ausführen, dies nach jeder $ query-> the_post() ausgeführt werden soll, da dies Kontext für Funktionen wie the_title() einrichtet ;

Answer 3

auf über Lösungen zu erweitern, wenn die Post Sie verwenden benutzerdefinierte CSS-Style-Änderungen wie Rand hat, Hintergrund, etc .. Sie werden erhalten müssen die benutzerdefinierte CSS get_post_meta($pid, '_wpb_shortcodes_custom_css', true);

Beispiel für die Verwendung: