Home › Forums › WoodMart support forum › Displaying Custom Product Slider on Single Product Page

Displaying Custom Product Slider on Single Product Page

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • April 4, 2021 at 8:02 pm #278816

    tchock
    Participant

    Hello – I am storing an array of product id’s for “Product Accessories” that I’d like to display as a slider on the single product page. I’m testing a snippet using the standard WooCommerce shortcode for displaying products (https://docs.woocommerce.com/document/woocommerce-shortcodes/).

    This is displaying a grid, but it won’t render the attributes for product count, columns, etc so it’s just displaying as a giant 2 column grid.

    How can I display a 4 column product slider just like the “Related Products” slider included with the theme?

    By the way, I’m using Elementor – is there a shortcode for Elementor or the Woodmart theme that I can use or is this accomplished with a different method?

    add_action( 'woocommerce_after_single_product_summary', 'output_product_accessories', 5 );
 
function output_product_accessories() {
  
echo "TEST";  
echo do_shortcode('[products limit="4" columns="4" paginate="false" orderby="popularity" class="quick-sale" on_sale="true" ]');
}

    Thanks!

    April 5, 2021 at 7:41 am #278879

    Artem Temos
    Keymaster

    Hello,

    We recommend you create an HTML block and use our Products grid/carousel element to display your products. You can read information about this element in our documentation https://xtemos.com/docs/woodmart/faq-guides/product-grid-carousel-element/
    Note that it works both for WPBakery page builder and for Elementor.
    Then, you can use your HTML Block’s shortcode and place it whenever you need it.

    Kind Regards

    April 5, 2021 at 4:00 pm #279057

    tchock
    Participant

    Thank you for your reply. I need to be able to pass product IDs or SKUs to the carousel. Is there a shortcode for the carousel element itself? I am using Elementor page builder if that matters.

    April 6, 2021 at 6:18 am #279145

    Artem Temos
    Keymaster

    Yes, our element has an option for this. Check the screenshot https://prnt.sc/115g9q1

    April 6, 2021 at 3:12 pm #279365

    tchock
    Participant

    I’d appreciate it if you would review the thread before replying.

    I need to create a slider that will display “Product Accessories” on the single product page. I need this to display just like the Related Products carousel with 1 row, 4 columns. These accessory ID’s will be stored in a custom field (array). I created a PHP snippet to display the slider, but I need the shortcode or equivalent for the slider element so that I am able to pass the IDs to it programmatically. As far as I can tell the Elementor element you linked does not allow dynamic content.

    rough example:

    add_action( 'woocommerce_after_single_product_summary', 'output_product_accessories', 5 );
 
function output_product_accessories() {
echo "<h2>Product Accessories</h2>" 
echo do_shortcode('[need_this_shortcode ids="$product_ids_array"]');
}

    So you can see I need something that will generate the slider that I can pass IDs or SKUs to via PHP.

    Thanks

    April 7, 2021 at 10:40 am #279581

    Artem Temos
    Keymaster

    Hello,

    In this case, please, update the theme to the latest 6.0 version and try to use the native WooCommerce shortcode. We have fixed the problem with columns so it should work well now.

    Kind Regards

    April 7, 2021 at 6:47 pm #279840

    tchock
    Participant

    awesome! working perfectly now thanks

    April 8, 2021 at 9:46 am #280045

    Artem Temos
    Keymaster

    Great, you are welcome!

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)

The topic ‘Displaying Custom Product Slider on Single Product Page’ is closed to new replies.