woocommerce flexslider thumbnails not working

Woocommerce flexslider thumbnails not working

I’ve built an own theme for my WooCommerce store. At the moment I’ve made very few changes to the existing template files.

But I want to change the view of the image slider on the product page. At the moment, I’m using the basic output with some basic styling.

The problem is, that the thumbnails are shown in multiple rows if there are not fitting in a single row.

What I need, is a slider for the thumbnails. I tried to change the template file product-thumbnails.php . But it uses a function called wc_get_gallery_image_html . I don’t know how to change that in a good way.

Then I realized that WooCommerce uses the FlexSlider plugin. And this plugin could provide waht I want/need.

I just don’t know, how I could to add that behavior to my product image slider.

I saw that there is an example JS and HTML code in the example from above. But I don’t know how I could adapt it to my slider because my HTML output looks a lot different and renaming the IDs doesn’t work.

EDIT:

I found a way to add options to the slider. The answer is from here: https://stackoverflow.com/a/46448407/1788961

I added the following code (and it’s working) to add options to my slider:

The problem is, that I need to add options to the thumbnails as well. Is there any way to do that?

At the moment the HTML output looks like this:

EDIT: See above, the part below is not working. This is what I’ve tried:

Product Gallery Slider for Woocommerce

Descrizione

Too Many Product Images in your Product Gallery ? This plugin will add a carousel in your Product Gallery.

Plugin Features

  • Responsive Layout
  • Navigation support
  • Slider AutoPlay Options
  • Gallery Layout [Horizontal Silder]
  • Working with Most of Premium themes
  • Pro Features

  • Responsive Layout
  • Navigation support
  • Slider AutoPlay Options
  • Gallery Layout [Vertical(left,right) and Horizontal Silder]
  • On/Off LightBox Setting for Thumbnails images
  • Working with Most of Premium themes
  • Infinite Loop
  • Mouse Dragging option
  • RTL support
  • Support Video for Gallery
  • Thumbnails Hide option
  • Full Lightbox Control [12 options]
  • Support woocommerce default zoom option
  • Shortcode ready [Easy to use with any custom product page builder]
  • Get the Pro Version Now

    Screenshot (schermate di esempio)

    • Product Gallery Slider
    • Setting panel

    Installazione

    1. Upload woocommerce-product-gallery-slider folder to the /wp-content/plugins/ directory
    2. Activate the plugin through the ‘Plugins’ menu in WordPress

    You can install as others regular wordpress plugin. No different way. Please see on installation tab.

    Leave a Reply

    Your email address will not be published. Required fields are marked *