Поделитесь опытом как правильно вызывать шорткоды сгенерированные плагинами,темой в Wordpress.
Зачем нужно:
Имею Wordpress + плагин elementor + JupiterX тему.
В elementor можно создавать шаблоны блоков/секций и получать их шорткод для вызова.
Пример шорткода [elementor-template id="1824"]
.
По клику на кнопку хочу вызывать AJAX нужную секцию (секция содержит слайдеры, табы, посты) и вставить ее в тело страницы.
Читал кодекс wordpress https://codex.wordpress.org/AJAX_in_Plugins
Но до меня не дошло, как применить это здесь. Есть ли у кого-то подобный опыт? Можете ли выложить примеры кода с комментариями?
Как я пытался вызвать шорт код AJAX.
HTML
[SCode_ajax_footer]
PHP
<?php
/**
* Plugin Name: Ajax Shortcode
* Description:
* Plugin URI:
* Version: 16.02.2020
* Author:
* Author URI:
* License: GPLv3
*/
add_action('plugins_loaded', 'plugin_setup');
/**
* Plugin URL
*/
define('SRT_AJAX_SHORT_URL', plugin_dir_url(__FILE__));
$plugin_url = SRT_AJAX_SHORT_URL;
/**
* Regular plugin work
*/
function plugin_setup()
{
#SCode_ajax_footer
add_shortcode( 'SCode_ajax_footer', 'SCode_ajax_footer' );
#ajax_srt_footer
add_action( 'wp_ajax_ajax_footer','ajax_footer' );
add_action( 'wp_ajax_nopriv_ajax_footer', 'ajax_footer' );
}
/**
* ACTION Enqueue scripts
*/
function enqueue()
{
# jQuery will be loaded as a dependency
## DO NOT use other version than the one bundled with WP
### Things will BREAK if you do so
wp_enqueue_script(
'ajax-ft',
SRT_AJAX_SHORT_URL."ajax.js",
array( 'jquery' )
);
# Here we send PHP values to JS
wp_localize_script(
'ajax-ft',
'wp_ajax',
array(
'ajaxurl' => admin_url( 'admin-ajax.php' ),
'ajaxnonce' => wp_create_nonce( 'ajax_post_validation' )
)
);
}
/**
* SHORTCODE AJAX Footer
*/
function SCode_ajax_footer( )
{
$output = '<div id="srtAjaxFooter"></div> ';
return $output;
}
/**
* AJAX query About block
*/
function ajax_footer()
{
echo do_shortcode('[elementor-template id="16"]');
}
JS
/*
* @plugin Ajax Shortcode
*/
jQuery( document ).ready( function( $ )
{
$(window).load(function(e) {
/*
*callBack wpAjaxShortcode
*@param shorcodeName, containerId
*@return
*/
function ajaxCallBackShortcode(shorcodeName, containerId) {
$.post(
wp_ajax.ajaxurl,
{action: shorcodeName},
function( response )
{
// ERROR HANDLING
if( !response.success )
{
// No data came back, maybe a security error
if( !response.data )
$( containerId ).html( 'AJAX ERROR: no response' );
else
$( containerId).html( response.data.error );
}
else
$( containerId).html( response.data );
}
); // end post
}
let shorcodeName, containerId;
//callBack Footer
ajaxCallBackShortcode(shorcodeName = 'ajax_footer', containerId = '#srtAjaxFooter');
}); // end click
});
По сути он шорткод не вызывает. Сам шорткод сгенерирован темой.
Если я напишу свой плагин.
И перепишу Функцию
PHP
/**
* AJAX query About block
* Check for security and send proper responses back
*/
function ajax_footer()
{
$footer= '<div>Это код футера</div>';
wp_send_json_success( $footer);
}
То такая функция, отработает конечно же. И вставит на фронтенде
<div>Это код футера</div>
Подскажите, что делаю неправильно. Как вызвать на фронтенд шорткод сгенерированный темой ? [elementor-template id="16"]