Shortcode not working on AJAX call WordPress
- SOLVED
Hi,
I have an AJAX call to load featured products and any user can navigate on them with a previous and next buttons. That is working fine but when I use a shortcode inside of the loop in the AJAX call is displaying as a string instead of showing up correctly.
JS
jQuery(document).ready(function ($) {
var offset= 0;
loadCurrentPage();
jQuery("#cargaNext, #cargaPrev").click(function(e){
offset = (jQuery(this).attr('id')=='cargaNext') ? offset + 4 : offset - 4;
if (offset < 0){
offset = 0;
}else{
loadCurrentPage();
}
e.preventDefault();
});
function loadCurrentPage(){
jQuery.ajax({
type: "post",
url: ajax_var.url,
data : {
action: ajax_var.action,
nonce : ajax_var.nonce,
offset: offset
},
success: function(result){
if(result){
//console.log(offset);
if(offset <= 0){
jQuery('#cargaPrev').addClass('disabled');
}else{
jQuery('#cargaPrev').removeClass('disabled');
}
jQuery('#cargaNext').removeClass('disabled');
jQuery('#listar-productos').html(result);
}else{
jQuery('#cargaNext').addClass('disabled');
jQuery('#listar-productos').html('<div class="col-12 text-center"><p>Lo sentimos, no hay más productos para cargar</p></div>');
}
}
});
}
});
Functions.php
//AJAX PRODUCTOS - JS
function my_load_scripts() {
wp_register_script('producto-ajax', get_theme_file_uri( 'js/productos-ajax.js'), array('jquery'));
wp_enqueue_script( 'producto-ajax', get_theme_file_uri( 'js/productos-ajax.js'), array('jquery'), filemtime(get_stylesheet_directory(). '/js/productos-ajax.js') );
wp_localize_script( 'producto-ajax', 'ajax_var', array(
'url' => admin_url( 'admin-ajax.php' ),
'nonce' => wp_create_nonce( 'my-ajax-nonce' ),
'action' => 'event-list',
'offset' => isset($_POST['offset']),
) );
}
add_action( 'wp_enqueue_scripts', 'my_load_scripts' );
// AJAX PRODUCTOS - TEMPLATE
function cargar_productos() {
$nonce = sanitize_text_field( $_POST['nonce'] );
if ( ! wp_verify_nonce( $nonce, 'my-ajax-nonce' ) ) {
die ();
}
$offset = $_POST['offset'];
$args = array(
'post_type' => 'product',
'post_status' => 'publish',
'posts_per_page' => 4,
'order' => 'DESC',
'offset' => $offset
);
$query = new WP_Query( $args );
if ( $query->have_posts() ):
while ($query->have_posts()):
$query->the_post();
wc_get_template_part( 'content', 'product' );
endwhile;
endif;
wp_die();
}
add_action( 'wp_ajax_event-list', 'cargar_productos' );
add_action( 'wp_ajax_nopriv_event-list', 'cargar_productos' );
Template Part
<div class="col-6 col-lg-3 mb-5">
<div class="card rounded-lg">
<div class="card-body text-center">
<a href="<?php echo esc_url( get_permalink( $product->get_id() ) ); ?>">
<?php echo $product->get_image('woocommerce_thumbnail', array('class' => 'img-fluid')); ?>
</a>
</div>
<div class="card-body pt-0">
<a class="card-text" href="<?php the_permalink();?>"><?php echo $product->get_title(); ?> <?php //echo apply_filters( 'woocommerce_short_description', $post->post_excerpt )?></a>
</div>
<div class="card-body border-top d-flex justify-content-between">
<div class="d-flex justify-content-center w-100 flex-column flex-md-row">
<?php echo do_shortcode('[yith_ywraq_button_quote]');?>
<?php do_action( 'woocommerce_after_shop_loop_item' );?>
</div>
</div>
</div>
</div>
Anyone knows how to solve that?
Answers (3)
Bob answers:
Are you using elementor ?
[yith_ywraq_button_quote] shortcode works in premium version only.
do you have free or premium version?
can you try putting shortcode in page or post directly and see if get any result or not?
few more details in documentation
Make sure you enter the product’s ID with the parameter “product” to link the button to the right product in your WooCommerce. For example: [yith_ywraq_button_quote product="1234"] will let your users add product with ID 1234 to the cart.
However, it is not necessary to enter the product ID when using the shortcode on a standard WooCommerce product page, as it will automatically link the button to the product it belongs to.
Bob comments:
If you are using premium version can you please try
YITH_YWRAQ_Frontend()->print_button( false );
you can supply product id instead of false too.
You can try below code too.
echo apply_filters('the_content', '[yith_ywraq_button_quote]');
alonso comments:
Thank you for your answer and I tried to use both but nothing happens,
I'm not using a page builder I built the theme by my own and this is the link if you wanna check something
https://lampara.site/igalchile/
Bob comments:
Is it possible for you to provide access of site?
Have you tried putting that shortcode in any page or post from editor?
Bob comments:
On your webpage I see javascript error too.
"Uncaught SyntaxError: Unexpected token '.'" Index (94)
the code line is
var ajax_var.url = 'https://lampara.site/igalchile/wp-admin/admin-ajax.php';
Have you activated yithemes licence for premium plugin?
Arnav Joy answers:
can you please show me url of your site?
alonso comments:
Yes of course, this is the url to my site:
https://lampara.site/igalchile/
I was reading that using admin-ajax.php not render properly shortcodes because admin-ajax is for the admin area and there the shortcode is only a string
'url' => admin_url( 'admin-ajax.php' ),
Mohamed Ahmed answers:
Hello Alonso,
Could you change the template part to this code
<div class="col-6 col-lg-3 mb-5">
<div class="card rounded-lg">
<div class="card-body text-center">
<a href="<?php echo esc_url( get_permalink( $product->get_id() ) ); ?>">
<?php echo $product->get_image('woocommerce_thumbnail', array('class' => 'img-fluid')); ?>
</a>
</div>
<div class="card-body pt-0">
<a class="card-text" href="<?php the_permalink();?>"><?php echo $product->get_title(); ?> <?php //echo apply_filters( 'woocommerce_short_description', $post->post_excerpt )?></a>
</div>
<div class="card-body border-top d-flex justify-content-between">
<div class="d-flex justify-content-center w-100 flex-column flex-md-row">
<?php echo do_shortcode('[yith_ywraq_button_quote product="' . $product->get_id() . '"]');?>
<?php do_action( 'woocommerce_after_shop_loop_item' );?>
</div>
</div>
</div>
</div>
Mohamed Ahmed comments:
Have you activated yithemes licence for premium plugin?
alonso comments:
Yes it has been activated with a Yith's license.
I was reading that using admin-ajax.php not render properly shortcodes because admin-ajax is for the admin area and there, shortcodes are only a string but i'm not sure how to change it to make it work