Second image slider – Product page

Hey xrisoskoni,

Thank you for the inquiry.

You may need to create a new function and register it to an action hook called woocommerce_after_single_product_summary, then change its priority to 25 so that it renders after the related products.

add_action( 'woocommerce_after_single_product_summary', 'avia_woocommerce_output_another_image_slider', 25);
function avia_woocommerce_output_another_image_slider() {
    echo "do something here";
}

Best regards,
Ismael

Hi,

Thank you for the update.

Which specific slider are you trying to show? Maybe a screenshot of the product layout will help. You can use imgur, savvyify or dropbox for the screenshot.

If you want to display a product slider from the advance layout builder, you can adjust or replace the snippet above using the following code.

add_action( '<a href='https://refer.wordpress.com/r/84/woocommerce/' target='_blank' rel="nofollow">woocommerce</a>_after_single_product_summary', 'avia_<a href='https://refer.wordpress.com/r/84/woocommerce/' target='_blank' rel="nofollow">woocommerce</a>_output_another_image_slider', 25);
function avia_<a href='https://refer.wordpress.com/r/84/woocommerce/' target='_blank' rel="nofollow">woocommerce</a>_output_another_image_slider() {
    global $product;
    $cats = [];
    $terms = get_the_terms( $product->ID, 'product_cat' );

    foreach ($terms as $term) {
        $cats[] = $term->term_id;
        break;
    }

    $product_categories = implode(",", $cats);

    echo do_shortcode("[av_productslider categories='{$product_categories}' wc_prod_visible='' wc_prod_hidden='' wc_prod_featured='' wc_prod_additional_filter='' sort='0' prod_order='' items='9' offset='0' columns='3' image_size='<a href='https://refer.wordpress.com/r/84/woocommerce/' target='_blank' rel="nofollow">woocommerce</a>_thumbnail' control_layout='av-control-default' slider_navigation='av-navigate-arrows av-navigate-dots' nav_visibility_desktop='' nav_arrow_color='' nav_arrow_bg_color='' nav_dots_color='' nav_dot_active_color='' animation='fade' transition_speed='' autoplay='no' interval='5' alb_description='' id='' custom_class='' template_class='' av_uid='av-l6oqhd1o' sc_version='1.0']");
}

Best regards,
Ismael

Hi,
Thank you for your patience and the screenshot, the easiest way that I can think of to add a slider below the single product and above the related products and add this slider in the editor for the specific product is to use the Shortcode Wand to add the Easy Slider, I suggest the Easy Slider element because I believe that you are adding additional images for the current product, and I suggest using the Shortcode Wand so the product uses the woocommerce layout instead of converting it to a manual Advanced Layout Builder layout. Once we add the slider we will add a script in your child theme functions.php to place it between the product and the related products, please try these steps.
In the backend for a product add an Easy Slider using the Shortcode Wand:

after you have added your images, captions, and options, go to the advanced tab and add the custom class additional-slider:

once saved you will see the shortcode below your product description, then save the page:

this is the placement for the Easy Slider before adding the script in your child theme functions.php:

Now add this code to the end of your child theme functions.php file in WordPress ▸ Appearance ▸ Theme File Editor, please note that when you copy the code do so from the forum, not an email as the greater than symbols may paste incorrectly:

function custom_script_single_product_additional_slider() { ?>
  <script>
window.addEventListener('DOMContentLoaded', function() {
(function($){
  $('#top.single-product .additional-slider').insertAfter( ".container_wrap_first.template-shop > .container" );
})(jQuery);
});
 </script>
  <?php
}
add_action('wp_footer', 'custom_script_single_product_additional_slider');

This is the final placement of the Easy Slider on single product page with the script:

I have linked to my test page below for your review, please give this a try.

Best regards,
Mike

Hi,
Glad we were able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

Best regards,
Mike