Вывод содержимого поста на Wordpress + Ajax + Visual Composer

235
20 апреля 2018, 14:06

Уже два дня ломаю себе голову :( Задача такая: нужно в блок по клику на ссылку поста выводить содержимое поста с учетом шорткодов и стилей Visual Composer. Перерыл весь интернет, нашёл решение, которое не удалось под себя адаптировать. Получилось подтянуть ajax`ом содержимое поста с учетом шорткодов VC, но стили вытянуть не удаётся.

Код function.php

add_action( 'wp_enqueue_scripts', 'theme_register_scripts', 1 );
function theme_register_scripts() {
  /** Register JavaScript Functions File */
  wp_register_script( 'functions-js', esc_url( trailingslashit( get_template_directory_uri() ) . 'functions.js' ), array( 'jquery' ), '1.0', true );
  /** Localize Scripts */
  $php_array = array( 'admin_ajax' => admin_url( 'admin-ajax.php' ) );
  wp_localize_script( 'functions-js', 'php_array', $php_array );
}
/** Enqueue Scripts. */
add_action( 'wp_enqueue_scripts', 'theme_enqueue_scripts' );
function theme_enqueue_scripts() {
  /** Enqueue JavaScript Functions File */
  wp_enqueue_script( 'functions-js' );
}
add_action('wp_ajax_my_action', 'data_fetch');
add_action('wp_ajax_nopriv_my_action', 'data_fetch');
function data_fetch($postID){
$postID=intval( $_POST['param'] );
?>
<?php
$args = array(
'p' => $postID,
'post_type' => 'any'
);
$recent = new WP_Query($args);
WPBMap::addAllMappedShortcodes(); //Включает обработку шорткодов
while ( $recent->have_posts() ) : $recent->the_post();
    $content = apply_filters('the_content', $post->post_content);
?>
<div>
<?php the_title( '<h2>', '</h2>' ); ?>
</div>
<div class="row">
<div class="col-lg-3">
<img src="<?php echo get_the_post_thumbnail_url(); ?>" class="instaupp-img img-circle">
</div>
<div class="col-lg-9">
<p><i>Описание</i></p>
<?php the_content(); ?>
</div>
</div>
<?php endwhile; ?>
<?php
wp_die();
}

Код JS (кладет результат в блок .modal-content.ajax)

function fetch(e){
var param = $(e.target).attr('data-ajax-param'); // Находим id поста по нажатию кнопки. У кнопки должен быть атрибут data-ajax-param равный id поста, например, data-ajax-param="11"
$.post('../wp-admin/admin-ajax.php', {'action':'my_action', 'param':param}, function(response){
$('.modal-content.ajax').html(response);
});
}

$( '[data-ajax-param]' ).click(function (e) {
fetch(e);
});

HTML

<div class="modal-content ajax""></div>
<div><span data-ajax-param="ID поста">Читать далее....</span></div>

Использовал статью, возможно в ней не правильный подход - КЛИК

Решение которое нужно адаптировать, запустить его без адаптации не получилось - КЛИК

В последнем, как мне кажется, за вытягивание css отвечает вот этот код (но не уверен):

WPBMap::addAllMappedShortcodes();
$content = apply_filters( 'the_content', $content );
$css = get_post_meta( $post_id, '_wpb_shortcodes_custom_css', true );
echo wp_json_encode( array(
    'css'               => ! empty( $css ) ? '<style>'.$css.'</style>' : '',
    'content'           => do_shortcode( $content )
) );

Знаний для решения этой задачи у меня не достаточно, надеюсь местные гуру мне смогут помочь) Заранее спасибо!

Answer 1

Вытащить css удалось с помощью кода

$css = get_post_meta( $postID, '_wpb_shortcodes_custom_css', true  );
echo '<style>'.$css.'</style>'

И теперь нужно подключить стили используемые VC и аддонами на страницу, где происходит вызов через Ajax. Проблема решена

READ ALSO
Совместимость jquery

Совместимость jquery

есть старый сайт, в котором кнопки которые вызывают popup с формами работают с jquerylib

182
Как сделать счетчик чтобы он обнулялся в 00:00?

Как сделать счетчик чтобы он обнулялся в 00:00?

Всем привет, помогите пожалуйста со счетчиком

203
Рисование таблиц на сайте онлайн

Рисование таблиц на сайте онлайн

Есть сервис по онлайн редактированию документов с различными возможностями включая создание таблицХочется реализовать возможность рисования...

182
Не заходит в блок each

Не заходит в блок each

Здравствуйте! Задача состоит в том, чтобы добавить посты после клика на кнопку при помощи ajaxФайл обработчик работает исправно (как мне кажется)

229